New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

hexo next 主题配置 gitalk 评论后无法初始化创建 issue #115

Closed
qhh0205 opened this Issue Mar 25, 2018 · 19 comments

Comments

Projects
None yet
7 participants
@qhh0205
Copy link

qhh0205 commented Mar 25, 2018

@booxood @lex111 @mamboer

问题描述

我根据这篇教程配的,过程完全一模一样,但是配完后打开每篇文章(没有报任何错),没有评论框,只有如下 gitalk 提示:
image
我点击底下的登录按钮后直接进入 github 博客仓库了,并没有 issue 产生,这是什么原因呢?而且返回页面后还是这样,没有什么变化,一直显示没有相关 issue。。
我的 blog 地址:https://qhh0205.github.io/

主要配置

next 主题文件 gitalk 配置:
image
layout/_third-party/comments/gitalk.swig 文件:

{% if page.comments && theme.gitalk.enable %}
  <link rel="stylesheet" href="https://unpkg.com/gitalk/dist/gitalk.css">
  <script src="https://unpkg.com/gitalk/dist/gitalk.min.js"></script>
   <script type="text/javascript">
        var gitalk = new Gitalk({
          clientID: '{{ theme.gitalk.ClientID }}',
          clientSecret: '{{ theme.gitalk.ClientSecret }}',
          repo: '{{ theme.gitalk.repo }}',
          owner: '{{ theme.gitalk.githubID }}',
          admin: ['{{ theme.gitalk.adminUser }}'],
          id: location.pathname,
          distractionFreeMode: '{{ theme.gitalk.distractionFreeMode }}'
        })
        gitalk.render('gitalk-container')
    </script>
{% endif %}

@qhh0205 qhh0205 changed the title hexo next 主题配置 gitalk 评论后没有评论框 hexo next 主题配置 gitalk 评论后无法初始化创建 issue Mar 25, 2018

@qhh0205

This comment has been minimized.

Copy link
Author

qhh0205 commented Mar 25, 2018

用 Chrome 检查工具看了下,应该是 api 认证失败导致,我看调用 github api 认证失败,但是我仔细检查了下认证的 id 和 secreat key 都没问题啊:
image
image

@iochen

This comment has been minimized.

Copy link

iochen commented Mar 25, 2018

image
填repo名字,不是填地址

@iochen

This comment has been minimized.

Copy link

iochen commented Mar 25, 2018

同时,建议不要使用中文为post文件名,
image
详见 #102 (comment)

@qhh0205

This comment has been minimized.

Copy link
Author

qhh0205 commented Mar 25, 2018

@iochen
我的仓库的名字就是 qhh0205.github.io
https://github.com/qhh0205/qhh0205.github.io
image

@iochen

This comment has been minimized.

Copy link

iochen commented Mar 25, 2018

好吧,是我看错了……看看下一个方案有没有用,我以前就吃过文件名过长的坑
#115 (comment)

@qhh0205

This comment has been minimized.

Copy link
Author

qhh0205 commented Mar 25, 2018

@iochen
应该不是文件名过长问题,我刚新建了一个 post,名称为:test,这个够短了吧,但是还是同样的问题。
https://qhh0205.github.io/2018/03/25/test/

@iochen

This comment has been minimized.

Copy link

iochen commented Mar 25, 2018

image
回调地址确认一下
在这里 https://github.com/settings/developers 修改

@iochen

This comment has been minimized.

Copy link

iochen commented Mar 25, 2018

image
这是我的

@qhh0205

This comment has been minimized.

Copy link
Author

qhh0205 commented Mar 25, 2018

@iochen
回调地址也是没问题的:
image

@qhh0205

This comment has been minimized.

Copy link
Author

qhh0205 commented Mar 25, 2018

@iochen 回调地址是博客地址吗?还是仓库地址

@qhh0205

This comment has been minimized.

Copy link
Author

qhh0205 commented Mar 25, 2018

@iochen 非常感谢啊🙏,可以了,是回调地址不对,改成博客地址就 ok 了!!
image

不过出现之前的老问题了:Error: Validation Failed.
就是中文标题导致编码过长的问题,这个现在应该有好的解决方法了吧?
关于 Error: Validation Failed. 问题我再参考下 #102
image

@qhh0205

This comment has been minimized.

Copy link
Author

qhh0205 commented Mar 25, 2018

@iochen 你好麻烦再请教下,我按照之前的 issue #102 用 md5 加密 id,本地 npm install md5 是成功的。
但是没生效,blog 页面底下评论框都没了,不知道什么原因。。。
blog 地址:http://qhh0205.github.io/
具体配置如下:

