feat: support sha256 avatar hash (#706)

* feat: support sha256 avatar

* fix: lint

* fix: letter avatar support

* feat: avatar default use first letter

docs/faq.md

@@ -2,7 +2,7 @@
 
 ## 如何修改头像？
 
-请前往 [https://cravatar.cn](https://cravatar.cn) 通过邮箱注册并设定头像，评论时，请留下相同的邮箱。
+请前往 [https://weavatar.com](https://weavatar.com) 通过邮箱注册并设定头像，评论时，请留下相同的邮箱。
 
 访客还可以通过输入数字 QQ 邮箱地址，使用 QQ 头像发表评论。
 

package.json

@@ -56,6 +56,7 @@
     "eslint-plugin-promise": "^5.1.1",
     "eslint-plugin-standard": "^4.1.0",
     "eslint-plugin-vue": "^8.0.3",
+    "js-sha256": "^0.11.0",
     "marked": "^4.0.12",
     "mini-css-extract-plugin": "^2.6.1",
     "owo": "^1.0.2",

src/client/utils/i18n/i18n.js

@@ -429,12 +429,12 @@ export default {
     'ブロックワード設定、 ブロックワードを含むコンテンツは送信に失敗します。コンマで区切ってください。'
   ],
   [S.ACI + '_GRAVATAR_CDN']: [
-    '自定义头像 CDN 地址。如：cn.gravatar.com, cravatar.cn, sdn.geekzu.org, gravatar.loli.net，默认：cravatar.cn',
-    '自定義頭像 CDN 地址。如：cn.gravatar.com, cravatar.cn, sdn.geekzu.org, gravatar.loli.net，預設：cravatar.cn',
-    '自訂大頭貼照 CDN 來源。如：cn.gravatar.com, cravatar.cn, sdn.geekzu.org, gravatar.loli.net，預設：cravatar.cn',
-    'Custom avator CDN. (Examples: gravatar.com) Default: cravatar.cn.',
-    'Custom avator CDN. (Мисоллар: gravatar.com) Default: cravatar.cn.',
-    'カスタムプロフィール画像CDNアドレス。例：cn.gravatar.com、cravatar.cn、sdn.geekzu.org、gravatar.loli.net、デフォルト：cravatar.cn'
+    '自定义头像 CDN 地址。如：cn.gravatar.com, weavatar.com, cravatar.cn, sdn.geekzu.org, gravatar.loli.net，默认：weavatar.com',
+    '自定義頭像 CDN 地址。如：cn.gravatar.com, weavatar.com, cravatar.cn, sdn.geekzu.org, gravatar.loli.net，預設：weavatar.com',
+    '自訂大頭貼照 CDN 來源。如：cn.gravatar.com, weavatar.com, cravatar.cn, sdn.geekzu.org, gravatar.loli.net，預設：weavatar.com',
+    'Custom avator CDN. (Examples: gravatar.com) Default: weavatar.com.',
+    'Custom avator CDN. (Мисоллар: gravatar.com) Default: weavatar.com.',
+    'カスタムプロフィール画像CDNアドレス。例：cn.gravatar.com、weavatar.com、cravatar.cn、sdn.geekzu.org、gravatar.loli.net、デフォルト：weavatar.com'
   ],
   [S.ACI + '_HIDE_ADMIN_CRYPT']: [
     '隐藏管理面板入口。可设置一个“暗号”，只有在“昵称”一栏输入相同的“暗号”时，管理面板入口才会显示，留空则不隐藏管理入口',

src/client/view/components/TkAdminComment.vue

@@ -22,7 +22,7 @@
     <div class="tk-admin-comment-list" ref="comment-list">
       <div class="tk-admin-comment-item" v-for="comment in comments" :key="comment._id">
         <div class="tk-admin-comment-meta">
-          <tk-avatar :config="serverConfig" :avatar="comment.avatar" :mail="comment.mail" :link="comment.link" />
+          <tk-avatar :config="serverConfig" :avatar="comment.avatar" :nick="comment.nick" :mail="comment.mail" :link="comment.link" />
           <span v-if="!comment.link">{{ comment.nick }}&nbsp;</span>
           <a v-if="comment.link" :href="convertLink(comment.link)" target="_blank">{{ comment.nick }}&nbsp;</a>
           <span v-if="comment.mail">(<a :href="`mailto:${comment.mail}`">{{ comment.mail }}</a>)&nbsp;</span>

src/client/view/components/TkAvatar.vue

@@ -7,13 +7,15 @@
 
 <script>
 import md5 from 'blueimp-md5'
+import { sha256 } from 'js-sha256'
 import { convertLink, normalizeMail, isQQ, getQQAvatar } from '../../utils'
 import iconUser from '@fortawesome/fontawesome-free/svgs/solid/user-circle.svg'
 
 export default {
   props: {
     config: Object,
     avatar: String,
+    nick: String,
     mail: String,
     mailMd5: String,
     link: String
@@ -27,29 +29,32 @@ export default {
     gravatarCdn () {
       if (this.config && this.config.GRAVATAR_CDN) {
         return this.config.GRAVATAR_CDN
-      } else {
-        return 'cravatar.cn'
       }
+      return 'weavatar.com'
     },
     defaultGravatar () {
       if (this.config && this.config.DEFAULT_GRAVATAR) {
         return this.config.DEFAULT_GRAVATAR
-      } else {
-        return 'identicon'
       }
+      if (this.gravatarCdn === 'weavatar.com') {
+        return `letter&letter=${this.nick.charAt(0)}`
+      }
+      return 'identicon'
     },
     avatarInner () {
       if (this.avatar) {
         return this.avatar
-      } else if (this.mailMd5) {
-        return `https://${this.gravatarCdn}/avatar/${this.mailMd5}?d=${this.defaultGravatar}`
-      } else if (this.mail && isQQ(this.mail)) {
+      }
+      if (this.mail) {
+        if (this.gravatarCdn === 'cravatar.cn') {
+          return `https://${this.gravatarCdn}/avatar/${md5(normalizeMail(this.mail))}?d=${this.defaultGravatar}`
+        }
+        return `https://${this.gravatarCdn}/avatar/${sha256(normalizeMail(this.mail))}?d=${this.defaultGravatar}`
+      }
+      if (this.mail && isQQ(this.mail)) {
         return getQQAvatar(this.mail)
-      } else if (this.mail) {
-        return `https://${this.gravatarCdn}/avatar/${md5(normalizeMail(this.mail))}?d=${this.defaultGravatar}`
-      } else {
-        return ''
       }
+      return ''
     }
   },
   methods: {

src/client/view/components/TkSubmit.vue

@@ -1,7 +1,7 @@
 <template>
   <div class="tk-submit" ref="tk-submit">
     <div class="tk-row">
-      <tk-avatar :config="config" :mail="mail" />
+      <tk-avatar :config="config" :mail="mail" :nick="nick" />
       <div class="tk-col">
         <tk-meta-input :nick="nick" :mail="mail" :link="link" @update="onMetaUpdate" :config="config" />
         <el-input class="tk-input"

src/server/function/twikoo/utils/index.js

@@ -4,12 +4,14 @@ const {
   getFormData,
   getBowser,
   getIpToRegion,
-  getMd5
+  getMd5,
+  getSha256
 } = require('./lib')
 const axios = getAxios()
 const FormData = getFormData()
 const bowser = getBowser()
 const md5 = getMd5()
+const sha256 = getSha256()
 const { RES_CODE } = require('./constants')
 const logger = require('./logger')
 
@@ -183,14 +185,23 @@ const fn = {
     }
     return md5(comment.nick)
   },
+  getMailSha256 (comment) {
+    if (comment.mail) {
+      return sha256(fn.normalizeMail(comment.mail))
+    }
+    return sha256(comment.nick)
+  },
   getAvatar (comment, config) {
     if (comment.avatar) {
       return comment.avatar
     } else {
-      const gravatarCdn = config.GRAVATAR_CDN || 'cravatar.cn'
-      const defaultGravatar = config.DEFAULT_GRAVATAR || 'identicon'
-      const mailMd5 = fn.getMailMd5(comment)
-      return `https://${gravatarCdn}/avatar/${mailMd5}?d=${defaultGravatar}`
+      const gravatarCdn = config.GRAVATAR_CDN || 'weavatar.com'
+      let defaultGravatar = gravatarCdn === 'weavatar.com' ? `letter&letter=${comment.nick.charAt(0)}` : 'identicon'
+      if (config.DEFAULT_GRAVATAR) {
+        defaultGravatar = config.DEFAULT_GRAVATAR
+      }
+      const mailHash = gravatarCdn === 'cravatar.cn' ? fn.getMailMd5(comment) : fn.getMailSha256(comment) // Cravatar 不支持 sha256
+      return `https://${gravatarCdn}/avatar/${mailHash}?d=${defaultGravatar}`
     }
   },
   isUrl (s) {

src/server/function/twikoo/utils/lib.js

@@ -46,9 +46,13 @@ module.exports = {
     return marked
   },
   getMd5 () {
-    const md5 = require('blueimp-md5') // MD5 加解密
+    const md5 = require('blueimp-md5') // MD5 哈希
     return md5
   },
+  getSha256 () {
+    const sha256 = require('js-sha256') // SHA256 哈希
+    return sha256
+  },
   getNodemailer () {
     if (customLibs.nodemailer) return customLibs.nodemailer
     const nodemailer = require('nodemailer') // 发送邮件