通过CoolPush实时推送hexo评论

说明：距离该文章发布已经过很长时间，无法保证内容的时效性。

更新

出于安全考虑，不建议把以下所有内容暴露在前端。

2020.12.17：修改了javascript代码，现在推送成功率非常高。

前言

在博客创建以来，我一直在探索hexo的各种新功能。启用了Valine评论插件以来，多次尝试实时推送评论的方案。

①Server酱：借助leancloud配置变量，成功推送评论到微信，但是卡片不会显示详情，需要多点击一次，觉得不方便，故弃用；

②Qmsg酱：参考了多个文档多次配置，但是评论测试时，日志显示：

QQ提醒失败: Request failed with status code 404

我认为可能是Qmsg酱推送出了故障，于是弃用。事实上是接口地址改了，最新配置方法：点这里。

③CoolPush：这是我无意中发现的一个推送服务，由大佬@xuthus开发，能够实时推送评论相关内容到QQ。

操作

①我是采用的hexo+volantis主题，volantis内置了许多第三方评论插件，我启用的是valine。其它主题可能略有不同。

②打开https://cp.xuthus.cc/ ，登陆，可以选择github、gitee和OSC登陆；

②绑定QQ号，选择机器人并添加机器人为好友；

绑定QQ和选择机器人

③点击上方说明，下拉到“配合valine进行推送”，复制框内代码粘贴到script.ejs底部，将skey替换成你自己的，路径：

你的博客\themes\volantis\layout\_third-party\comments\valine\

④需要注意的是，目前（2020.11.30 13:00），大佬提供的js脚本需要稍稍修改，否则会提示：

Uncaught TypeError: Cannot set property 'onclick' of undefined

通过搜索，学习csdn上的一篇文章，发现需要用window.οnlοad=function(){ }将代码包裹。

更新

2020.12.17更新：

请教了valine群里的大佬，大佬说：“原因就是 Valine 的评论框是动态加载的，你的事件定义的时候 Button 还没有出来呢，所以找不到这个元素，所以需要使用事件委托。”

故新版完整代码如下：

<script>
  var pushLink ="https://push.xuthus.cc/send/替换你的key";
  var siteName = "W4J1e's blog";
  var valineButton=document.getElementsByClassName("vsubmit vbtn")[0];
  var title = siteName + "上又有新评论啦~!\n";

  function send_valine() {
    //获取元素信息
    var pagename = document.title;
    var pageurl = document.URL;
    var pushtime = new Date();
    var vnick = document.getElementsByClassName("vnick vinput")[0].value;
    var vmail = document.getElementsByClassName("vmail vinput")[0].value;
    var vlink = document.getElementsByClassName("vlink vinput")[0].value;
    var veditor = document.getElementsByClassName("veditor vinput")[0].value;
    content =
      title +
      "昵称：" + vnick +
      "\n邮箱：" + vmail +
      "\n网站地址：" + vlink +
      "\n文章标题：" + pagename +
      "\n评论内容：" + veditor +
      "\n文章链接：" + pageurl +
      "\n评论时间" + pushtime.toLocaleString() + "\n";
    var httpRequest = new XMLHttpRequest(); //第一步：创建需要的对象
    httpRequest.open("POST", pushLink, true); //第二步：打开连接
    httpRequest.setRequestHeader(
      "Content-type",
      "application/json"
    ); //设置请求头 注：post方式必须设置请求头（在建立连接后设置请求头）
    httpRequest.send(content); //发送请求 
  }

  document.body.addEventListener('click', function(e) {
  if(e.target.className.indexOf('vsubmit') === -1) {
    return;
  }
  send_valine();
})
</script>