{% if page.comments && theme.gitalk.enable %}
  <link rel="stylesheet" href="https://unpkg.com/gitalk/dist/gitalk.css">
  <script src="https://unpkg.com/gitalk/dist/gitalk.min.js"></script>
   <script type="text/javascript">
        var gitalk = new Gitalk({
          clientID: '3840ba8c8d80c18be7e3',
          clientSecret: '1b00f2efe5285973c24da9ed9ac895775eacc8ea',
          repo: '{{ theme.gitalk.repo }}',
          owner: '{{ theme.gitalk.githubID }}',
          admin: ['{{ theme.gitalk.adminUser }}'],
          id: md5(location.pathname),
          distractionFreeMode: '{{ theme.gitalk.distractionFreeMode }}'
        })
        gitalk.render('gitalk-container')
    </script>
{% endif %}
@iochen

This comment has been minimized.

Copy link

iochen commented Mar 25, 2018

@qhh0205https://github.com/blueimp/JavaScript-MD5/blob/master/js/md5.min.js 下载放到你hexo的js文件夹中, 然后在配置上方加上<script src="这里是你的MD5的js的路径"></script>
就像这样
image
然后上传测试一下,我自己测试了一下。可以
image

@qhh0205

This comment has been minimized.

Copy link
Author

qhh0205 commented Mar 25, 2018

@iochen 非常感谢,又帮我解决了个问题。
我没有本地加载,我选择远程加载了下,我一般把代码片段都保存成了 gist,所以我创建了个 gitst,然后远程引入 js gist 地址。
在此把具体过程详细写下,献给小白朋友们(当然我也是 QAQ):

解决:gitalk 报错 Error: Validation Failed.--MD5 加密 id 避免 github issue lables 50 字符限制

  1. 创建一个github gist 文件保存 https://github.com/blueimp/JavaScript-MD5/blob/master/js/md5.min.js js 源码:
    https://gist.githubusercontent.com/qhh0205/78e9e0b1f3114db6737f3ed8cdd51d3a/raw/3894c5be5aa2378336b1f5ee0f296fa0b22d06e9/md5.min.js
  2. 将 gist 链接嵌入到 layout/_third-party/comments/gitalk.swig 文件,嵌入时的 js 链接地址需要注意下:
    不能直接写第一步的创建的 gitst 链接地址,需要将 gist.githubusercontent.com 替换为 rawgit.com。即嵌入地址为: https://rawgit.com/qhh0205/78e9e0b1f3114db6737f3ed8cdd51d3a/raw/3894c5be5aa2378336b1f5ee0f296fa0b22d06e9/md5.min.js
    最终 layout/_third-party/comments/gitalk.swig 配置如下:
{% if page.comments && theme.gitalk.enable %}
  <link rel="stylesheet" href="https://unpkg.com/gitalk/dist/gitalk.css">
  <script src="https://unpkg.com/gitalk/dist/gitalk.min.js"></script>
  <script src="https://rawgit.com/qhh0205/78e9e0b1f3114db6737f3ed8cdd51d3a/raw/3894c5be5aa2378336b1f5ee0f296fa0b22d06e9/md5.min.js"></script>
   <script type="text/javascript">
        var gitalk = new Gitalk({
          clientID: '3840ba8c8d80c18be7e3',
          clientSecret: '1b00f2efe5285973c24da9ed9ac895775eacc8ea',
          repo: '{{ theme.gitalk.repo }}',
          owner: '{{ theme.gitalk.githubID }}',
          admin: ['{{ theme.gitalk.adminUser }}'],
          id: md5(location.pathname),
          distractionFreeMode: '{{ theme.gitalk.distractionFreeMode }}'
        })
        gitalk.render('gitalk-container')
    </script>
{% endif %}
@shigithup

This comment has been minimized.

Copy link

shigithup commented Apr 13, 2018

终于成功了,同无法初始化。我的回调地址一直是github的博客repo名字,但是如果绑定了个性化域名,那么回调地址就要修改为个性化的域名了。。

@yymfp

This comment has been minimized.

Copy link

yymfp commented Oct 12, 2018

请问Error: no access token 怎么解决?

@guguji5

This comment has been minimized.

Copy link

guguji5 commented Nov 11, 2018

妹的,那个oauth 授权必须在你的 homepage url才能授权成功。我在hexo s的localhost环境测了半天

@booxood

This comment has been minimized.

Copy link
Member

booxood commented Nov 12, 2018

@guguji5 在本地环境时,可以先改成 localhost:xxxx 测试。

@Mart1nch

This comment has been minimized.

Copy link

Mart1nch commented Feb 16, 2019

报错issues are disabled for this repo
wechatimg80
setting-features-issues打勾
要考的 敲黑板了!

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment