通过CoolPush实时推送hexo评论到QQ

说明

  2020.12.28:新增Qmsg酱推送,参考文档:基于Leancloud或javascript推送Valine评论到QQ

  2020.12.17:修改了javascript代码,现在稳得一P
  可以在我的博客测试推送效果: W4J1e’s blog

   提示:这个方法也许会遇到别有用心的无聊之人刷爆你的QQ

前言

  在博客创建以来,我一直在探索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替换成你自己的,路径:

yourblog\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>

⑤hexo clean & hexo d ,enjoy it!

cpush

后记

  很多事情其实都需要自己不断去试错,从错误中找到问题的根源,然后解决问题。各个领域的前辈们都开发了许多东西,我们都是站在巨人的肩膀上去造轮子,这是一件很幸福的事。当然这件事也让我有一种想要好好学学javascript的念头,毕竟学无止境嘛。

  2020.11.30 By W4J1e

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值