精华内容
下载资源
问答
  • gitalk

    2020-04-11 22:21:22
    https://www.cnblogs.com/quanxiaoha/p/10925401.html
    展开全文
  • Gitalk Gitalk is a modern comment component based on GitHub Issue and Preact. Features Authentication with github account Serverless, all comments will be stored as github issues Both ...
  • Gatsby插件Gitalk 该插件可简化向添加注释的过程 描述 该插件的目的是通过将Gitalk评论集成到其快速发展的Gatsby网站中,使用户能够充实自己的内容并培养参与的社区。 在努力将不同的Gitalk组件集成到我的Gatsby...
  • Gitalk Gitalk是基于GitHub Issue和Preact的现代评论组件。 产品特点 使用github帐户进行身份验证 无服务器,所有评论将存储为github问题 个人和组织github项目均可用于存储评论 本地化,支持多种语言[en,zh-CN,...
  • [Gitalk] 集成Gitalk时踩过的那些坑

    千次阅读 2019-09-11 21:02:48
    gitalk的集成看起来很简单,一共就以下三步。 1. 登录github,进入Setting/Developer settings,新创建一个OAuth App,填写应用名,主页url,回调url; 2. 在使用gitalk的页面里引用官方提供的gitalk js 和 css ...

    gitalk的集成看起来很简单,一共就以下三步。

    1. 登录github,进入Setting/Developer settings,新创建一个OAuth App,填写应用名,主页url,回调url;

    2. 在使用gitalk的页面里引用官方提供的gitalk js 和 css

    <link rel="stylesheet" href="//cdn.bootcss.com/gitalk/1.5.0/gitalk.min.css">
    <script src="//cdn.bootcss.com/gitalk/1.5.0/gitalk.min.js"></script>

    3. 在页面上创建占位html标签,创建gitalk对象并渲染

    <div id="gitalk-container" style="margin: 30px;padding-bottom: 30px;"></div>
             <script>
                var gitalk = new Gitalk({
                    clientID: '', // GitHub Application Client ID
                    clientSecret: '', // GitHub Application Client Secret
                    repo: '',      // 存放评论的仓库
                    owner: '',          // 仓库的创建者,
                    admin: [],        // 如果仓库有多个人可以操作,那么在这里以数组形式写出
                    id: md5(location.pathname),      // 用于标记评论是哪个页面的,确保唯一,并且长度小于50
                    title: document.title,
                    body:  '文章链接:'+ decodeURIComponent(location.origin+location.pathname),
                })
                gitalk.render('gitalk-container');    // 渲染Gitalk评论组件
            </script>

    但是其中有些坑,还是需要注意的

    1. 你是给自己账号下的仓库创建App还是给组织账号下的仓库创建App

    如果是给自己用,直接从Developer settings进去建App,如果是给组织建,就要从Organization settings 进到组织账号下的Developer settings建App。

    2. gitalk的第一次登录

    把gitalk加好后,第一次进入页面,会显示需要用github账号登录,从控制台里看,浏览器访问 https://api.github.com/user 返回 401。这是因为需要给github账号授权使用gitalk,这个时候,只有当前页面的域名和之前配置的Authorization callback URL 在同一个域下,才能成功进入授权页面。例如,在开发时,我的页面链接是http://localhost:8080/article/1,那Authorization callback URL 和 Home Page URL都要用http://localhost:8080。上线之后再改回正确的域名。成功登陆后,设置页面会显示有了第一位用户。

    3. 实例化Gitalk对象时repo、owner、admin的设置

    找到你想创建gitalk的那个仓库,比如:

    owner就是 Windower ,repo 就是 Lua,admin是个数组,里面一定要有创建者登陆github用的名字,如果填错了,评论框会报错

    4. repo下如果一个issues都没有,就手动创建一条issues

    5. id要填能区分页面唯一性的字符串,比如页面链接,但是要注意长度限制,所以可以用md5转换一下。如果是单页应用,请找出每个路由下能区分页面唯一性的字符串,并且在路由切换的时候重新设置此id

    6. title会被用作创建issue的标题,body会被用作issue的第一条评论

     

     

     

    展开全文
  • mtdhb-gitalk--源码

    2021-04-28 21:16:01
    Gitalk是基于GitHub Issue和Preact的现代评论组件。 特征 使用github帐户进行身份验证 无服务器,所有评论将存储为github问题 个人和组织github项目均可用于存储评论 本地化,支持多种语言[en,zh-CN,zh-TW,es-ES...
  • gitalk报错问题

    千次阅读 2019-01-11 15:52:50
    今天为了优化个人博客,将博客同时部署到Github和Coding,之后虽然博客访问速度相比以前有很大的提升,但是不知道gitalk评论会莫名出现问题 问题 点击使用GitHub登陆会跳转到个人博客主页面,然而问题依旧存在 域名...

    今天为了优化个人博客,将博客同时部署到Github和Coding,之后虽然博客访问速度相比以前有很大的提升,但是不知道gitalk评论会莫名出现问题

    问题

    在这里插入图片描述
    点击使用GitHub登陆会跳转到个人博客主页面,然而问题依旧存在
    域名后面会跟有一系列参数:

    error=redirect_uri_mismatch&error_description=The+redirect_uri+MUST+match+the+registered+callback+URL+for+this+application.&error_uri=https%3A%2F%2Fdeveloper.github.com%2Fapps%2Fmanaging-oauth-apps%2Ftroubleshooting-authorization-request-errors%2F%23redirect-uri-mismatch

    博客地址和Authorization callback URL或者Homepage URL一致
    在这里插入图片描述
    翻墙出去查找发现这位老哥也碰到了跟我一样的问题
    在这里插入图片描述
    https://stackoverflow.com/questions/34730153/github-api-error-redirect-uri-mismatch
    根据他的描述我得到灵感使用火狐游览器,再次点击使用GitHub登陆,这次会跳转到登陆界面,登陆之后同样会出现和上面一样的错误,但是刷新几次之后问题消失,出现评论界面
    在这里插入图片描述

    解决方案:

    在这里插入图片描述
    在这里插入图片描述

    问题依旧存在

    虽然gitalk评论界面出现,但是只能说是侥幸,并不能算是解决了问题,这里希望知道问题的老哥可以指点迷津。。。

    有位哥们解决了这个问题,可以参考一下:
    https://blog.csdn.net/w47_csdn/article/details/88858343

    展开全文
  • Gitalk评论插件使用

    2021-04-10 18:20:01
    Gitalk评论插件使用 简介 参考: Gitalk评论插件使用教程 Gitalk 是一个基于 GitHub Issue 和 Preact 开发的评论插件。 Gitalk 的特性: 1、使用 GitHub 登录 2、支持多语言 [en, zh-CN, zh-TW, es-ES, fr, ru] 3...

    Gitalk评论插件使用

    简介

    参考: Gitalk评论插件使用教程

    Gitalk 是一个基于 GitHub Issue 和 Preact 开发的评论插件。

    Gitalk 的特性:

    1、使用 GitHub 登录

    2、支持多语言 [en, zh-CN, zh-TW, es-ES, fr, ru]

    3、支持个人或组织

    4、无干扰模式(设置 distractionFreeMode 为 true 开启)

    5、快捷键提交评论

    使用Gitalk需要你做一些提前准备:

    1、在github上创建一个仓库,Gitalk会把评论放在这个仓库的issues里面。

    2、在github上申请一个GitHub OAuth application,来让Gitalk有权限操作github上的仓库。

    安装与使用

    采用 该博客 设置方法

    • 在HTML文件中引入
    <link rel="stylesheet" href="//cdn.bootcss.com/gitalk/1.5.0/gitalk.min.css">
    <script src="//cdn.bootcss.com/gitalk/1.5.0/gitalk.min.js"></script>
    

    建议直接把文件下载后放在项目目录中,这样就可以不再依赖第三方网络了。

    注意: 如果连接失效了,请在https://www.bootcdn.cn/上搜索gitalk然后找到对应资源链接复制过来。

    • 首先需要在html文件中添加一个容器,Gitalk组件会在此处显示
    <div id="gitalk-container"></div>
    
    • 使用下面的JavaScript代码来生成Gitalk评论:
    var gitalk = new Gitalk({
      clientID: '2eb19afceda708b27e64', // GitHub Application Client ID
      clientSecret: '36aedb5a30321626a8631689fee5fafd5929f612', // GitHub Application Client Secret
      repo: 'gitalk-comment'      // 存放评论的仓库
      owner: 'yulilong',          // 仓库的创建者,
      admin: ['yulilong'],        // 如果仓库有多个人可以操作,那么在这里以数组形式写出
      id: location.pathname,      // 用于标记评论是哪个页面的,确保唯一,并且长度小于50
    })
    
    gitalk.render('gitalk-container');    // 渲染Gitalk评论组件
    

    里面参数下面会讲解。

    注意: 第一次Gitalk需要初始化评论,需要你先点击使用GitHub登陆,然后刷新页面才会初始化

    new Gitalk的参数中有github的仓库信息和GitHub Application信息,所以首先我们创建这两个。

    在github上创建一个仓库比较简单这里就不讲解了。下面讲一下如何申请一个GitHub OAuth application

    注意: 如果你打算在自己网站使用Gitalk,并且这个网站的源码在github的仓库上,那么你也可以直接使用这个仓库,Gitalk只使用仓库的Issues

    申请一个OAuth application

    GitHub OAuth application允许程序来操作你的github账户,可以对github中仓库读写。
    详情介绍:https://developer.github.com/…

    申请GitHub OAuth application流程:

    1、打开github网站登陆后,点击右上角的用户图标,选择Settings

    2、 在Settings页面选择Developer settings选项。

    3、在Developer settings选择OAuth Apps,然后会在页面右边有一个New OAuth App按钮,点击这个按钮就进入到新建OAuth application页面

    4、也可以直接代开这个链接:https://github.com/settings/a… 进入新建页面

    在注册OAuth应用页面有如下几个参数需要填写:

    Application name:必填,OAuth的名字

    Homepage URL:必填,你应用的网址,哪个网站用了Gitalk组件,就填写这个网址

    Application description:选填,该OAuth的说明

    Authorization callback URL:必填,授权成功后回调网址,跟Homepage URL参数保持一致就好

    这些参数在注册成功后是可以修改。

    参数填好后,点Register application按钮即可完成注册。

    注册成功后会自动跳转到这个OAuth应用的页面,或者在Developer settings选择OAuth Apps后就能看见你创建的OAuth应用名字,点击它进入这个OAuth应用的页面。在新创建的OAuth应用里面的Client IDClient Secret就是我们需要的参数。

    Gitalk的参数说明

    在上面使用Gitalk的JavaScript代码中有一些参数:

    var gitalk = new Gitalk({
      clientID: '2eb19afceda708b27e64', // GitHub Application Client ID
      clientSecret: '36aedb5a30321626a8631689fee5fafd5929f612',
      repo: 'gitalk-comment'      // 存放评论的仓库
      owner: 'yulilong',          // 仓库的创建者,
      admin: ['yulilong'],        // 如果仓库有多个人可以操作,那么在这里以数组形式写出
      id: location.pathname,      // 用于标记评论是哪个页面的
    })
    

    主要的参数:

    • clientID
      类型:字符串,必填,申请的OAuth AppClient ID
    • clientSecret
      类型:字符串,必填,申请的OAuth AppClient Secret
    • repo
      类型:字符串,必填,github上的仓库名字,用于存放Gitalk评论
    • owner
      类型:字符串,必填,github仓库的所有者的名字
    • admin
      类型:数组(元素是字符串),必填,github仓库的所有者和合作者 (对这个 repository 有写权限的用户)
    • id
      类型:字符串,选填,页面的唯一标识。长度必须小于50。此参数用于评论和页面对应的标识,如果想让两个页面用一个评论,可设置两个页面的id一样。默认值:location.href(页面URL)
    • title
      类型:字符串,选填,GitHub issue 的标题,默认值:document.title(HTML中title标签中的值)

    注意:

    虽然idtitle参数是不是必填的选项,但是这个两个参数很重要建议填上:

    1、id参数用于评论记录和页面对应的唯一标记,有的时候发现好几个页面评论是一样的,就是由于配置id参数的时候,这几个页面的id是一样导致。由于id参数默认值是location.href页面URL,而有的时候URL中带着页面标题的链接,导致URL长度超过了50个字符长度,会导致创建评论issues失败(长度超过50个会创建失败),这点要注意。

    2、title用于在github仓库issues的标题,如果你想管理评论可以设置一下这个参数,来区分该评论是来自于那个文章。

    实际使用

    展开全文
  • 博客添加Gitalk评论

    2021-03-01 22:51:20
    博客添加Gitalk评论正文关于Gitalk使用创建一个Github Application配置gitalk推送到 Github 仓库链接与资源相关 正文 关于Gitalk Gitalk 是一个基于 GitHub Issue 和 Preact 开发的评论插件。 使用 GitHub 登录 ...
  • Next 7.5集成Gitalk

    2019-11-29 20:08:33
    最近在搭建Hexo + Next 的博客系统,在添加评论系统时选用了gitalk系统作为首选的评论系统,但是在添加过程中遇到了很多问题,在经过了好几次测试,终于将gitalk 与 Next 7.5.0 结合在一起。 步骤 创建存储仓库 首先...
  • 在参考了一些列博文配置了gitalk插件后,一直不能显示评论区。表现为点开博文,评论区只显示"未找到相关的Issues进行评论,请联系XXX进行创建",然后下面是github登录按钮,意思是需要先登录github授权,然后才能...
  • Gitalk 评论插件

    2019-09-29 15:51:10
    背景 Disqus需要翻墙才能正常使用 ...使用Gitalk评论插件 , ![](https://img-blog.csdnimg.cn/2019092915510223.png?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM...
  • gitalk的原理是引出github内评论 当然与此同时也必须使用github账号才可以使用 而gitalk的描述十分难以理解 这里是一篇比较完整的教程 教程 首先对于单个网页 我们可以直接在md文件中添加如下代码 <div id=...
  • GitHub评论Gitalk插件

    千次阅读 2018-03-06 15:53:35
    GitHub评论Gitalk插件 1、Gitalk 需要一个 Github Application,点击这里申请。
  • vuepress-plugin-gitalk-maker vuepress-plugin-gitalk-maker 是基于 的评论功能,数据源来自 github 的 issues。底层基于 。 用法 安装 yarn add vuepress-plugin-gitalk-maker 添加到config.js module.exports = {...
  • 什么是 Gitalk Gitalk 利用了 GithubAPI 基于 GitHub Issue 和 Preact 开发的评论插件, 官方网址: https://gitalk.github.io 官方中文文档: https://github.com/gitalk/gitalk/blob/master/readme-cn.md Gitalk ...
  • Hexo配置Gitalk插件

    2019-08-30 19:05:54
    今天我会在这里记录一下Gitalk留言插件的开通流程。 个人博客中可用的留言插件有很多种:Gitalk、Gitment、Valine 、Disqus。。。推荐使用Gitalk. 1. GitHub Application 首先,拥有自己的Github账号,然后点击此处...
  • hexo配置gitalk评论插件

    2019-10-13 16:08:54
    title: hexo配置gitalk评论插件 copyright: true date: 2019-08-20 21:13:05 tags: - 评论 - hexo categories: - blog 之前用的一直是来比力,不知为何加载很慢,而且社区版没有邮件登录的选项,比较不方便,于是乎...
  • gitalk 自动初始化

    2020-05-07 08:18:55
    ​ 前面有篇文章介绍了使用hexo的评论系统gitalk,但是使用过程中有一些小问题,每一篇文章都需要初始化一下issues,不然是无法评论的,如果文章太多,一个一个初始化就太浪费时间和精力,所以借鉴了网上的一些资料完成一...
  • gitalk Error: Validation Failed

    千次阅读 2018-11-01 13:30:32
    我现在博客的评论系统用的是gitalk,网上教程有很多,我参考的是这份教程。 当我按照网上的说法搭好后,确实是可以利用issue进行评论了,但我在新发表文章时,竟然报错了: 当时我心里一凉,难道和gitment一样,...
  • Gitalk评论配置-详解

    千次阅读 2019-09-07 20:34:05
    Gitalk 是一个基于 Github Issue 和 Preact 开发的评论插件。为什么我要写这篇博文,是因我用Github搭建我的博客页面,在安装Gitalk插件时按网上文章介绍进行配置,在运行时总是出现错误: 每篇文章都只突出解释...
  • hexo next 主题配置 gitalk 评论爬坑记

    千次阅读 2018-03-25 22:32:23
    hexo next 主题配置 gitalk 评论爬坑记 摘要 本文主要记录了我在配置 Hexo 博客 gitalk 评论功能时踩过的坑到最终爬出坑的过程,本教程献给打算给 Hexo 博客配置 gitalk 评论的小白朋友们(当然我也是 QAQ),避免...
  • 一 为何选择gitalk 之前的博客接入过一些评论系统,如:livere,gitment,最近对博客主题进行升级,有更换评论系统的打算: livere:过于社交化,不支持markdown gitment:项目更新维护已停止,最新的主题中没有...
  • Hexo博客部署Gitalk评论踩坑 算了算自己瞎折腾好久,查了好久的百度都没能解决,最后在Google和Github上找到了正确的方案。只能说Github yyds~ 在OAuth已搭建Gitalk 搭建步骤可自行百度,主要搭建完毕之后的后续...
  • 新建仓库lkt_gitalk 第三步 在主题目录下,新建模板E:\gitee\website\themes\hugo-universal-theme\layouts\partials/comments.html,添加以下内容: <!-- gitalk 评论框 end --> {{ if (.Site.Params.gitalk)...
  • next配置gitalk评论系统

    千次阅读 2019-08-21 15:45:26
    博客一直没有来得及添加评论系统,主要是考虑添加哪一个评论系统。最终选择gittalk,看了许多网上的文章发现都是旧版本的,本文适用next7.3版本。 原文: ... Gitalk是利...
  • t use <code>disqus</code>/<code>staticman</code> as a comment tool very well, but all we have github account, and I find Gittalk<a href="https://gitalk.github.io">Gitalk is a modern comment component ...
  • ​ 所有操作再hexo next主题的基础上...给页面增加gitalk元素及引入gitalk样式表及js文件 开始: 先新建一个仓库,名为blogtalk,默认开启了issues功能,不用再设置 创建一个 OAuth Apps,进入github的个人设置页...
  • Gitalk 是一个基于 Github Issue 和 Preact 开发的评论插件

空空如也

空空如也

1 2 3 4 5 ... 20
收藏数 757
精华内容 302
关键字:

gitalk