sinzmise-cetastories 2.0.0-1730537447610 → 2.0.0-1731064238567

Sign up to get free protection for your applications and to get access to all the features.
Files changed (122) hide show
  1. package/404/index.html +1 -1
  2. package/about/index.html +1 -1
  3. package/album/index.html +1 -1
  4. package/archives/2021/12/index.html +1 -1
  5. package/archives/2021/index.html +1 -1
  6. package/archives/2022/12/index.html +1 -1
  7. package/archives/2022/index.html +1 -1
  8. package/archives/2023/01/index.html +1 -1
  9. package/archives/2023/02/index.html +1 -1
  10. package/archives/2023/03/index.html +1 -1
  11. package/archives/2023/04/index.html +1 -1
  12. package/archives/2023/07/index.html +1 -1
  13. package/archives/2023/08/index.html +1 -1
  14. package/archives/2023/09/index.html +1 -1
  15. package/archives/2023/10/index.html +1 -1
  16. package/archives/2023/11/index.html +1 -1
  17. package/archives/2023/12/index.html +1 -1
  18. package/archives/2023/index.html +1 -1
  19. package/archives/2023/page/2/index.html +1 -1
  20. package/archives/2023/page/3/index.html +1 -1
  21. package/archives/2024/01/index.html +1 -1
  22. package/archives/2024/02/index.html +1 -1
  23. package/archives/2024/03/index.html +1 -1
  24. package/archives/2024/04/index.html +1 -1
  25. package/archives/2024/05/index.html +1 -1
  26. package/archives/2024/06/index.html +1 -1
  27. package/archives/2024/07/index.html +1 -1
  28. package/archives/2024/08/index.html +1 -1
  29. package/archives/2024/09/index.html +1 -1
  30. package/archives/2024/10/index.html +1 -1
  31. package/archives/2024/index.html +1 -1
  32. package/archives/2024/page/2/index.html +1 -1
  33. package/archives/index.html +1 -1
  34. package/archives/page/2/index.html +1 -1
  35. package/archives/page/3/index.html +1 -1
  36. package/archives/page/4/index.html +1 -1
  37. package/archives/page/5/index.html +1 -1
  38. package/atom.xml +31 -31
  39. package/bbs/bbs.html +1 -1
  40. package/bbs/index.html +1 -1
  41. package/categories/index.html +1 -1
  42. package/categories//344/270/252/344/272/272/345/260/217/350/256/260/index.html +1 -1
  43. package/categories//344/270/252/344/272/272/345/260/217/350/256/260/page/2/index.html +1 -1
  44. package/categories//346/255/214/346/233/262/346/224/266/351/233/206/index.html +1 -1
  45. package/categories//346/270/270/346/210/217/347/233/270/345/205/263/index.html +1 -1
  46. package/categories//347/253/231/347/202/271/346/212/230/350/205/276/index.html +1 -1
  47. package/categories//347/253/231/347/202/271/346/212/230/350/205/276/page/2/index.html +1 -1
  48. package/categories//351/241/271/347/233/256/346/212/230/350/205/276/index.html +1 -1
  49. package/charts/index.html +1 -1
  50. package/comments/index.html +1 -1
  51. package/essay/index.html +1 -1
  52. package/fcircle/index.html +1 -1
  53. package/games +14 -3
  54. package/index.html +1 -1
  55. package/link/index.html +1 -1
  56. package/music/index.html +1 -1
  57. package/package.json +1 -1
  58. package/page/2/index.html +1 -1
  59. package/page/3/index.html +1 -1
  60. package/page/4/index.html +1 -1
  61. package/page/5/index.html +1 -1
  62. package/posts/10021/index.html +2 -2
  63. package/posts/10045/index.html +1 -1
  64. package/posts/10733/index.html +1 -1
  65. package/posts/10996/index.html +2 -2
  66. package/posts/12779/index.html +1 -1
  67. package/posts/13624/index.html +1 -1
  68. package/posts/15688/index.html +1 -1
  69. package/posts/15748/index.html +2 -2
  70. package/posts/15799/index.html +1 -1
  71. package/posts/15842/index.html +2 -2
  72. package/posts/16107/index.html +1 -1
  73. package/posts/18063/index.html +1 -1
  74. package/posts/20412/index.html +1 -1
  75. package/posts/21375/index.html +1 -1
  76. package/posts/22945/index.html +2 -2
  77. package/posts/23021/index.html +1 -1
  78. package/posts/27531/index.html +2 -2
  79. package/posts/28536/index.html +1 -1
  80. package/posts/28733/index.html +1 -1
  81. package/posts/29196/index.html +1 -1
  82. package/posts/38917/index.html +1 -1
  83. package/posts/38964/index.html +1 -1
  84. package/posts/42487/index.html +1 -1
  85. package/posts/42580/index.html +1 -1
  86. package/posts/45875/index.html +1 -1
  87. package/posts/46640/index.html +1 -1
  88. package/posts/48762/index.html +1 -1
  89. package/posts/50710/index.html +1 -1
  90. package/posts/52677/index.html +1 -1
  91. package/posts/53662/index.html +1 -1
  92. package/posts/54386/index.html +1 -1
  93. package/posts/54481/index.html +1 -1
  94. package/posts/54787/index.html +2 -2
  95. package/posts/56467/index.html +1 -1
  96. package/posts/57692/index.html +1 -1
  97. package/posts/58203/index.html +1 -1
  98. package/posts/61417/index.html +1 -1
  99. package/posts/61712/index.html +1 -1
  100. package/posts/646/index.html +1 -1
  101. package/posts/64856/index.html +1 -1
  102. package/posts/64935/index.html +1 -1
  103. package/search.xml +42 -42
  104. package/seas/index.html +1 -1
  105. package/tags/Flash/347/233/270/345/205/263/index.html +1 -1
  106. package/tags/Steam/346/270/270/346/210/217/index.html +1 -1
  107. package/tags/Windows/350/275/257/344/273/266/index.html +1 -1
  108. package/tags/index.html +1 -1
  109. package/tags//344/270/252/344/272/272/345/260/217/350/256/260/index.html +1 -1
  110. package/tags//344/270/252/344/272/272/345/260/217/350/256/260/page/2/index.html +1 -1
  111. package/tags//345/205/266/345/256/203/346/270/270/346/210/217/index.html +1 -1
  112. package/tags//345/212/240/350/275/275/345/212/250/347/224/273/index.html +1 -1
  113. package/tags//346/202/254/346/265/256/345/256/240/347/211/251-/347/234/213/346/235/277/345/250/230/index.html +1 -1
  114. package/tags//346/255/214/346/233/262/346/224/266/351/233/206/index.html +1 -1
  115. package/tags//346/270/270/346/210/217/347/233/270/345/205/263/index.html +1 -1
  116. package/tags//347/253/231/347/202/271/345/272/225/351/203/250/351/255/224/346/224/271/index.html +1 -1
  117. package/tags//347/253/231/347/202/271/346/212/230/350/205/276/index.html +1 -1
  118. package/tags//347/253/231/347/202/271/346/212/230/350/205/276/page/2/index.html +1 -1
  119. package/tags//350/207/252/345/273/272/351/203/250/347/275/262/index.html +1 -1
  120. package/tags//351/241/265/351/235/242/351/255/224/346/224/271/index.html +1 -1
  121. package/tags//351/241/271/347/233/256/346/212/230/350/205/276/index.html +1 -1
  122. package/update/index.html +1 -1
package/posts/38964/index.html CHANGED
@@ -1 +1 @@
1
- <!DOCTYPE html><html lang="zh-CN"><head hexo-theme="https://github.com/volantis-x/hexo-theme-volantis/#6.0.0-alpha.0"><meta name="generator" content="Hexo 7.3.0"><meta charset="utf-8"><link rel="canonical" href="https://blog.sinzmise.top/posts/38964/"><meta name="renderer" content="webkit"><meta name="force-rendering" content="webkit"><meta http-equiv="X-UA-Compatible" content="IE=Edge,chrome=1"><meta name="HandheldFriendly" content="True"><meta name="apple-mobile-web-app-capable" content="yes"><meta name="viewport" content="width=device-width,initial-scale=1,maximum-scale=5"><meta content="black-translucent" name="apple-mobile-web-app-status-bar-style"><meta content="telephone=no" name="format-detection"><link rel="preload" href="/css/style.css" as="style"><link rel="preload" href="https://jsd.cdn.storisinz.site/npm/volantis-static@0.0.1660614606622/media/fonts/VarelaRound/VarelaRound-Regular.ttf" as="font" type="font/ttf" crossorigin="anonymous"><link rel="preload" href="https://jsd.cdn.storisinz.site/npm/volantis-static@0.0.1660614606622/media/fonts/UbuntuMono/UbuntuMono-Regular.ttf" as="font" type="font/ttf" crossorigin="anonymous"><link rel="alternate" href="/atom.xml" title="汐塔魔法屋" type="application/atom+xml"><title>小康大佬的说说方案 ———— ispeak搭建教程 - 汐塔魔法屋</title><meta name="keywords" content="站点折腾,页面魔改,null"><meta desc name="description" content="这篇文章是我之前写过的教程的重写 - 王九弦SZ·Ninty - 汐塔魔法屋"><meta property="og:type" content="article"><meta property="og:title" content="小康大佬的说说方案 ———— ispeak搭建教程"><meta property="og:url" content="https://blog.sinzmise.top/posts/38964/"><meta property="og:site_name" content="汐塔魔法屋"><meta property="og:description" content="这篇文章是我之前写过的教程的重写"><meta property="og:locale" content="zh_CN"><meta property="og:image" content="https://blog.sinzmise.top/images/siteicon/web-app-manifest-192x192.png"><meta property="article:published_time" content="2023-01-13T21:01:37.000Z"><meta property="article:modified_time" content="2024-11-02T08:49:58.797Z"><meta property="article:author" content="王九弦SZ·Ninty"><meta property="article:tag" content="站点折腾"><meta property="article:tag" content="页面魔改"><meta name="twitter:card" content="summary"><meta name="twitter:image" content="https://blog.sinzmise.top/images/siteicon/web-app-manifest-192x192.png"><style>#safearea{display:none}.fa-duotone.red,.fa-light.red,.fa-regular.red,.fa-solid.red,.fa-thin.red,.fa.red,.fad.red,.fal.red,.far.red,.fas.red,.iziToast>.iziToast-body .iziToast-icon.red{color:#f44336}.fa-duotone.pink,.fa-light.pink,.fa-regular.pink,.fa-solid.pink,.fa-thin.pink,.fa.pink,.fad.pink,.fal.pink,.far.pink,.fas.pink,.iziToast>.iziToast-body .iziToast-icon.pink{color:#e91e63}.fa-duotone.purple,.fa-light.purple,.fa-regular.purple,.fa-solid.purple,.fa-thin.purple,.fa.purple,.fad.purple,.fal.purple,.far.purple,.fas.purple,.iziToast>.iziToast-body .iziToast-icon.purple{color:#9c27b0}.fa-duotone.indigo,.fa-light.indigo,.fa-regular.indigo,.fa-solid.indigo,.fa-thin.indigo,.fa.indigo,.fad.indigo,.fal.indigo,.far.indigo,.fas.indigo,.iziToast>.iziToast-body .iziToast-icon.indigo{color:#3f51b5}.fa-duotone.light-blue,.fa-light.light-blue,.fa-regular.light-blue,.fa-solid.light-blue,.fa-thin.light-blue,.fa.light-blue,.fad.light-blue,.fal.light-blue,.far.light-blue,.fas.light-blue,.iziToast>.iziToast-body .iziToast-icon.light-blue{color:#4ba7ee}.fa-duotone.deep-blue,.fa-light.deep-blue,.fa-regular.deep-blue,.fa-solid.deep-blue,.fa-thin.deep-blue,.fa.deep-blue,.fad.deep-blue,.fal.deep-blue,.far.deep-blue,.fas.deep-blue,.iziToast>.iziToast-body .iziToast-icon.deep-blue{color:#3367d6}.fa-duotone.teal,.fa-light.teal,.fa-regular.teal,.fa-solid.teal,.fa-thin.teal,.fa.teal,.fad.teal,.fal.teal,.far.teal,.fas.teal,.iziToast>.iziToast-body .iziToast-icon.teal{color:#009688}.fa-duotone.light-green,.fa-light.light-green,.fa-regular.light-green,.fa-solid.light-green,.fa-thin.light-green,.fa.light-green,.fad.light-green,.fal.light-green,.far.light-green,.fas.light-green,.iziToast>.iziToast-body .iziToast-icon.light-green{color:#8bc34a}.fa-duotone.orange,.fa-light.orange,.fa-regular.orange,.fa-solid.orange,.fa-thin.orange,.fa.orange,.fad.orange,.fal.orange,.far.orange,.fas.orange,.iziToast>.iziToast-body .iziToast-icon.orange{color:#ff9800}.fa-duotone.deep-orange,.fa-light.deep-orange,.fa-regular.deep-orange,.fa-solid.deep-orange,.fa-thin.deep-orange,.fa.deep-orange,.fad.deep-orange,.fal.deep-orange,.far.deep-orange,.fas.deep-orange,.iziToast>.iziToast-body .iziToast-icon.deep-orange{color:#ff5722}.fa-duotone.brown,.fa-light.brown,.fa-regular.brown,.fa-solid.brown,.fa-thin.brown,.fa.brown,.fad.brown,.fal.brown,.far.brown,.fas.brown,.iziToast>.iziToast-body .iziToast-icon.brown{color:#795548}.fa-duotone.blue-grey,.fa-light.blue-grey,.fa-regular.blue-grey,.fa-solid.blue-grey,.fa-thin.blue-grey,.fa.blue-grey,.fad.blue-grey,.fal.blue-grey,.far.blue-grey,.fas.blue-grey,.iziToast>.iziToast-body .iziToast-icon.blue-grey{color:#607d8b}.fa-duotone.yellow,.fa-light.yellow,.fa-regular.yellow,.fa-solid.yellow,.fa-thin.yellow,.fa.yellow,.fad.yellow,.fal.yellow,.far.yellow,.fas.yellow,.iziToast>.iziToast-body .iziToast-icon.yellow{color:#fcec60}.fa-duotone.TURQUOISE,.fa-light.TURQUOISE,.fa-regular.TURQUOISE,.fa-solid.TURQUOISE,.fa-thin.TURQUOISE,.fa.TURQUOISE,.fad.TURQUOISE,.fal.TURQUOISE,.far.TURQUOISE,.fas.TURQUOISE,.iziToast>.iziToast-body .iziToast-icon.TURQUOISE{color:#1abc9c}.fa-duotone.EMERALD,.fa-light.EMERALD,.fa-regular.EMERALD,.fa-solid.EMERALD,.fa-thin.EMERALD,.fa.EMERALD,.fad.EMERALD,.fal.EMERALD,.far.EMERALD,.fas.EMERALD,.iziToast>.iziToast-body .iziToast-icon.EMERALD{color:#2ecc71}.fa-duotone.PETERRIVE,.fa-light.PETERRIVE,.fa-regular.PETERRIVE,.fa-solid.PETERRIVE,.fa-thin.PETERRIVE,.fa.PETERRIVE,.fad.PETERRIVE,.fal.PETERRIVE,.far.PETERRIVE,.fas.PETERRIVE,.iziToast>.iziToast-body .iziToast-icon.PETERRIVE{color:#3498db}.fa-duotone.AMETHYST,.fa-light.AMETHYST,.fa-regular.AMETHYST,.fa-solid.AMETHYST,.fa-thin.AMETHYST,.fa.AMETHYST,.fad.AMETHYST,.fal.AMETHYST,.far.AMETHYST,.fas.AMETHYST,.iziToast>.iziToast-body .iziToast-icon.AMETHYST{color:#9b59b6}.fa-duotone.WETASPHALT,.fa-light.WETASPHALT,.fa-regular.WETASPHALT,.fa-solid.WETASPHALT,.fa-thin.WETASPHALT,.fa.WETASPHALT,.fad.WETASPHALT,.fal.WETASPHALT,.far.WETASPHALT,.fas.WETASPHALT,.iziToast>.iziToast-body .iziToast-icon.WETASPHALT{color:#34495e}.fa-duotone.GREENSEA,.fa-light.GREENSEA,.fa-regular.GREENSEA,.fa-solid.GREENSEA,.fa-thin.GREENSEA,.fa.GREENSEA,.fad.GREENSEA,.fal.GREENSEA,.far.GREENSEA,.fas.GREENSEA,.iziToast>.iziToast-body .iziToast-icon.GREENSEA{color:#16a085}.fa-duotone.NEPHRITIS,.fa-light.NEPHRITIS,.fa-regular.NEPHRITIS,.fa-solid.NEPHRITIS,.fa-thin.NEPHRITIS,.fa.NEPHRITIS,.fad.NEPHRITIS,.fal.NEPHRITIS,.far.NEPHRITIS,.fas.NEPHRITIS,.iziToast>.iziToast-body .iziToast-icon.NEPHRITIS{color:#27ae60}.fa-duotone.BELIZEHOLE,.fa-light.BELIZEHOLE,.fa-regular.BELIZEHOLE,.fa-solid.BELIZEHOLE,.fa-thin.BELIZEHOLE,.fa.BELIZEHOLE,.fad.BELIZEHOLE,.fal.BELIZEHOLE,.far.BELIZEHOLE,.fas.BELIZEHOLE,.iziToast>.iziToast-body .iziToast-icon.BELIZEHOLE{color:#2980b9}.fa-duotone.WISTERIA,.fa-light.WISTERIA,.fa-regular.WISTERIA,.fa-solid.WISTERIA,.fa-thin.WISTERIA,.fa.WISTERIA,.fad.WISTERIA,.fal.WISTERIA,.far.WISTERIA,.fas.WISTERIA,.iziToast>.iziToast-body .iziToast-icon.WISTERIA{color:#8e44ad}.fa-duotone.MIDNIGHTBLUE,.fa-light.MIDNIGHTBLUE,.fa-regular.MIDNIGHTBLUE,.fa-solid.MIDNIGHTBLUE,.fa-thin.MIDNIGHTBLUE,.fa.MIDNIGHTBLUE,.fad.MIDNIGHTBLUE,.fal.MIDNIGHTBLUE,.far.MIDNIGHTBLUE,.fas.MIDNIGHTBLUE,.iziToast>.iziToast-body .iziToast-icon.MIDNIGHTBLUE{color:#2c3e50}.fa-duotone.SUNFLOWER,.fa-light.SUNFLOWER,.fa-regular.SUNFLOWER,.fa-solid.SUNFLOWER,.fa-thin.SUNFLOWER,.fa.SUNFLOWER,.fad.SUNFLOWER,.fal.SUNFLOWER,.far.SUNFLOWER,.fas.SUNFLOWER,.iziToast>.iziToast-body .iziToast-icon.SUNFLOWER{color:#f1c40f}.fa-duotone.CARROT,.fa-light.CARROT,.fa-regular.CARROT,.fa-solid.CARROT,.fa-thin.CARROT,.fa.CARROT,.fad.CARROT,.fal.CARROT,.far.CARROT,.fas.CARROT,.iziToast>.iziToast-body .iziToast-icon.CARROT{color:#e67e22}.fa-duotone.ALIZARIN,.fa-light.ALIZARIN,.fa-regular.ALIZARIN,.fa-solid.ALIZARIN,.fa-thin.ALIZARIN,.fa.ALIZARIN,.fad.ALIZARIN,.fal.ALIZARIN,.far.ALIZARIN,.fas.ALIZARIN,.iziToast>.iziToast-body .iziToast-icon.ALIZARIN{color:#e74c3c}.fa-duotone.CLOUDS,.fa-light.CLOUDS,.fa-regular.CLOUDS,.fa-solid.CLOUDS,.fa-thin.CLOUDS,.fa.CLOUDS,.fad.CLOUDS,.fal.CLOUDS,.far.CLOUDS,.fas.CLOUDS,.iziToast>.iziToast-body .iziToast-icon.CLOUDS{color:#ecf0f1}.fa-duotone.CONCRETE,.fa-light.CONCRETE,.fa-regular.CONCRETE,.fa-solid.CONCRETE,.fa-thin.CONCRETE,.fa.CONCRETE,.fad.CONCRETE,.fal.CONCRETE,.far.CONCRETE,.fas.CONCRETE,.iziToast>.iziToast-body .iziToast-icon.CONCRETE{color:#95a5a6}.fa-duotone.ORANGE,.fa-light.ORANGE,.fa-regular.ORANGE,.fa-solid.ORANGE,.fa-thin.ORANGE,.fa.ORANGE,.fad.ORANGE,.fal.ORANGE,.far.ORANGE,.fas.ORANGE,.iziToast>.iziToast-body .iziToast-icon.ORANGE{color:#f39c12}.fa-duotone.PUMPKIN,.fa-light.PUMPKIN,.fa-regular.PUMPKIN,.fa-solid.PUMPKIN,.fa-thin.PUMPKIN,.fa.PUMPKIN,.fad.PUMPKIN,.fal.PUMPKIN,.far.PUMPKIN,.fas.PUMPKIN,.iziToast>.iziToast-body .iziToast-icon.PUMPKIN{color:#d35400}.fa-duotone.POMEGRANATE,.fa-light.POMEGRANATE,.fa-regular.POMEGRANATE,.fa-solid.POMEGRANATE,.fa-thin.POMEGRANATE,.fa.POMEGRANATE,.fad.POMEGRANATE,.fal.POMEGRANATE,.far.POMEGRANATE,.fas.POMEGRANATE,.iziToast>.iziToast-body .iziToast-icon.POMEGRANATE{color:#c0392b}.fa-duotone.SILVER,.fa-light.SILVER,.fa-regular.SILVER,.fa-solid.SILVER,.fa-thin.SILVER,.fa.SILVER,.fad.SILVER,.fal.SILVER,.far.SILVER,.fas.SILVER,.iziToast>.iziToast-body .iziToast-icon.SILVER{color:#bdc3c7}.fa-duotone.ASBESTOS,.fa-light.ASBESTOS,.fa-regular.ASBESTOS,.fa-solid.ASBESTOS,.fa-thin.ASBESTOS,.fa.ASBESTOS,.fad.ASBESTOS,.fal.ASBESTOS,.far.ASBESTOS,.fas.ASBESTOS,.iziToast>.iziToast-body .iziToast-icon.ASBESTOS{color:#7f8c8d}.article-title,.md .footer .header,.meta-v3,.new-meta-box,.prev-next,.widget header,details summary{font-family:"Varela Round","PingFang SC","Microsoft YaHei",Helvetica,Arial,Helvetica,monospace}:root{--color-site-body:#f4f4f4;--color-site-bg:#f4f4f4;--color-site-inner:#fff;--color-site-footer:#666;--color-card:#fff;--color-text:#444;--color-block:#f4f4f4;--color-inlinecode:#444;--color-codeblock:#f4f4f4;--color-h1:#3a3a3a;--color-h2:#3a3a3a;--color-h3:#333;--color-h4:#444;--color-h5:#555;--color-h6:#666;--color-p:#444;--color-list:#666;--color-list-hl:#30ad91;--color-meta:#888;--color-read-bkg:#e0d8c8;--color-read-post:#f8f1e2;--color-copyright-bkg:#f5f5f5;--color-white-png:#fff;--color-img-error:#f5f5f5}*{box-sizing:border-box;-webkit-box-sizing:border-box;-moz-box-sizing:border-box;outline:0;margin:0;padding:0}::-webkit-scrollbar{height:4px;width:4px}::-webkit-scrollbar-track-piece{background:0 0}::-webkit-scrollbar-thumb{background:#3dd9b6;cursor:pointer;border-radius:2px;-webkit-border-radius:2px}::-webkit-scrollbar-thumb:hover{background:#ff5722}html{color:var(--color-text);width:100%;height:100%;font-family:UbuntuMono,"Varela Round","PingFang SC","Microsoft YaHei",Helvetica,Arial,Menlo,Monaco,monospace,sans-serif;font-size:16px}html>::-webkit-scrollbar{height:4px;width:4px}html>::-webkit-scrollbar-track-piece{background:0 0}html>::-webkit-scrollbar-thumb{background:#3dd9b6;cursor:pointer;border-radius:2px;-webkit-border-radius:2px}html>::-webkit-scrollbar-thumb:hover{background:#ff5722}body{background-color:var(--color-site-body);text-rendering:optimizelegibility;-webkit-tap-highlight-color:transparent;line-height:1.6;-webkit-text-size-adjust:100%;-ms-text-size-adjust:100%}body.modal-active{overflow:hidden}@media screen and (max-width:680px){body.modal-active{position:fixed;top:0;right:0;bottom:0;left:0}}a{color:#2092ec;cursor:pointer;text-decoration:none;transition:all .28s ease;-webkit-transition:all .28s ease;-khtml-transition:all 0.28s ease;-moz-transition:all .28s ease;-o-transition:all .28s ease;-ms-transition:all .28s ease}a:active,a:hover{outline:0}ol,ul{padding-left:0}ol li,ul li{list-style:none}header{display:block}img{border:0;background:0 0;max-width:100%}svg:not(:root){overflow:hidden}hr{-moz-box-sizing:content-box;box-sizing:content-box;-webkit-box-sizing:content-box;-moz-box-sizing:content-box;height:0;border:0;border-radius:1px;-webkit-border-radius:1px;border-bottom:1px solid rgba(68,68,68,.1)}article hr{background-image:none;height:2em;border:none;margin:1em 0 1em;text-align:center}article hr:after{content:"···";letter-spacing:2em;padding-left:2em;font-weight:700}button,input{color:inherit;font:inherit;margin:0}button{overflow:visible;text-transform:none;-webkit-appearance:button;cursor:pointer}@supports (backdrop-filter:blur(20px)){.blur{background:rgba(255,255,255,.9)!important;backdrop-filter:saturate(200%) blur(20px)}}@supports (backdrop-filter:blur(20px)){.blur#comments{backdrop-filter:unset}}.shadow{box-shadow:0 1px 2px 0 rgba(0,0,0,.1);-webkit-box-shadow:0 1px 2px 0 rgba(0,0,0,.1)}.shadow.floatable{transition:all .28s ease;-webkit-transition:all .28s ease;-khtml-transition:all 0.28s ease;-moz-transition:all .28s ease;-o-transition:all .28s ease;-ms-transition:all .28s ease}.shadow.floatable:hover{box-shadow:0 2px 4px 0 rgba(0,0,0,.1),0 4px 8px 0 rgba(0,0,0,.1),0 8px 16px 0 rgba(0,0,0,.1);-webkit-box-shadow:0 2px 4px 0 rgba(0,0,0,.1),0 4px 8px 0 rgba(0,0,0,.1),0 8px 16px 0 rgba(0,0,0,.1)}#l_cover{min-height:64px}.cover-wrapper{top:0;left:0;max-width:100%;height:100vh;display:flex;flex-wrap:nowrap;-webkit-flex-wrap:nowrap;-khtml-flex-wrap:nowrap;-moz-flex-wrap:nowrap;-o-flex-wrap:nowrap;-ms-flex-wrap:nowrap;-webkit-box-direction:normal;-moz-box-direction:normal;-webkit-box-orient:vertical;-moz-box-orient:vertical;-webkit-flex-direction:column;-ms-flex-direction:column;flex-direction:column;align-items:center;align-self:center;align-content:center;color:var(--color-site-inner);padding:0 16px;user-select:none;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;position:relative;overflow:hidden;margin-bottom:-100px}.cover-wrapper .cover-bg{position:absolute;width:100%;height:100%;background-position:center;background-size:cover;-webkit-background-size:cover;-moz-background-size:cover}.cover-wrapper .cover-bg.lazyload:not(.loaded){opacity:0;-webkit-opacity:0;-moz-opacity:0}.cover-wrapper .cover-bg.lazyload.loaded{animation-delay:0s;animation-duration:.5s;animation-fill-mode:forwards;animation-timing-function:ease-out;animation-name:fadeIn}@-moz-keyframes fadeIn{0%{opacity:0;-webkit-opacity:0;-moz-opacity:0;filter:blur(12px);transform:scale(1.02);-webkit-transform:scale(1.02);-khtml-transform:scale(1.02);-moz-transform:scale(1.02);-o-transform:scale(1.02);-ms-transform:scale(1.02)}100%{opacity:1;-webkit-opacity:1;-moz-opacity:1}}@-webkit-keyframes fadeIn{0%{opacity:0;-webkit-opacity:0;-moz-opacity:0;filter:blur(12px);transform:scale(1.02);-webkit-transform:scale(1.02);-khtml-transform:scale(1.02);-moz-transform:scale(1.02);-o-transform:scale(1.02);-ms-transform:scale(1.02)}100%{opacity:1;-webkit-opacity:1;-moz-opacity:1}}@-o-keyframes fadeIn{0%{opacity:0;-webkit-opacity:0;-moz-opacity:0;filter:blur(12px);transform:scale(1.02);-webkit-transform:scale(1.02);-khtml-transform:scale(1.02);-moz-transform:scale(1.02);-o-transform:scale(1.02);-ms-transform:scale(1.02)}100%{opacity:1;-webkit-opacity:1;-moz-opacity:1}}@keyframes fadeIn{0%{opacity:0;-webkit-opacity:0;-moz-opacity:0;filter:blur(12px);transform:scale(1.02);-webkit-transform:scale(1.02);-khtml-transform:scale(1.02);-moz-transform:scale(1.02);-o-transform:scale(1.02);-ms-transform:scale(1.02)}100%{opacity:1;-webkit-opacity:1;-moz-opacity:1}}.cover-wrapper .cover-body{z-index:1;position:relative;width:100%;height:100%}.cover-wrapper#full{height:calc(100vh + 100px);padding-bottom:100px}.cover-wrapper#half{max-height:640px;min-height:460px;height:calc(36vh - 64px + 200px)}.cover-wrapper #scroll-down{width:100%;height:64px;position:absolute;bottom:100px;text-align:center;cursor:pointer}.cover-wrapper #scroll-down .scroll-down-effects{color:#fff;font-size:24px;line-height:64px;position:absolute;width:24px;left:calc(50% - 12px);text-shadow:0 1px 2px rgba(0,0,0,.1);animation:scroll-down-effect 1.5s infinite;-webkit-animation:scroll-down-effect 1.5s infinite;-khtml-animation:scroll-down-effect 1.5s infinite;-moz-animation:scroll-down-effect 1.5s infinite;-o-animation:scroll-down-effect 1.5s infinite;-ms-animation:scroll-down-effect 1.5s infinite}@-moz-keyframes scroll-down-effect{0%{top:0;opacity:1;-webkit-opacity:1;-moz-opacity:1}50%{top:-16px;opacity:.4;-webkit-opacity:0.4;-moz-opacity:0.4}100%{top:0;opacity:1;-webkit-opacity:1;-moz-opacity:1}}@-webkit-keyframes scroll-down-effect{0%{top:0;opacity:1;-webkit-opacity:1;-moz-opacity:1}50%{top:-16px;opacity:.4;-webkit-opacity:0.4;-moz-opacity:0.4}100%{top:0;opacity:1;-webkit-opacity:1;-moz-opacity:1}}@-o-keyframes scroll-down-effect{0%{top:0;opacity:1;-webkit-opacity:1;-moz-opacity:1}50%{top:-16px;opacity:.4;-webkit-opacity:0.4;-moz-opacity:0.4}100%{top:0;opacity:1;-webkit-opacity:1;-moz-opacity:1}}@keyframes scroll-down-effect{0%{top:0;opacity:1;-webkit-opacity:1;-moz-opacity:1}50%{top:-16px;opacity:.4;-webkit-opacity:0.4;-moz-opacity:0.4}100%{top:0;opacity:1;-webkit-opacity:1;-moz-opacity:1}}.cover-wrapper .cover-body{margin-top:64px;margin-bottom:120px}.cover-wrapper .cover-body,.cover-wrapper .cover-body .bottom,.cover-wrapper .cover-body .top{display:flex;-webkit-box-direction:normal;-moz-box-direction:normal;-webkit-box-orient:vertical;-moz-box-orient:vertical;-webkit-flex-direction:column;-ms-flex-direction:column;flex-direction:column;align-items:center;justify-content:center;-webkit-justify-content:center;-khtml-justify-content:center;-moz-justify-content:center;-o-justify-content:center;-ms-justify-content:center;max-width:100%}.cover-wrapper .cover-body .bottom{margin-top:32px}.cover-wrapper .cover-body .title{font-family:"Varela Round","PingFang SC","Microsoft YaHei",Helvetica,Arial,Helvetica,monospace;font-size:3.125rem;text-shadow:0 1px 2px rgba(0,0,0,.1);text-align:center}.cover-wrapper .cover-body .subtitle{font-size:16px}.cover-wrapper .cover-body .logo{max-height:120px;max-width:calc(100% - 4 * 16px)}@media screen and (min-height:1024px){.cover-wrapper .cover-body .title{font-size:3rem}.cover-wrapper .cover-body .subtitle{font-size:.875rem}.cover-wrapper .cover-body .logo{max-height:150px}}.cover-wrapper .cover-body .m_search{position:relative;max-width:calc(100% - 16px);width:320px;vertical-align:middle}.cover-wrapper .cover-body .m_search .form{position:relative;display:block;width:100%}.cover-wrapper .cover-body .m_search .icon,.cover-wrapper .cover-body .m_search .input{transition:all .28s ease;-webkit-transition:all .28s ease;-khtml-transition:all 0.28s ease;-moz-transition:all .28s ease;-o-transition:all .28s ease;-ms-transition:all .28s ease}.cover-wrapper .cover-body .m_search .icon{position:absolute;display:block;line-height:2.5rem;width:32px;top:0;left:5px;color:rgba(68,68,68,.75)}.cover-wrapper .cover-body .m_search .input{display:block;height:2.5rem;width:100%;box-shadow:none;-webkit-box-shadow:none;box-sizing:border-box;-webkit-box-sizing:border-box;-moz-box-sizing:border-box;font-size:.875rem;-webkit-appearance:none;padding-left:36px;border-radius:1.4rem;-webkit-border-radius:1.4rem;background:rgba(255,255,255,.6);backdrop-filter:blur(10px);border:none;color:var(--color-text)}@media screen and (max-width:500px){.cover-wrapper .cover-body .m_search .input{padding-left:36px}}.cover-wrapper .cover-body .m_search .input:hover{background:rgba(255,255,255,.8)}.cover-wrapper .cover-body .m_search .input:focus{background:#fff}.cover-wrapper .list-h{display:flex;-webkit-box-direction:normal;-moz-box-direction:normal;-webkit-box-orient:horizontal;-moz-box-orient:horizontal;-webkit-flex-direction:row;-ms-flex-direction:row;flex-direction:row;flex-wrap:wrap;-webkit-flex-wrap:wrap;-khtml-flex-wrap:wrap;-moz-flex-wrap:wrap;-o-flex-wrap:wrap;-ms-flex-wrap:wrap;align-items:stretch;border-radius:4px;-webkit-border-radius:4px;user-select:none;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none}.cover-wrapper .list-h a{-webkit-box-flex:1;-moz-box-flex:1;-webkit-flex:1 0;-ms-flex:1 0;flex:1 0;display:flex;font-weight:600}.cover-wrapper .list-h a img{display:block;border-radius:2px;-webkit-border-radius:2px;margin:4px;min-width:40px;max-width:44px}@media screen and (max-width:768px){.cover-wrapper .list-h a img{min-width:36px;max-width:40px}}@media screen and (max-width:500px){.cover-wrapper .list-h a img{margin:2px 4px;min-width:32px;max-width:36px}}@media screen and (max-width:375px){.cover-wrapper .list-h a img{min-width:28px;max-width:32px}}.cover-wrapper{max-width:100%}.cover-wrapper.search .bottom .menu{margin-top:8px}.cover-wrapper.search .bottom .menu .list-h a{white-space:nowrap;-webkit-box-direction:normal;-moz-box-direction:normal;-webkit-box-orient:horizontal;-moz-box-orient:horizontal;-webkit-flex-direction:row;-ms-flex-direction:row;flex-direction:row;align-items:baseline;padding:2px;margin:4px;color:var(--color-site-inner);opacity:.75;-webkit-opacity:0.75;-moz-opacity:0.75;text-shadow:0 1px 2px rgba(0,0,0,.05);border-bottom:2px solid transparent}.cover-wrapper.search .bottom .menu .list-h a i{margin-right:4px}.cover-wrapper.search .bottom .menu .list-h a p{font-size:.9375rem}.cover-wrapper.search .bottom .menu .list-h a.active,.cover-wrapper.search .bottom .menu .list-h a:active,.cover-wrapper.search .bottom .menu .list-h a:hover{opacity:1;-webkit-opacity:1;-moz-opacity:1;border-bottom:2px solid var(--color-site-inner)}@font-face{font-family:UbuntuMono;src:url("https://jsd.cdn.storisinz.site/npm/volantis-static@0.0.1660614606622/media/fonts/UbuntuMono/UbuntuMono-Regular.ttf");font-weight:'normal';font-style:'normal';font-display:swap}@font-face{font-family:'Varela Round';src:url("https://jsd.cdn.storisinz.site/npm/volantis-static@0.0.1660614606622/media/fonts/VarelaRound/VarelaRound-Regular.ttf");font-weight:'normal';font-style:'normal';font-display:swap}.l_header{position:fixed;z-index:1000;top:0;width:100%;height:64px;background:var(--color-card);box-shadow:0 1px 2px 0 rgba(0,0,0,.1);-webkit-box-shadow:0 1px 2px 0 rgba(0,0,0,.1)}.l_header.auto{transition:opacity .4s ease;-webkit-transition:opacity .4s ease;-khtml-transition:opacity 0.4s ease;-moz-transition:opacity .4s ease;-o-transition:opacity .4s ease;-ms-transition:opacity .4s ease;visibility:hidden}.l_header.auto.showed{opacity:1!important;-webkit-opacity:1!important;-moz-opacity:1!important;visibility:visible}.l_header .container{margin-left:16px;margin-right:16px}.l_header #wrapper{height:100%;user-select:none;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none}.l_header #wrapper .nav-main,.l_header #wrapper .nav-sub{display:flex;flex-wrap:nowrap;-webkit-flex-wrap:nowrap;-khtml-flex-wrap:nowrap;-moz-flex-wrap:nowrap;-o-flex-wrap:nowrap;-ms-flex-wrap:nowrap;justify-content:space-between;-webkit-justify-content:space-between;-khtml-justify-content:space-between;-moz-justify-content:space-between;-o-justify-content:space-between;-ms-justify-content:space-between;align-items:center}.l_header #wrapper .nav-main{transition:all .28s ease;-webkit-transition:all .28s ease;-khtml-transition:all 0.28s ease;-moz-transition:all .28s ease;-o-transition:all .28s ease;-ms-transition:all .28s ease}.l_header #wrapper.sub .nav-main{transform:translateY(-64px);-webkit-transform:translateY(-64px);-khtml-transform:translateY(-64px);-moz-transform:translateY(-64px);-o-transform:translateY(-64px);-ms-transform:translateY(-64px)}.l_header #wrapper .nav-sub{transition:all .28s ease;-webkit-transition:all .28s ease;-khtml-transition:all 0.28s ease;-moz-transition:all .28s ease;-o-transition:all .28s ease;-ms-transition:all .28s ease;opacity:0;-webkit-opacity:0;-moz-opacity:0;height:64px;width:calc(100% - 2 * 16px);position:absolute}.l_header #wrapper .nav-sub ::-webkit-scrollbar{display:none}@media screen and (min-width:2048px){.l_header #wrapper .nav-sub{max-width:55vw;margin:auto}}.l_header #wrapper.sub .nav-sub{opacity:1;-webkit-opacity:1;-moz-opacity:1}.l_header #wrapper .title{position:relative;color:var(--color-text);padding-left:24px;max-height:64px}.l_header #wrapper .nav-main .title{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;flex-shrink:0;line-height:64px;padding:0 8px;font-size:1.25rem;font-family:"Varela Round","PingFang SC","Microsoft YaHei",Helvetica,Arial,Helvetica,monospace}.l_header #wrapper .nav-main .title img{height:64px;padding:8px}.l_header .nav-sub{max-width:1080px;margin:auto}.l_header .nav-sub .title{font-weight:700;font-family:UbuntuMono,"Varela Round","PingFang SC","Microsoft YaHei",Helvetica,Arial,Menlo,Monaco,monospace,sans-serif;line-height:1.2;max-height:64px;white-space:normal;flex-shrink:1}.l_header .switcher{display:none;line-height:64px;align-items:center}.l_header .switcher .s-toc{display:none}@media screen and (max-width:768px){.l_header .switcher .s-toc{display:flex}}.l_header .switcher>li{height:48px;transition:all .28s ease;-webkit-transition:all .28s ease;-khtml-transition:all 0.28s ease;-moz-transition:all .28s ease;-o-transition:all .28s ease;-ms-transition:all .28s ease;margin:2px}@media screen and (max-width:500px){.l_header .switcher>li{margin:0 1px;height:48px}}.l_header .switcher>li>a{display:flex;justify-content:center;-webkit-justify-content:center;-khtml-justify-content:center;-moz-justify-content:center;-o-justify-content:center;-ms-justify-content:center;align-items:center;width:48px;height:48px;padding:.85em 1.1em;border-radius:100px;-webkit-border-radius:100px;border:none;transition:all .28s ease;-webkit-transition:all .28s ease;-khtml-transition:all 0.28s ease;-moz-transition:all .28s ease;-o-transition:all .28s ease;-ms-transition:all .28s ease;color:#3dd9b6}.l_header .switcher>li>a:hover{border:none}.l_header .switcher>li>a.active,.l_header .switcher>li>a:active{border:none;background:var(--color-site-bg)}@media screen and (max-width:500px){.l_header .switcher>li>a{width:36px;height:48px}}.l_header .nav-sub .switcher{display:flex}.l_header .m_search{display:flex;height:64px;width:240px;transition:all .28s ease;-webkit-transition:all .28s ease;-khtml-transition:all 0.28s ease;-moz-transition:all .28s ease;-o-transition:all .28s ease;-ms-transition:all .28s ease}@media screen and (max-width:1024px){.l_header .m_search{width:44px;min-width:44px}.l_header .m_search input::placeholder{opacity:0;-webkit-opacity:0;-moz-opacity:0}.l_header .m_search:hover{width:240px}.l_header .m_search:hover input::placeholder{opacity:1;-webkit-opacity:1;-moz-opacity:1}}@media screen and (min-width:500px){.l_header .m_search:hover .input{width:100%}.l_header .m_search:hover .input::placeholder{opacity:1;-webkit-opacity:1;-moz-opacity:1}}@media screen and (max-width:500px){.l_header .m_search{min-width:0}.l_header .m_search input::placeholder{opacity:1;-webkit-opacity:1;-moz-opacity:1}}.l_header .m_search .form{position:relative;display:flex;width:100%;align-items:center}.l_header .m_search .icon{position:absolute;width:36px;left:5px;color:var(--color-meta)}@media screen and (max-width:500px){.l_header .m_search .icon{display:none}}.l_header .m_search .input{display:block;padding-top:8px;padding-bottom:8px;line-height:1.3;width:100%;color:var(--color-text);background:#fafafa;box-shadow:none;-webkit-box-shadow:none;box-sizing:border-box;-webkit-box-sizing:border-box;-moz-box-sizing:border-box;padding-left:40px;font-size:.875rem;border-radius:8px;-webkit-border-radius:8px;border:none;transition:all .28s ease;-webkit-transition:all .28s ease;-khtml-transition:all 0.28s ease;-moz-transition:all .28s ease;-o-transition:all .28s ease;-ms-transition:all .28s ease}@media screen and (min-width:500px){.l_header .m_search .input:focus{box-shadow:0 4px 8px 0 rgba(0,0,0,.1);-webkit-box-shadow:0 4px 8px 0 rgba(0,0,0,.1)}}@media screen and (max-width:500px){.l_header .m_search .input{background:var(--color-block);padding-left:8px;border:none}.l_header .m_search .input:focus,.l_header .m_search .input:hover{border:none}}@media (max-width:500px){.l_header .m_search{left:0;width:0;overflow:hidden;position:absolute;background:#fff;transition:all .28s ease;-webkit-transition:all .28s ease;-khtml-transition:all 0.28s ease;-moz-transition:all .28s ease;-o-transition:all .28s ease;-ms-transition:all .28s ease}.l_header .m_search .input{border-radius:32px;-webkit-border-radius:32px;margin-left:16px;padding-left:16px}.l_header.z_search-open .m_search{width:100%}.l_header.z_search-open .m_search .input{width:calc(100% - 120px)}}ul.list-v li:hover>ul.list-v,ul.m-pc li:hover>ul.list-v{display:block}ul.nav-list-h{display:flex;align-items:stretch}ul.nav-list-h>li{position:relative;justify-content:center;-webkit-justify-content:center;-khtml-justify-content:center;-moz-justify-content:center;-o-justify-content:center;-ms-justify-content:center;height:100%;line-height:2.4;border-radius:4px;-webkit-border-radius:4px}ul.nav-list-h>li>a{-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}ul.nav-list-h>li>a span{font-weight:600}ul.list-v{z-index:1;display:none;position:absolute;background:var(--color-card);box-shadow:0 2px 4px 0 rgba(0,0,0,.08),0 4px 8px 0 rgba(0,0,0,.08),0 8px 16px 0 rgba(0,0,0,.08);-webkit-box-shadow:0 2px 4px 0 rgba(0,0,0,.08),0 4px 8px 0 rgba(0,0,0,.08),0 8px 16px 0 rgba(0,0,0,.08);margin-top:-6px;border-radius:4px;-webkit-border-radius:4px;padding:8px 0}ul.list-v.show{display:block}ul.list-v hr{margin-top:8px;margin-bottom:8px}ul.list-v>li{white-space:nowrap;word-break:keep-all}ul.list-v>li.header{font-size:.78125rem;font-weight:700;line-height:2em;color:var(--color-meta);margin:8px 16px 4px}ul.list-v>li.header i{margin-right:8px}ul.list-v>li ul{margin-left:0;display:none;margin-top:-40px}ul.list-v .aplayer-container{min-height:64px;padding:6px 16px}ul.list-v>li>a{transition:all .28s ease;-webkit-transition:all .28s ease;-khtml-transition:all 0.28s ease;-moz-transition:all .28s ease;-o-transition:all .28s ease;-ms-transition:all .28s ease;display:block;color:var(--color-list);font-size:.875rem;line-height:36px;padding:0 20px 0 16px;text-overflow:ellipsis;margin:0 4px;border-radius:4px;-webkit-border-radius:4px}@media screen and (max-width:1024px){ul.list-v>li>a{line-height:40px}}ul.list-v>li>a>i{margin-right:8px}ul.list-v>li>a.active,ul.list-v>li>a:active{color:var(--color-list-hl)}ul.list-v>li>a:hover{color:var(--color-list-hl);background:var(--color-site-bg)}.l_header .menu>ul>li>a{display:block;padding:0 8px;display:flex}.l_header .menu>ul>li>a .icon{width:16px;margin-right:6px}.l_header .menu>ul>li>a .icon i{display:inline-block}.l_header .menu>ul>li>ul .icon{width:16px;margin-right:2px}.l_header .menu>ul>li>ul .icon i{display:inline-block}.l_header ul.nav-list-h>li{color:var(--color-list);line-height:64px}.l_header ul.nav-list-h>li>a{max-height:64px;overflow:hidden;color:inherit}.l_header ul.nav-list-h>li>a.active span,.l_header ul.nav-list-h>li>a:active span{color:#3dd9b6}.l_header ul.nav-list-h>li:hover>a{color:var(--color-list-hl)}.l_header ul.nav-list-h>li i.music{animation:rotate-effect 1.5s linear infinite;-webkit-animation:rotate-effect 1.5s linear infinite;-khtml-animation:rotate-effect 1.5s linear infinite;-moz-animation:rotate-effect 1.5s linear infinite;-o-animation:rotate-effect 1.5s linear infinite;-ms-animation:rotate-effect 1.5s linear infinite}@-moz-keyframes rotate-effect{0%{transform:rotate(0);-webkit-transform:rotate(0);-khtml-transform:rotate(0);-moz-transform:rotate(0);-o-transform:rotate(0);-ms-transform:rotate(0)}25%{transform:rotate(90deg);-webkit-transform:rotate(90deg);-khtml-transform:rotate(90deg);-moz-transform:rotate(90deg);-o-transform:rotate(90deg);-ms-transform:rotate(90deg)}50%{transform:rotate(180deg);-webkit-transform:rotate(180deg);-khtml-transform:rotate(180deg);-moz-transform:rotate(180deg);-o-transform:rotate(180deg);-ms-transform:rotate(180deg)}75%{transform:rotate(270deg);-webkit-transform:rotate(270deg);-khtml-transform:rotate(270deg);-moz-transform:rotate(270deg);-o-transform:rotate(270deg);-ms-transform:rotate(270deg)}100%{transform:rotate(360deg);-webkit-transform:rotate(360deg);-khtml-transform:rotate(360deg);-moz-transform:rotate(360deg);-o-transform:rotate(360deg);-ms-transform:rotate(360deg)}}@-webkit-keyframes rotate-effect{0%{transform:rotate(0);-webkit-transform:rotate(0);-khtml-transform:rotate(0);-moz-transform:rotate(0);-o-transform:rotate(0);-ms-transform:rotate(0)}25%{transform:rotate(90deg);-webkit-transform:rotate(90deg);-khtml-transform:rotate(90deg);-moz-transform:rotate(90deg);-o-transform:rotate(90deg);-ms-transform:rotate(90deg)}50%{transform:rotate(180deg);-webkit-transform:rotate(180deg);-khtml-transform:rotate(180deg);-moz-transform:rotate(180deg);-o-transform:rotate(180deg);-ms-transform:rotate(180deg)}75%{transform:rotate(270deg);-webkit-transform:rotate(270deg);-khtml-transform:rotate(270deg);-moz-transform:rotate(270deg);-o-transform:rotate(270deg);-ms-transform:rotate(270deg)}100%{transform:rotate(360deg);-webkit-transform:rotate(360deg);-khtml-transform:rotate(360deg);-moz-transform:rotate(360deg);-o-transform:rotate(360deg);-ms-transform:rotate(360deg)}}@-o-keyframes rotate-effect{0%{transform:rotate(0);-webkit-transform:rotate(0);-khtml-transform:rotate(0);-moz-transform:rotate(0);-o-transform:rotate(0);-ms-transform:rotate(0)}25%{transform:rotate(90deg);-webkit-transform:rotate(90deg);-khtml-transform:rotate(90deg);-moz-transform:rotate(90deg);-o-transform:rotate(90deg);-ms-transform:rotate(90deg)}50%{transform:rotate(180deg);-webkit-transform:rotate(180deg);-khtml-transform:rotate(180deg);-moz-transform:rotate(180deg);-o-transform:rotate(180deg);-ms-transform:rotate(180deg)}75%{transform:rotate(270deg);-webkit-transform:rotate(270deg);-khtml-transform:rotate(270deg);-moz-transform:rotate(270deg);-o-transform:rotate(270deg);-ms-transform:rotate(270deg)}100%{transform:rotate(360deg);-webkit-transform:rotate(360deg);-khtml-transform:rotate(360deg);-moz-transform:rotate(360deg);-o-transform:rotate(360deg);-ms-transform:rotate(360deg)}}@keyframes rotate-effect{0%{transform:rotate(0);-webkit-transform:rotate(0);-khtml-transform:rotate(0);-moz-transform:rotate(0);-o-transform:rotate(0);-ms-transform:rotate(0)}25%{transform:rotate(90deg);-webkit-transform:rotate(90deg);-khtml-transform:rotate(90deg);-moz-transform:rotate(90deg);-o-transform:rotate(90deg);-ms-transform:rotate(90deg)}50%{transform:rotate(180deg);-webkit-transform:rotate(180deg);-khtml-transform:rotate(180deg);-moz-transform:rotate(180deg);-o-transform:rotate(180deg);-ms-transform:rotate(180deg)}75%{transform:rotate(270deg);-webkit-transform:rotate(270deg);-khtml-transform:rotate(270deg);-moz-transform:rotate(270deg);-o-transform:rotate(270deg);-ms-transform:rotate(270deg)}100%{transform:rotate(360deg);-webkit-transform:rotate(360deg);-khtml-transform:rotate(360deg);-moz-transform:rotate(360deg);-o-transform:rotate(360deg);-ms-transform:rotate(360deg)}}.menu-phone li ul.list-v{right:calc(100% - .5 * 16px)}.menu-phone li ul.list-v ul{right:calc(100% - .5 * 16px)}#wrapper{max-width:1080px;margin:auto}@media screen and (min-width:2048px){#wrapper{max-width:55vw}}#wrapper .menu{-webkit-box-flex:1;-moz-box-flex:1;-webkit-flex:1 1;-ms-flex:1 1;flex:1 1;margin:0 16px 0 0}#wrapper .menu .list-v ul{left:calc(100% - .5 * 16px)}.menu-phone{display:none;margin-top:16px;right:8px;transition:all .28s ease;-webkit-transition:all .28s ease;-khtml-transition:all 0.28s ease;-moz-transition:all .28s ease;-o-transition:all .28s ease;-ms-transition:all .28s ease}.menu-phone ul{right:calc(100% - .5 * 16px)}@media screen and (max-width:500px){.menu-phone{display:block}}.l_header{max-width:65vw;left:calc((100% - 65vw) * .5);border-bottom-left-radius:8px;border-bottom-right-radius:8px}@media screen and (max-width:2048px){.l_header{max-width:1112px;left:calc((100% - 1112px) * .5)}}@media screen and (max-width:1112px){.l_header{left:0;border-radius:0;-webkit-border-radius:0;max-width:100%}}@media screen and (max-width:500px){.l_header .container{margin-left:0;margin-right:0}.l_header #wrapper .nav-main .title{padding-left:16px;padding-right:16px}.l_header #wrapper .nav-sub{width:100%}.l_header #wrapper .nav-sub .title{overflow-y:scroll;margin-top:2px;padding:8px 16px}.l_header #wrapper .switcher{display:flex;margin-right:8px;height:64px}.l_header .menu{display:none}}@media screen and (max-width:500px){.list-v li{max-width:270px}}@media screen and (min-width:768px){#l_cover,#l_header{display:none}}#u-search{display:none;position:fixed;top:0;left:0;width:100%;height:100%;padding:60px 20px;z-index:1001}@media screen and (max-width:680px){#u-search{padding:0}}</style><link rel="stylesheet" href="/css/style.css" media="print" onload='this.media="all",this.onload=null'><noscript><link rel="stylesheet" href="/css/style.css"></noscript><script>document.addEventListener("error",(function(t){const a=t.target,e=t.target.parentElement,r=e.classList.toString(),s=e.parentElement.classList.toString();"img"===a.tagName.toLowerCase()&&(a.classList.add("fix-cursor-default","error"),"fancybox"===r&&"fancybox"===s?(e.parentElement.classList.add("hideFancybox"),e.parentElement.classList.remove("fancybox"),e.classList.remove("fancybox")):"img-bg"===r&&"img-wrap"===s?e.parentElement.classList.add("hideFancybox"):"author"===r?e.parentElement.classList.add("fix-author-imgError"):-1!=r.indexOf("tk-avatar")&&e.parentElement.classList.add("fix-avatar-imgError"))}),!0)</script><script>window.MSInputMethodContext&&document.documentMode&&document.write('<style>html{overflow-x: hidden !important;overflow-y: hidden !important;}.kill-ie{text-align:center;height: 100%;margin-top: 15%;margin-bottom: 5500%;}.kill-t{font-size: 2rem;}.kill-c{font-size: 1.2rem;}#l_header,#l_body{display: none;}</style><div class="kill-ie"><span class="kill-t"><b>抱歉，您的浏览器无法访问本站</b></span><br/><span class="kill-c">微软已经于2016年终止了对 Internet Explorer (IE) 10 及更早版本的支持，<br/>继续使用存在极大的安全隐患，请使用当代主流的浏览器进行访问。</span><br/><a target="_blank" rel="noopener" href="https://blogs.windows.com/windowsexperience/2021/05/19/the-future-of-internet-explorer-on-windows-10-is-in-microsoft-edge/"><strong>了解详情 ></strong></a></div>')</script><noscript><style>html{overflow-x:hidden!important;overflow-y:hidden!important}.kill-noscript{text-align:center;height:100%;margin-top:15%;margin-bottom:5500%}.kill-t{font-size:2rem}.kill-c{font-size:1.2rem}#l_body,#l_header{display:none}</style><div class="kill-noscript"> <span class="kill-t"><b>抱歉，您的浏览器无法访问本站</b></span><br> <span class="kill-c">本页面需要浏览器支持（启用）JavaScript</span><br> <a target="_blank" rel="noopener" href="https://www.baidu.com/s?wd=启用JavaScript"><strong>了解详情 ></strong></a></div></noscript><script>function volantisEventListener(e,t,n){this.type=e,this.f=t,this.ele=n}function volantisDom(e){return e||(e=document.createElement("div")),this.ele=e,this.ele.find=e=>{let t=this.ele.querySelector(e);if(t)return new volantisDom(t)},this.ele.hasClass=e=>this.ele.className.match(new RegExp("(\\s|^)"+e+"(\\s|$)")),this.ele.addClass=e=>(this.ele.classList.add(e),this.ele),this.ele.removeClass=e=>(this.ele.classList.remove(e),this.ele),this.ele.toggleClass=e=>(this.ele.hasClass(e)?this.ele.removeClass(e):this.ele.addClass(e),this.ele),this.ele.on=(e,t,n=1)=>(this.ele.addEventListener(e,t,!1),n&&volantis.EventListener.list.push(new volantisEventListener(e,t,this.ele)),this.ele),this.ele.click=(e,t)=>(this.ele.on("click",e,t),this.ele),this.ele.scroll=(e,t)=>(this.ele.on("scroll",e,t),this.ele),this.ele.html=e=>(this.ele.innerHTML=e,this.ele),this.ele.hide=e=>(this.ele.style.display="none",this.ele),this.ele.show=e=>(this.ele.style.display="block",this.ele),this.ele}function RunItem(){function e(e,t){this.name=t||e.name,this.run=()=>{try{e()}catch(e){console.log(e)}}}this.list=[],this.start=()=>{for(var e=0;e<this.list.length;e++)this.list[e].run()},this.push=(t,n,s=!0)=>{let o=t;s&&(o=()=>{volantis.requestAnimationFrame(t)});var l=new e(o,n);this.list.push(l)},this.remove=e=>{for(let t=0;t<this.list.length;t++){this.list[t].name==e&&this.list.splice(t,1)}}}function errorImgAvatar(e){e.src="https://jsd.cdn.storisinz.site/npm/volantis-static@0.0.1660614606622/media/placeholder/avatar/round/3442075.svg",e.onerror=null}function errorImgCover(e){e.src="https://jsd.cdn.storisinz.site/npm/volantis-static@0.0.1660614606622/media/placeholder/cover/76b86c0226ffd.svg",e.onerror=null}window.volantis={},volantis.debug="env",volantis.dom={},volantis.EventListener={},volantis.EventListener.list=[],volantis.EventListener.remove=()=>{volantis.EventListener.list.forEach((function(e){e.ele.removeEventListener(e.type,e.f,!1)})),volantis.EventListener.list=[]},volantis.dom.$=e=>e?new volantisDom(e):null,volantis.pjax={},volantis.pjax.method={complete:new RunItem,error:new RunItem,send:new RunItem},volantis.pjax=Object.assign(volantis.pjax,{push:volantis.pjax.method.complete.push,error:volantis.pjax.method.error.push,send:volantis.pjax.method.send.push}),volantis.rightmenu={},volantis.rightmenu.method={handle:new RunItem},volantis.rightmenu=Object.assign(volantis.rightmenu,{handle:volantis.rightmenu.method.handle.push}),volantis.dark={},volantis.dark.method={toggle:new RunItem},volantis.dark=Object.assign(volantis.dark,{push:volantis.dark.method.toggle.push}),volantis.js=(e,t)=>new Promise((n=>{setTimeout((function(){var s=document.getElementsByTagName("head")[0]||document.documentElement,o=document.createElement("script");if(o.setAttribute("type","text/javascript"),t)if(JSON.stringify(t))for(let e in t)"onload"==e?o[e]=()=>{t[e](),n()}:(o[e]=t[e],o.onload=n);else o.onload=()=>{t(),n()};else o.onload=n;o.setAttribute("src",e),s.appendChild(o)}))})),volantis.css=e=>new Promise((t=>{setTimeout((function(){var n=document.createElement("link");n.rel="stylesheet",n.href=e,n.onload=t,document.getElementsByTagName("head")[0].appendChild(n)}))})),volantis.import={jQuery:()=>"undefined"==typeof jQuery?volantis.js("https://jsd.cdn.storisinz.site/npm/jquery@3.6.0/dist/jquery.min.js"):new Promise((e=>{e()}))},volantis.requestAnimationFrame=e=>{window.requestAnimationFrame||(window.requestAnimationFrame=window.requestAnimationFrame||window.mozRequestAnimationFrame||window.webkitRequestAnimationFrame),window.requestAnimationFrame(e)},volantis.layoutHelper=(e,t,n)=>{function s(e,t,n){volantis.tempDiv=document.createElement("div"),volantis.tempDiv.innerHTML=t;let s=document.querySelector("#layoutHelper-"+e);s&&(n&&(s.innerHTML=""),s.append(volantis.tempDiv))}n=Object.assign({clean:!1,pjax:!0},n),s(e,t,n.clean),n.pjax&&volantis.pjax.push((()=>{s(e,t,n.clean)}),"layoutHelper-"+e)},volantis.scroll={engine:new RunItem,unengine:new RunItem},volantis.scroll=Object.assign(volantis.scroll,{push:volantis.scroll.engine.push}),volantis.scroll.getScrollTop=()=>{let e;return window.pageYOffset?e=window.pageYOffset:document.compatMode&&"BackCompat"!=document.compatMode?e=document.documentElement.scrollTop:document.body&&(e=document.body.scrollTop),e},volantis.scroll.scrollHeight=function(){return Math.max(document.body.scrollHeight,document.documentElement.scrollHeight)},volantis.scroll.offsetHeight=function(){return Math.max(document.body.offsetHeight,document.documentElement.offsetHeight,document.body.clientHeight,document.documentElement.clientHeight)},volantis.scroll.progress=function(){return volantis.scroll.getScrollTop()/(volantis.scroll.scrollHeight()-volantis.scroll.offsetHeight())},volantis.scroll.handleScrollEvents=()=>{volantis.scroll.lastScrollTop=volantis.scroll.getScrollTop(),volantis.requestAnimationFrame((function e(){const t=volantis.scroll.getScrollTop();volantis.scroll.lastScrollTop!==t?(volantis.scroll.del=t-volantis.scroll.lastScrollTop,volantis.scroll.lastScrollTop=t,volantis.scroll.unengine.list=[],volantis.scroll.engine.start()):volantis.scroll.unengine.start(),volantis.requestAnimationFrame(e)}))},volantis.scroll.handleScrollEvents(),volantis.scroll.ele=null,volantis.scroll.to=(e,t={})=>{e&&(volantis.scroll.ele=e,opt={top:e.getBoundingClientRect().top+document.documentElement.scrollTop,behavior:"smooth"},"top"in t&&(opt.top=t.top),"behavior"in t&&(opt.behavior=t.behavior),"addTop"in t&&(opt.top+=t.addTop),"observerDic"in t||(t.observerDic=100),window.scrollTo(opt),t.observer&&setTimeout((()=>{volantis.scroll.ele==e&&volantis.scroll.unengine.push((()=>{let n=e.getBoundingClientRect().top;n>=-t.observerDic&&n<=t.observerDic||volantis.scroll.to(e,t),volantis.scroll.unengine.remove("unengineObserver")}),"unengineObserver")}),1e3))},volantis.cleanContentVisibility=()=>{document.querySelector(".post-story")&&(console.log("cleanContentVisibility"),document.querySelectorAll(".post-story").forEach((e=>{e.classList.remove("post-story")})))}</script><script>volantis.GLOBAL_CONFIG={root:"/",debug:"env",default:{avatar:"https://jsd.cdn.storisinz.site/npm/volantis-static@0.0.1660614606622/media/placeholder/avatar/round/3442075.svg",link:"https://jsd.cdn.storisinz.site/npm/volantis-static@0.0.1660614606622/media/placeholder/link/8f277b4ee0ecd.svg",cover:"https://jsd.cdn.storisinz.site/npm/volantis-static@0.0.1660614606622/media/placeholder/cover/76b86c0226ffd.svg",image:"https://jsd.cdn.storisinz.site/npm/volantis-static@0.0.1660614606622/media/placeholder/image/2659360.svg"},lastupdate:new Date(1730537425094),cdn:{izitoast_css:"https://jsd.cdn.storisinz.site/npm/izitoast@1.4.0/dist/css/iziToast.min.css",izitoast_js:"https://jsd.cdn.storisinz.site/npm/izitoast@1.4.0/dist/js/iziToast.min.js",fancybox_css:"https://jsd.cdn.storisinz.site/npm/@fancyapps/ui@4.0.31/dist/fancybox.css",fancybox_js:"https://jsd.cdn.storisinz.site/npm/@fancyapps/ui@4.0.31/dist/fancybox.umd.js"},sidebar:{for_page:["nextsite","nextblogger","category","tagcloud","webinfo"],for_post:["nextsite","nextblogger","category","tagcloud","webinfo"],webinfo:{lastupd:{enable:!0,friendlyShow:!0},runtime:{data:"2020/01/01",unit:"天"}}},plugins:{message:{enable:!0,icon:{default:"fa-solid fa-info-circle light-blue",quection:"fa-solid fa-question-circle light-blue"},time:{default:5e3,quection:2e4},position:"topRight",transitionIn:"bounceInLeft",transitionOut:"fadeOutRight",titleColor:"var(--color-text)",messageColor:"var(--color-text)",backgroundColor:"var(--color-card)",zindex:2147483647,copyright:{enable:!0,title:"知识共享许可协议",message:"请遵守 CC BY-NC-SA 4.0 协议。",icon:"far fa-copyright light-blue"},aplayer:{enable:!0,play:"fa-solid fa-play",pause:"fa-solid fa-pause"},rightmenu:{enable:!0,notice:!0}}},search:{appId:"72TOQYD33Q",indexName:"hexo",apiKey:"608d2f3acd06140a2473153f6cb61eda",hitsPerPage:"5",placeholder:"Search...",searchAsYouType:!0},languages:{search:{hits_empty:"找不到您查询的内容：${query}",hits_stats:"找到 ${hits} 条结果，用时 ${time} 毫秒"}}}</script><link rel="authorization_endpoint" href="https://indieauth.com/auth"><link rel="token_endpoint" href="https://tokens.indieauth.com/token"><script src="https://jsd.cdn.storisinz.site/npm/axios@1.7.7/dist/axios.js" crossorigin="anonymous" referrerpolicy="no-referrer"></script><script>"serviceWorker"in navigator?navigator.serviceWorker.register("/sw.js").then((function(){navigator.serviceWorker.controller?console.log("Assets cached by the controlling service worker."):console.log("Please reload this page to allow the service worker to handle network operations.")})).catch((function(e){console.log("ERROR: "+e)})):console.log("Service workers are not supported in the current browser.")</script></head><body itemscope itemtype="http://schema.org/WebPage"><header itemscope itemtype="http://schema.org/WPHeader" id="l_header" class="l_header auto shadow floatable blur show showed" style="opacity:0"><div class="container"><div id="wrapper"><div class="nav-sub"><p class="title fix-header-title"></p><ul class="switcher nav-list-h m-phone" id="pjax-header-nav-list"><li><a id="s-comment" class="fa-solid fa-comments fa-fw" target="_self" title="comment"></a></li><li><a id="s-toc" class="s-toc fa-solid fa-list fa-fw" target="_self" title="toc"></a></li></ul></div><div class="nav-main"><a class="title flat-box" target="_self" href="/"><i class="fa fa-home"></i> <span>汐塔魔法屋</span></a><div class="menu navigation"><ul class="nav-list-h m-pc"><li><a class="menuitem flat-box faa-parent animated-hover" href="/categories/" title="分类" active-action="action-categories"><span class="icon"><i class="fa-solid fa-folder-open fa-fw"></i></span> <span>分类</span></a></li><li><a class="menuitem flat-box faa-parent animated-hover" href="/tags/" title="标签" active-action="action-tags"><span class="icon"><i class="fa-solid fa-tags fa-fw"></i></span> <span>标签</span></a></li><li><a class="menuitem flat-box faa-parent animated-hover" href="/archives/" title="归档" active-action="action-archives"><span class="icon"><i class="fa-solid fa-archive fa-fw"></i></span> <span>归档</span></a></li><li><a class="menuitem flat-box faa-parent animated-hover" href="/link/" title="友链" active-action="action-link"><span class="icon"><i class="fa-solid fa-link fa-fw"></i></span> <span>友链</span></a></li><li><a class="menuitem flat-box faa-parent animated-hover" target="_blank" rel="noopener" href="https://www.travellings.cn/go.html" title="开往" active-action="action-https:wwwtravellingscngohtml"><span class="icon"><i class="fa-solid fa-subway fa-fw"></i></span> <span>开往</span></a></li><li><a class="menuitem flat-box faa-parent animated-hover" target="_blank" rel="noopener" href="https://en.blog.sinzmise.top/" title="English" active-action="action-https:enblogsinzmisetop"><span class="icon"><i class="fa fa-language fa-fw fa-fw"></i></span> <span>English</span></a></li></ul></div><div class="m_search"><form name="searchform" class="form u-search-form"><i class="icon fas fa-search fa-fw"></i> <input type="text" class="input u-search-input" placeholder="Search..."></form></div><ul class="switcher nav-list-h m-phone"><li><a class="s-search fa-solid fa-search fa-fw" target="_self" title="search"></a></li><li><a class="s-menu fa-solid fa-bars fa-fw" target="_self" title="menu"></a><ul class="menu-phone list-v navigation white-box"><li><a class="menuitem flat-box faa-parent animated-hover" href="/categories/" title="分类" active-action="action-categories"><span class="icon"><i class="fa-solid fa-folder-open fa-fw"></i></span> <span>分类</span></a></li><li><a class="menuitem flat-box faa-parent animated-hover" href="/tags/" title="标签" active-action="action-tags"><span class="icon"><i class="fa-solid fa-tags fa-fw"></i></span> <span>标签</span></a></li><li><a class="menuitem flat-box faa-parent animated-hover" href="/archives/" title="归档" active-action="action-archives"><span class="icon"><i class="fa-solid fa-archive fa-fw"></i></span> <span>归档</span></a></li><li><a class="menuitem flat-box faa-parent animated-hover" href="/link/" title="友链" active-action="action-link"><span class="icon"><i class="fa-solid fa-link fa-fw"></i></span> <span>友链</span></a></li><li><a class="menuitem flat-box faa-parent animated-hover" target="_blank" rel="noopener" href="https://www.travellings.cn/go.html" title="开往" active-action="action-https:wwwtravellingscngohtml"><span class="icon"><i class="fa-solid fa-subway fa-fw"></i></span> <span>开往</span></a></li><li><a class="menuitem flat-box faa-parent animated-hover" target="_blank" rel="noopener" href="https://en.blog.sinzmise.top/" title="English" active-action="action-https:enblogsinzmisetop"><span class="icon"><i class="fa fa-language fa-fw fa-fw"></i></span> <span>English</span></a></li></ul></li></ul></div></div></div></header><div id="l_body"><div id="l_cover"></div><div id="safearea"><div class="body-wrapper"><div id="l_main" class=""><article itemscope itemtype="http://schema.org/Article" class="h-entry article post white-box reveal md shadow floatable blur article-type-post" id="post" itemscope itemprop="blogPost"><link itemprop="mainEntityOfPage" href="https://blog.sinzmise.top/posts/38964/"><span hidden itemprop="publisher" itemscope itemtype="http://schema.org/Organization"><meta itemprop="name" content="汐塔魔法屋"></span><span hidden itemprop="post" itemscope itemtype="http://schema.org/Post"><meta itemprop="name" content="汐塔魔法屋"><meta itemprop="description" content="The Story,The Dream."></span><span hidden><meta itemprop="image" content="https://blog.sinzmise.top/images/siteicon/web-app-manifest-192x192.png"></span><div class="article-meta" id="top"><h1 class="title allow-select p-name" itemprop="name headline"> 小康大佬的说说方案 ———— ispeak搭建教程</h1><div class="new-meta-box"><div class="new-meta-item author p-author h-card" itemprop="author" itemscope itemtype="http://schema.org/Person"> <a itemprop="url" class="author u-url" href="https://blog.sinzmise.top/" rel="nofollow"><img itemprop="image" class="u-photo" no-lazy src="/img/avatar.png" alt="Author"><p itemprop="name" class="p-name">王九弦SZ·Ninty</p></a></div><div class="new-meta-item category"><i class="fa-solid fa-folder-open fa-fw" aria-hidden="true"></i> <a class="category-link" href="/categories/%E7%AB%99%E7%82%B9%E6%8A%98%E8%85%BE/">站点折腾</a> <span hidden itemprop="about" itemscope itemtype="http://schema.org/Thing"><a href="/categories/%E7%AB%99%E7%82%B9%E6%8A%98%E8%85%BE/" itemprop="url"><span itemprop="name p-category">站点折腾</span></a></span></div><div class="new-meta-item date" itemprop="dateCreated datePublished"><a class="notlink"><i class="fa-solid fa-calendar-alt fa-fw" aria-hidden="true"></i><p>发布于：<time class="dataToShow dt-published" datetime="2023-01-13T21:01:37+00:00" title="2023年1月13日">2023年1月13日</time></p></a></div><div class="new-meta-item browse"><a class="notlink"><p><i class="fa-solid fa-eye fa-fw" aria-hidden="true"></i><span id="busuanzi_value_page_pv"><i class="fa-solid fa-loader fa-spin fa-fw" aria-hidden="true"></i></span> <span>次浏览</span></p></a></div></div></div><div id="layoutHelper-page-plugins"></div><div id="post-body" itemprop="articleBody" class="e-content"><p>搞ispeak时发现ispeak更新，能自定义评论了，也就是说我之前写的<a target="_blank" rel="noopener" href="https://blog.xsnet.eu.org/posts/43224/">ispeak教程</a>失效了<br>没办法我只能重新写了这篇教程<br><span id="more"></span></p><h1 id="教程"><a href="#教程" class="headerlink" title="教程"></a>教程</h1><h2 id="后端部署"><a href="#后端部署" class="headerlink" title="后端部署"></a>后端部署</h2><h3 id="配置数据库"><a href="#配置数据库" class="headerlink" title="配置数据库"></a>配置数据库</h3><div class="note info"><p>以下内容来自：<a target="_blank" rel="noopener" href="https://discuss.js.org/guide/Get-MongoDB-DataBase.html">https://discuss.js.org/guide/Get-MongoDB-DataBase.html</a></p></div><ul><li>注册<a target="_blank" rel="noopener" href="https://www.mongodb.com/cloud/atlas/register">MongoDB</a>账号，注册完成后会提示你创建一个组织，并且输入一个项目昵称，选择编程语言(不选也可以)，随后点击右下角的 <code>Continue</code>(继续)，如果没有可以跟如下图执行，点击 <code>Create an Organization</code>(创建组织)<br> <img src="https://discuss.js.org/img/guide/Get-MongoDB-DataBase/Organizations-Home.png" class="lazyload" data-srcset="https://discuss.js.org/img/guide/Get-MongoDB-DataBase/Organizations-Home.png" srcset="data:image/gif;base64,R0lGODlhAQABAIAAAP///////yH5BAEKAAEALAAAAAABAAEAAAICTAEAOw==" alt="Organizations-Home"><br> <img src="https://discuss.js.org/img/guide/Get-MongoDB-DataBase/Register-Organizations.png" class="lazyload" data-srcset="https://discuss.js.org/img/guide/Get-MongoDB-DataBase/Register-Organizations.png" srcset="data:image/gif;base64,R0lGODlhAQABAIAAAP///////yH5BAEKAAEALAAAAAABAAEAAAICTAEAOw==" alt="Register-Organizations"><br> <img src="https://discuss.js.org/img/guide/Get-MongoDB-DataBase/Create-Organization.png" class="lazyload" data-srcset="https://discuss.js.org/img/guide/Get-MongoDB-DataBase/Create-Organization.png" srcset="data:image/gif;base64,R0lGODlhAQABAIAAAP///////yH5BAEKAAEALAAAAAABAAEAAAICTAEAOw==" alt="Create-Organization"><br> <img src="https://discuss.js.org/img/guide/Get-MongoDB-DataBase/New-Project.png" class="lazyload" data-srcset="https://discuss.js.org/img/guide/Get-MongoDB-DataBase/New-Project.png" srcset="data:image/gif;base64,R0lGODlhAQABAIAAAP///////yH5BAEKAAEALAAAAAABAAEAAAICTAEAOw==" alt="New-Project"><br> <img src="https://discuss.js.org/img/guide/Get-MongoDB-DataBase/Project-Name.png" class="lazyload" data-srcset="https://discuss.js.org/img/guide/Get-MongoDB-DataBase/Project-Name.png" srcset="data:image/gif;base64,R0lGODlhAQABAIAAAP///////yH5BAEKAAEALAAAAAABAAEAAAICTAEAOw==" alt="Project-Name"><br> <img src="https://discuss.js.org/img/guide/Get-MongoDB-DataBase/Create-Project.png" class="lazyload" data-srcset="https://discuss.js.org/img/guide/Get-MongoDB-DataBase/Create-Project.png" srcset="data:image/gif;base64,R0lGODlhAQABAIAAAP///////yH5BAEKAAEALAAAAAABAAEAAAICTAEAOw==" alt="Create-Project"><br> <img src="https://discuss.js.org/img/guide/Get-MongoDB-DataBase/Build-Database.png" class="lazyload" data-srcset="https://discuss.js.org/img/guide/Get-MongoDB-DataBase/Build-Database.png" srcset="data:image/gif;base64,R0lGODlhAQABAIAAAP///////yH5BAEKAAEALAAAAAABAAEAAAICTAEAOw==" alt="Build-Database"><br> <img src="https://discuss.js.org/img/guide/Get-MongoDB-DataBase/Select-Free.png" class="lazyload" data-srcset="https://discuss.js.org/img/guide/Get-MongoDB-DataBase/Select-Free.png" srcset="data:image/gif;base64,R0lGODlhAQABAIAAAP///////yH5BAEKAAEALAAAAAABAAEAAAICTAEAOw==" alt="Select-Free"><br> <img src="https://discuss.js.org/img/guide/Get-MongoDB-DataBase/AWS-N.Virginia.png" class="lazyload" data-srcset="https://discuss.js.org/img/guide/Get-MongoDB-DataBase/AWS-N.Virginia.png" srcset="data:image/gif;base64,R0lGODlhAQABAIAAAP///////yH5BAEKAAEALAAAAAABAAEAAAICTAEAOw==" alt="AWS-N.Virginia"></li><li>选择免费的共享数据库，随后会跳出选择地区(选择离你服务端近的即可)，点击 <code>Create Cluster</code>创建</li><li>随后您需要创建数据库用户，输入用户名和密码，继续向下滚动就是添加 IP 地址，最后点击下方的 <code>Finish and Close</code>(完成并关闭)按钮</li></ul><div class="note warning"><p><strong>注意</strong><br>服务器部署，则填服务器公网 IP<br><code>无服务器(ServerLess)</code>ServerLess 一般都是动态 IP，你无法得到一个固定 IP，我们建议填写 <code>0.0.0.0</code></p></div><p><img src="https://discuss.js.org/img/guide/Get-MongoDB-DataBase/Add-IP.png" class="lazyload" data-srcset="https://discuss.js.org/img/guide/Get-MongoDB-DataBase/Add-IP.png" srcset="data:image/gif;base64,R0lGODlhAQABAIAAAP///////yH5BAEKAAEALAAAAAABAAEAAAICTAEAOw==" alt="Add IP"></p><ul><li>稍作等待创建好数据库即可，随后点击 <code>Connect</code>(连接)，点击选择 <code>Connect you application</code>(连接应用程序)，然后复制连接数据库字符串</li></ul><div class="note warning"><p><strong>注意</strong><br>需要将字符串中的 <code>&lt;password&gt;</code>替换为您在第三步创建的数据库用户密码，修改 <code>myFirstDatabase</code>为你想要的数据库名称例如:<code>Discuss</code></p></div><p><img src="https://discuss.js.org/img/guide/Get-MongoDB-DataBase/Connect.png" class="lazyload" data-srcset="https://discuss.js.org/img/guide/Get-MongoDB-DataBase/Connect.png" srcset="data:image/gif;base64,R0lGODlhAQABAIAAAP///////yH5BAEKAAEALAAAAAABAAEAAAICTAEAOw==" alt="Connect"><br><img src="https://discuss.js.org/img/guide/Get-MongoDB-DataBase/Get-Connect.png" class="lazyload" data-srcset="https://discuss.js.org/img/guide/Get-MongoDB-DataBase/Get-Connect.png" srcset="data:image/gif;base64,R0lGODlhAQABAIAAAP///////yH5BAEKAAEALAAAAAABAAEAAAICTAEAOw==" alt="Get Connect"></p><h3 id="部署kkapi"><a href="#部署kkapi" class="headerlink" title="部署kkapi"></a>部署kkapi</h3><div class="tabs" id="tab-部署kkapi"><ul class="nav-tabs"><li class="tab active"><a class="#部署kkapi-1">Vercel部署（推荐）</a></li><li class="tab"><a class="#部署kkapi-2">服务器部署</a></li><li class="tab"><a class="#部署kkapi-3">docker 部署</a></li></ul><div class="tab-content"><div class="tab-pane active" id="部署kkapi-1"><ul><li>点击下方按钮，跳转至 Vercel 进行部署。<br><a target="_blank" rel="noopener" href="https://vercel.com/new/clone?repository-url=https://github.com/kkfive/kkapi-open/tree/vercel"><img src="https://vercel.com/button" class="lazyload" data-srcset="https://vercel.com/button" srcset="data:image/gif;base64,R0lGODlhAQABAIAAAP///////yH5BAEKAAEALAAAAAABAAEAAAICTAEAOw==" alt="部署到Vercel"></a></li><li>配置环境变量：<br><img src="https://jsd.cdn.storisinz.site/gh/SinzMise/MYPictures@master/20230114/msedge_wwcTzH8isA.10hmhosvut28.webp" class="lazyload" data-srcset="https://jsd.cdn.storisinz.site/gh/SinzMise/MYPictures@master/20230114/msedge_wwcTzH8isA.10hmhosvut28.webp" srcset="data:image/gif;base64,R0lGODlhAQABAIAAAP///////yH5BAEKAAEALAAAAAABAAEAAAICTAEAOw==" alt="msedge_wwcTzH8isA"><br>环境变量可能随项目的迭代而增加必填的环境变量，具体请参考<a target="_blank" rel="noopener" href="https://kkapi.js.org/reference/kkapi/environment.html">官网 —— kkapi环境变量</a></li><li>重新部署<br><img src="https://jsd.cdn.storisinz.site/gh/SinzMise/MYPictures@master/20230114/msedge_owqMifozPi.37vcfu5vfpm0.webp" class="lazyload" data-srcset="https://jsd.cdn.storisinz.site/gh/SinzMise/MYPictures@master/20230114/msedge_owqMifozPi.37vcfu5vfpm0.webp" srcset="data:image/gif;base64,R0lGODlhAQABAIAAAP///////yH5BAEKAAEALAAAAAABAAEAAAICTAEAOw==" alt="msedge_owqMifozPi"><br><img src="https://jsd.cdn.storisinz.site/gh/SinzMise/MYPictures@master/20230114/msedge_5WUBTLL0NZ.1nl1z1a7qiqo.webp" class="lazyload" data-srcset="https://jsd.cdn.storisinz.site/gh/SinzMise/MYPictures@master/20230114/msedge_5WUBTLL0NZ.1nl1z1a7qiqo.webp" srcset="data:image/gif;base64,R0lGODlhAQABAIAAAP///////yH5BAEKAAEALAAAAAABAAEAAAICTAEAOw==" alt="msedge_5WUBTLL0NZ"><br><img src="https://jsd.cdn.storisinz.site/gh/SinzMise/MYPictures@master/20230114/msedge_mMprAjHb9O.3b2527plrfg.webp" class="lazyload" data-srcset="https://jsd.cdn.storisinz.site/gh/SinzMise/MYPictures@master/20230114/msedge_mMprAjHb9O.3b2527plrfg.webp" srcset="data:image/gif;base64,R0lGODlhAQABAIAAAP///////yH5BAEKAAEALAAAAAABAAEAAAICTAEAOw==" alt="msedge_mMprAjHb9O"></li><li>绑定域名（建议）<br><img src="https://jsd.cdn.storisinz.site/gh/SinzMise/MYPictures@master/20230114/msedge_miAwQcdm9f.3htnm9dlllq0.webp" class="lazyload" data-srcset="https://jsd.cdn.storisinz.site/gh/SinzMise/MYPictures@master/20230114/msedge_miAwQcdm9f.3htnm9dlllq0.webp" srcset="data:image/gif;base64,R0lGODlhAQABAIAAAP///////yH5BAEKAAEALAAAAAABAAEAAAICTAEAOw==" alt="msedge_miAwQcdm9f"></li><li>初始化账户<br>浏览器访问：<br>你刚刚复制的地址/api/user/init?userName=你想设置的账户名<br>如果不指定用户名则自动将账户名设置为admin</li></ul></div><div class="tab-pane" id="部署kkapi-2"><div class="note info"><p>以下内容来自：<a target="_blank" rel="noopener" href="https://kkapi.js.org/guide/setup/deploy.html#%E7%AC%AC%E4%BA%8C%E7%A7%8D%E9%83%A8%E7%BD%B2%E5%A7%BF%E5%8A%BF%EF%BC%9A%E6%9C%8D%E5%8A%A1%E5%99%A8%E9%83%A8%E7%BD%B2">第二种部署姿势：服务器部署</a></p></div><ul><li>克隆源代码<br><code>git clone https://ghproxy.com/https://github.com/kkfive/kkapi-open.git</code></li><li>安装依赖<br><code>yarn install</code><br>如果没有<code>yarn</code>则先允许<code>npm i yarn -g</code>进行安装</li><li>安装 pm2<br><code>npm i pm2 -g</code></li><li>编译项目<br><code>yarn build</code></li><li>配置环境变量<br>在项目目录新建文件<code>local.env</code>，将环境变量写入其中即可。例如：<figure class="highlight plaintext"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br><span class="line">5</span><br><span class="line">6</span><br></pre></td><td class="code"><pre><span class="line">PORT=3000</span><br><span class="line">DATABASE_URL=mongodb://127.0.0.1:27017/kkpaiopen?authSource=admin</span><br><span class="line">DATABASE_USER=root</span><br><span class="line">DATABASE_PASSWORD=root</span><br><span class="line"># 加密密钥 测试</span><br><span class="line">SECRETKEY=xxxxxxxxxxxxxxx</span><br></pre></td></tr></table></figure> 其中 PORT 表示启动的端口</li><li>启动项目<br><code>pm2 start pm2.json</code><br>然后通过命令<code>curl http://127.0.0.1:3000/api/user/init</code>检查是否允许成功<br><img src="https://file.acs.pw/picGo/2022/02/27/20220227101623.png" class="lazyload" data-srcset="https://file.acs.pw/picGo/2022/02/27/20220227101623.png" srcset="data:image/gif;base64,R0lGODlhAQABAIAAAP///////yH5BAEKAAEALAAAAAABAAEAAAICTAEAOw==" alt="image-20220227101623911"></li><li>更新项目<br>进入项目并执行一下命令<figure class="highlight bash"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br></pre></td><td class="code"><pre><span class="line">git pull</span><br><span class="line">yarn build</span><br><span class="line">pm2 restart pm2.json</span><br></pre></td></tr></table></figure></li></ul></div><div class="tab-pane" id="部署kkapi-3"><p>尚未写完</p></div></div></div><h3 id="部署kkadmin"><a href="#部署kkadmin" class="headerlink" title="部署kkadmin"></a>部署kkadmin</h3><p>介绍：kkadmin是kkapi的后台，方便发布说说<br></p><div class="note tip"><p>以下部署姿势你只需要任选其一即可，无需全部部署。</p></div><p></p><div class="tabs" id="tab-部署kkadmin"><ul class="nav-tabs"><li class="tab"><a class="#部署kkadmin-1">Vercel部署</a></li><li class="tab active"><a class="#部署kkadmin-2">CF pages部署（推荐）</a></li><li class="tab"><a class="#部署kkadmin-3">其他环境部署</a></li></ul><div class="tab-content"><div class="tab-pane" id="部署kkadmin-1"><div class="note warning"><p>由于构建 kkadmin 时部分依赖文件需要 nodejs16 及以上版本才可以安装，因此不能将源代码扔给 vercel 进行构建。<br>所以只能够利用 GitHub actions 构建完成后将产物扔给 vercel 进行使用</p></div><ul><li>Fork这个项目：<a target="_blank" rel="noopener" href="https://github.com/kkfive/kkadmin-open/">https://github.com/kkfive/kkadmin-open/</a></li></ul><p><img src="https://jsd.cdn.storisinz.site/gh/StarWEB890/TuChuang@master/images/msedge_6HMaGfN000.1csf0rae8okg.webp" class="lazyload" data-srcset="https://jsd.cdn.storisinz.site/gh/StarWEB890/TuChuang@master/images/msedge_6HMaGfN000.1csf0rae8okg.webp" srcset="data:image/gif;base64,R0lGODlhAQABAIAAAP///////yH5BAEKAAEALAAAAAABAAEAAAICTAEAOw==" alt="msedge_6HMaGfN000"><br><img src="https://jsd.cdn.storisinz.site/gh/StarWEB890/TuChuang@master/images/msedge_UPsCgr2okQ.7k0gi7brxoc0.webp" class="lazyload" data-srcset="https://jsd.cdn.storisinz.site/gh/StarWEB890/TuChuang@master/images/msedge_UPsCgr2okQ.7k0gi7brxoc0.webp" srcset="data:image/gif;base64,R0lGODlhAQABAIAAAP///////yH5BAEKAAEALAAAAAABAAEAAAICTAEAOw==" alt="msedge_UPsCgr2okQ"></p><ul><li>配置变量<br><img src="https://jsd.cdn.storisinz.site/gh/StarWEB890/TuChuang@master/images/msedge_ktuszZjpej.7ftbduod9uc0.webp" class="lazyload" data-srcset="https://jsd.cdn.storisinz.site/gh/StarWEB890/TuChuang@master/images/msedge_ktuszZjpej.7ftbduod9uc0.webp" srcset="data:image/gif;base64,R0lGODlhAQABAIAAAP///////yH5BAEKAAEALAAAAAABAAEAAAICTAEAOw==" alt="msedge_ktuszZjpej"></li></ul><p>VITE_GLOB_API_URL（必选）<br><img src="https://jsd.cdn.storisinz.site/gh/StarWEB890/TuChuang@master/images/msedge_wqMbtdCCon.26m2h3r94d7k.webp" class="lazyload" data-srcset="https://jsd.cdn.storisinz.site/gh/StarWEB890/TuChuang@master/images/msedge_wqMbtdCCon.26m2h3r94d7k.webp" srcset="data:image/gif;base64,R0lGODlhAQABAIAAAP///////yH5BAEKAAEALAAAAAABAAEAAAICTAEAOw==" alt="msedge_wqMbtdCCon"></p><ul><li>构建actions</li></ul><p><img src="https://jsd.cdn.storisinz.site/gh/StarWEB890/TuChuang@master/images/msedge_yymiOm8Kek.23xjzofdum3.webp" class="lazyload" data-srcset="https://jsd.cdn.storisinz.site/gh/StarWEB890/TuChuang@master/images/msedge_yymiOm8Kek.23xjzofdum3.webp" srcset="data:image/gif;base64,R0lGODlhAQABAIAAAP///////yH5BAEKAAEALAAAAAABAAEAAAICTAEAOw==" alt="msedge_yymiOm8Kek"><br><img src="https://jsd.cdn.storisinz.site/gh/StarWEB890/TuChuang@master/images/msedge_4awdNaFJGz.1rdq0mxyfhog.webp" class="lazyload" data-srcset="https://jsd.cdn.storisinz.site/gh/StarWEB890/TuChuang@master/images/msedge_4awdNaFJGz.1rdq0mxyfhog.webp" srcset="data:image/gif;base64,R0lGODlhAQABAIAAAP///////yH5BAEKAAEALAAAAAABAAEAAAICTAEAOw==" alt="msedge_4awdNaFJGz"><br><img src="https://jsd.cdn.storisinz.site/gh/StarWEB890/TuChuang@master/images/msedge_2uYyc6Qh4I.4p3ngtkhmh00.webp" class="lazyload" data-srcset="https://jsd.cdn.storisinz.site/gh/StarWEB890/TuChuang@master/images/msedge_2uYyc6Qh4I.4p3ngtkhmh00.webp" srcset="data:image/gif;base64,R0lGODlhAQABAIAAAP///////yH5BAEKAAEALAAAAAABAAEAAAICTAEAOw==" alt="msedge_2uYyc6Qh4I"></p><ul><li>部署到Vercel<br>复制下面这个网址</li></ul><figure class="highlight plaintext"><table><tr><td class="gutter"><pre><span class="line">1</span><br></pre></td><td class="code"><pre><span class="line">https://vercel.com/new/import?s=https://github.com/SinInno/kkadmin-open/tree/vercel</span><br></pre></td></tr></table></figure><p>并将“SinInno”改为你Github的用户名后访问你刚刚修改的网址<br>PS：如果你Fork的这个项目有改Repository name，那么请将上面的“kkapi-open”改为你这个项目的Repository name</p><p>然后直接部署</p><p><img src="https://jsd.cdn.storisinz.site/gh/StarWEB890/TuChuang@master/images/msedge_GJbsx9xoOw.8zgxw8og644.webp" class="lazyload" data-srcset="https://jsd.cdn.storisinz.site/gh/StarWEB890/TuChuang@master/images/msedge_GJbsx9xoOw.8zgxw8og644.webp" srcset="data:image/gif;base64,R0lGODlhAQABAIAAAP///////yH5BAEKAAEALAAAAAABAAEAAAICTAEAOw==" alt="msedge_GJbsx9xoOw"></p><p>部署完成后点“Go to Dashboard”，并点左上角的“Visit”</p><p><img src="https://jsd.cdn.storisinz.site/gh/StarWEB890/TuChuang@master/images/msedge_Lyo0nIvIqF.d4g2uabkljk.webp" class="lazyload" data-srcset="https://jsd.cdn.storisinz.site/gh/StarWEB890/TuChuang@master/images/msedge_Lyo0nIvIqF.d4g2uabkljk.webp" srcset="data:image/gif;base64,R0lGODlhAQABAIAAAP///////yH5BAEKAAEALAAAAAABAAEAAAICTAEAOw==" alt="msedge_Lyo0nIvIqF"></p><p>账号输入你之前初始化账户的账户名<br>密码请输入默认密码：123456<br>登入面板后请更改默认密码！</p></div><div class="tab-pane active" id="部署kkadmin-2"><div class="note info"><p>如果你已经在 GitHub actions 部署了，那么 cf pages 部署时也可以选择 vercel 进行部署。也可以使用主干分支进行打包部署。<br>接下来的教程以使用 cf pages 构建为例介绍</p></div><ul><li>fork项目（可直接fork）</li><li>导入项目</li></ul><p><img src="https://jsd.cdn.storisinz.site/gh/SinzMise/MYPictures@master/msedge_1bV5Of8ioS.xtthsj95ytc.webp" class="lazyload" data-srcset="https://jsd.cdn.storisinz.site/gh/SinzMise/MYPictures@master/msedge_1bV5Of8ioS.xtthsj95ytc.webp" srcset="data:image/gif;base64,R0lGODlhAQABAIAAAP///////yH5BAEKAAEALAAAAAABAAEAAAICTAEAOw==" alt="msedge_1bV5Of8ioS"><br><img src="https://jsd.cdn.storisinz.site/gh/SinzMise/MYPictures@master/msedge_CcnQ68DBFQ.2q893j8w72k0.webp" class="lazyload" data-srcset="https://jsd.cdn.storisinz.site/gh/SinzMise/MYPictures@master/msedge_CcnQ68DBFQ.2q893j8w72k0.webp" srcset="data:image/gif;base64,R0lGODlhAQABAIAAAP///////yH5BAEKAAEALAAAAAABAAEAAAICTAEAOw==" alt="msedge_CcnQ68DBFQ"></p><ul><li>配置环境变量</li></ul><p>环境变量参考：<a target="_blank" rel="noopener" href="https://kkapi.js.org/reference/kkadmin/environment.html">官网 —— kkadmin环境变量</a></p><p><img src="https://file.acs.pw/picGo/2022/02/27/20220227113526.png" class="lazyload" data-srcset="https://file.acs.pw/picGo/2022/02/27/20220227113526.png" srcset="data:image/gif;base64,R0lGODlhAQABAIAAAP///////yH5BAEKAAEALAAAAAABAAEAAAICTAEAOw==" alt="配置环境变量"></p><ul><li>等待构建完成后即可</li></ul><p><img src="https://file.acs.pw/picGo/2022/02/27/20220227114643.png" class="lazyload" data-srcset="https://file.acs.pw/picGo/2022/02/27/20220227114643.png" srcset="data:image/gif;base64,R0lGODlhAQABAIAAAP///////yH5BAEKAAEALAAAAAABAAEAAAICTAEAOw==" alt="构建中"></p></div><div class="tab-pane" id="部署kkadmin-3"><p>其他环境部署基本可以直接使用 GitHub 构建后的 vercel 进行，毕竟只是 HTML</p></div></div></div><h2 id="前端配置"><a href="#前端配置" class="headerlink" title="前端配置"></a>前端配置</h2><h3 id="进入后台，查看个人ID"><a href="#进入后台，查看个人ID" class="headerlink" title="进入后台，查看个人ID"></a>进入后台，查看个人ID</h3><p><img src="https://file.acs.pw/picGo/2022/02/27/20220227131425.png" class="lazyload" data-srcset="https://file.acs.pw/picGo/2022/02/27/20220227131425.png" srcset="data:image/gif;base64,R0lGODlhAQABAIAAAP///////yH5BAEKAAEALAAAAAABAAEAAAICTAEAOw==" alt="查看个人ID"></p><h3 id="前端引入"><a href="#前端引入" class="headerlink" title="前端引入"></a>前端引入</h3><div class="note info"><p>ipseak 使用 marked 依赖和 highlight 依赖，为了减少打包体积，并没有将该依赖打包，因此需要使用 cdn 进行外部引入。</p></div><div class="tabs" id="tab-前端引入ispeak"><ul class="nav-tabs"><li class="tab"><a class="#前端引入ispeak-1">使用Waline</a></li><li class="tab active"><a class="#前端引入ispeak-2">使用Twikoo</a></li><li class="tab"><a class="#前端引入ispeak-3">使用Discuss</a></li><li class="tab"><a class="#前端引入ispeak-4">使用Artalk</a></li></ul><div class="tab-content"><div class="tab-pane" id="前端引入ispeak-1"><ul><li>在博客目录下运行<code>hexo new page speaks</code></li><li>编辑[blogroot]\source\speaks\index.md，将里面的内容替换成：<figure class="highlight markdown"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br><span class="line">5</span><br><span class="line">6</span><br><span class="line">7</span><br><span class="line">8</span><br><span class="line">9</span><br><span class="line">10</span><br><span class="line">11</span><br><span class="line">12</span><br><span class="line">13</span><br><span class="line">14</span><br><span class="line">15</span><br><span class="line">16</span><br><span class="line">17</span><br><span class="line">18</span><br><span class="line">19</span><br><span class="line">20</span><br><span class="line">21</span><br><span class="line">22</span><br><span class="line">23</span><br><span class="line">24</span><br><span class="line">25</span><br><span class="line">26</span><br><span class="line">27</span><br><span class="line">28</span><br><span class="line">29</span><br><span class="line">30</span><br><span class="line">31</span><br><span class="line">32</span><br><span class="line">33</span><br><span class="line">34</span><br><span class="line">35</span><br><span class="line">36</span><br><span class="line">37</span><br><span class="line">38</span><br><span class="line">39</span><br><span class="line">40</span><br><span class="line">41</span><br><span class="line">42</span><br><span class="line">43</span><br><span class="line">44</span><br><span class="line">45</span><br><span class="line">46</span><br><span class="line">47</span><br><span class="line">48</span><br><span class="line">49</span><br><span class="line">50</span><br><span class="line">51</span><br><span class="line">52</span><br><span class="line">53</span><br><span class="line">54</span><br><span class="line">55</span><br><span class="line">56</span><br><span class="line">57</span><br><span class="line">58</span><br><span class="line">59</span><br><span class="line">60</span><br><span class="line">61</span><br><span class="line">62</span><br><span class="line">63</span><br><span class="line">64</span><br><span class="line">65</span><br><span class="line">66</span><br><span class="line">67</span><br><span class="line">68</span><br><span class="line">69</span><br><span class="line">70</span><br></pre></td><td class="code"><pre><span class="line">---</span><br><span class="line">title: 说说</span><br><span class="line">comments: false</span><br><span class="line"><span class="section">aside: false</span></span><br><span class="line"><span class="section">---</span></span><br><span class="line">&#123;% raw %&#125;</span><br><span class="line"></span><br><span class="line"><span class="language-xml"><span class="tag">&lt;<span class="name">style</span>&gt;</span></span></span><br><span class="line"> .speak-footer,.wl-power&#123;</span><br><span class="line"><span class="code"> display:none;</span></span><br><span class="line"><span class="code"> &#125;</span></span><br><span class="line"><span class="code">&lt;/style&gt;</span></span><br><span class="line"><span class="code">&lt;div id=&quot;ispeak&quot;&gt;&lt;/div&gt;</span></span><br><span class="line"><span class="code">&lt;link</span></span><br><span class="line"><span class="code"> rel=&quot;stylesheet&quot;</span></span><br><span class="line"><span class="code"> href=&quot;https://cdn.staticfile.org/highlight.js/10.6.0/styles/atom-one-dark.min.css&quot;</span></span><br><span class="line"><span class="code">/&gt;</span></span><br><span class="line"><span class="code">&lt;link</span></span><br><span class="line"><span class="code"> rel=&quot;stylesheet&quot;</span></span><br><span class="line"><span class="code"> href=&quot;https://npm.elemecdn.com/ispeak@4.4.0/style.css&quot;</span></span><br><span class="line"><span class="code">/&gt;</span></span><br><span class="line"><span class="code">&lt;script src=&quot;https://cdn.staticfile.org/highlight.js/10.6.0/highlight.min.js&quot;&gt;&lt;/script&gt;</span></span><br><span class="line"><span class="code">&lt;script src=&quot;https://cdn.staticfile.org/marked/2.0.0/marked.min.js&quot;&gt;&lt;/script&gt;</span></span><br><span class="line"><span class="code">&lt;!-- CSS --&gt;</span></span><br><span class="line"><span class="code">&lt;link href=&quot;https://unpkg.com/@waline/client/dist/waline.css&quot; rel=&quot;stylesheet&quot; /&gt;</span></span><br><span class="line"><span class="code">&lt;script src=&quot;https://unpkg.com/@waline/client@v2/dist/waline.js&quot;&gt;&lt;/script&gt;</span></span><br><span class="line"><span class="code">&lt;script&gt;</span></span><br><span class="line"><span class="code"> function load_ispeak() &#123;</span></span><br><span class="line"><span class="code"> setTimeout(function() &#123;</span></span><br><span class="line"><span class="code"> var HEAD = document.getElementsByTagName(&#x27;head&#x27;)[0] || document.documentElement;</span></span><br><span class="line"><span class="code"> var src = &#x27;https://cdn1.tianli0.top/npm/ispeak/ispeak.umd.js&#x27;</span></span><br><span class="line"><span class="code"> var script = document.createElement(&#x27;script&#x27;)</span></span><br><span class="line"><span class="code"> script.setAttribute(&#x27;type&#x27;,&#x27;text/javascript&#x27;)</span></span><br><span class="line"><span class="code"> script.onload = function() &#123;</span></span><br><span class="line"><span class="code"> pjax_ispeak()</span></span><br><span class="line"><span class="code"> &#125;</span></span><br><span class="line"><span class="code"> script.setAttribute(&#x27;src&#x27;, src)</span></span><br><span class="line"><span class="code"> HEAD.appendChild(script)</span></span><br><span class="line"><span class="code"> &#125;, 1);</span></span><br><span class="line"><span class="code"> &#125;;</span></span><br><span class="line"><span class="code"> function pjax_ispeak() &#123;</span></span><br><span class="line"><span class="code"> if(!document.querySelectorAll(&quot;#ispeak&quot;)[0])return;</span></span><br><span class="line"><span class="code"> ispeak</span></span><br><span class="line"><span class="code"> .init(&#123;</span></span><br><span class="line"><span class="code"> el: &#x27;#ispeak&#x27;,//不用改</span></span><br><span class="line"><span class="code"> api: &#x27;&#x27;, //填写你kkapi地址（不是kkadmin后台地址！）</span></span><br><span class="line"><span class="code"> author: &#x27;&#x27;,//填写个人ID</span></span><br><span class="line"><span class="code"> pageSize: 10,//每页speak显示的条数（建议保持默认，除非你要魔改css）</span></span><br><span class="line"><span class="code"> loading_img: &#x27;https://bu.dusays.com/2021/03/04/d2d5e983e2961.gif&#x27;,//加载动画</span></span><br><span class="line"><span class="code"> comment: function (speak) &#123;</span></span><br><span class="line"><span class="code"> const &#123; _id, title, content &#125; = speak</span></span><br><span class="line"><span class="code"> const contentSub = content.substring(0, 30)</span></span><br><span class="line"><span class="code"> Waline.init(&#123;</span></span><br><span class="line"><span class="code"> el: &#x27;.ispeak-comment&#x27;,//不用改</span></span><br><span class="line"><span class="code"> serverURL: &#x27;&#x27;,//填写你的Waline服务端地址</span></span><br><span class="line"><span class="code"> path:&#x27;/speak/info.html?q=&#x27; + _id,//不用改，除非你将上面的speak改为别的文件夹昵称</span></span><br><span class="line"><span class="code"> //后面可按照https://waline.js.org/reference/client/props.html 修改（必须放在path后面！以下为一个例子）</span></span><br><span class="line"><span class="code"> emoji: [&quot;//unpkg.com/@waline/emojis@1.0.1/weibo&quot;,&quot;https://emoji.shojo.cn/bili/src/小黄脸&quot;,&quot;//unpkg.com/@waline/emojis@1.0.1/bilibili&quot;,&quot;https://emoji.shojo.cn/bili/src/枕边童话&quot;,&quot;https://emoji.shojo.cn/bili/src/咩栗&quot;,&quot;https://emoji.shojo.cn/bili/src/呜米&quot;,&quot;https://emoji.shojo.cn/bili/src/进击的冰糖&quot;,&quot;https://emoji.shojo.cn/bili/src/冰糖IO 蜕变·闪耀&quot;,&quot;https://emoji.shojo.cn/bili/src/多多poi&quot;,&quot;https://emoji.shojo.cn/bili/src/穆小泠&quot;,&quot;https://emoji.shojo.cn/bili/src/早稻叽&quot;],// 表情包大全</span></span><br><span class="line"><span class="code"> &#125;);</span></span><br><span class="line"><span class="code"> &#125;</span></span><br><span class="line"><span class="code"> &#125;);</span></span><br><span class="line"><span class="code"> &#125;</span></span><br><span class="line"><span class="code"> load_ispeak();</span></span><br><span class="line"><span class="code"> document.addEventListener(&#x27;pjax:complete&#x27;, function () &#123;</span></span><br><span class="line"><span class="code"> pjax_ispeak();</span></span><br><span class="line"><span class="code"> &#125;);</span></span><br><span class="line"><span class="code">&lt;/script&gt;</span></span><br><span class="line"><span class="code">&lt;!--建议标注末尾链接--&gt;</span></span><br><span class="line"><span class="code">&lt;p style=&quot;width: 100%;text-align: end;font-size: .75em;color: #999;margin-top: 1em;&quot;&gt;Powered by &lt;a href=&quot;https://www.antmoe.com/speak/&quot;&gt;&lt;strong&gt;iSpeak&lt;/strong&gt;&lt;/a&gt; | Comment by &lt;a href=&quot;https://discuss.js.org/&quot;&gt;&lt;strong&gt;Waline&lt;/strong&gt;&lt;/a&gt;&lt;/p&gt; </span></span><br><span class="line"><span class="code">&#123;% endraw %&#125;</span></span><br></pre></td></tr></table></figure></li><li>在[blogroot]\source\speaks\下新建info.md，内容为下：<figure class="highlight markdown"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br><span class="line">5</span><br><span class="line">6</span><br><span class="line">7</span><br><span class="line">8</span><br><span class="line">9</span><br><span class="line">10</span><br><span class="line">11</span><br><span class="line">12</span><br><span class="line">13</span><br><span class="line">14</span><br><span class="line">15</span><br><span class="line">16</span><br><span class="line">17</span><br><span class="line">18</span><br><span class="line">19</span><br><span class="line">20</span><br><span class="line">21</span><br><span class="line">22</span><br><span class="line">23</span><br><span class="line">24</span><br><span class="line">25</span><br><span class="line">26</span><br><span class="line">27</span><br><span class="line">28</span><br><span class="line">29</span><br><span class="line">30</span><br><span class="line">31</span><br><span class="line">32</span><br><span class="line">33</span><br><span class="line">34</span><br><span class="line">35</span><br><span class="line">36</span><br><span class="line">37</span><br><span class="line">38</span><br><span class="line">39</span><br><span class="line">40</span><br><span class="line">41</span><br><span class="line">42</span><br><span class="line">43</span><br><span class="line">44</span><br><span class="line">45</span><br><span class="line">46</span><br><span class="line">47</span><br><span class="line">48</span><br><span class="line">49</span><br><span class="line">50</span><br><span class="line">51</span><br><span class="line">52</span><br><span class="line">53</span><br><span class="line">54</span><br><span class="line">55</span><br><span class="line">56</span><br><span class="line">57</span><br><span class="line">58</span><br><span class="line">59</span><br><span class="line">60</span><br><span class="line">61</span><br><span class="line">62</span><br><span class="line">63</span><br><span class="line">64</span><br><span class="line">65</span><br><span class="line">66</span><br><span class="line">67</span><br><span class="line">68</span><br><span class="line">69</span><br><span class="line">70</span><br><span class="line">71</span><br><span class="line">72</span><br><span class="line">73</span><br><span class="line">74</span><br></pre></td><td class="code"><pre><span class="line">---</span><br><span class="line">title: Speak</span><br><span class="line">aside: false</span><br><span class="line">comments: false</span><br><span class="line"><span class="section">description: 欢迎来到SinzMise的日记，快来看看SinzMise分享了什么！ # speak介绍</span></span><br><span class="line"><span class="section">---</span></span><br><span class="line">&lt;!-- CSS --&gt;</span><br><span class="line"><span class="language-xml"><span class="tag">&lt;<span class="name">link</span> <span class="attr">rel</span>=<span class="string">&quot;stylesheet&quot;</span> <span class="attr">href</span>=<span class="string">&quot;https://cdn.staticfile.org/highlight.js/10.6.0/styles/atom-one-dark.min.css&quot;</span> /&gt;</span></span></span><br><span class="line"><span class="language-xml"><span class="tag">&lt;<span class="name">link</span> <span class="attr">href</span>=<span class="string">&quot;https://unpkg.com/@waline/client/dist/waline.css&quot;</span> <span class="attr">rel</span>=<span class="string">&quot;stylesheet&quot;</span> /&gt;</span></span></span><br><span class="line"><span class="language-xml"><span class="tag">&lt;<span class="name">div</span> <span class="attr">class</span>=<span class="string">&#x27;content&#x27;</span>&gt;</span></span></span><br><span class="line"> <span class="language-xml"><span class="tag">&lt;<span class="name">img</span> <span class="attr">src</span>=<span class="string">&#x27;https://bu.dusays.com/2022/05/01/626e88f349943.gif&#x27;</span>&gt;</span></span></span><br><span class="line"><span class="language-xml"><span class="tag">&lt;/<span class="name">div</span>&gt;</span></span></span><br><span class="line">&#123;% btn &#x27;/speaks/&#x27;,查看全部,far fa-hand-point-right,block center blue larger %&#125;</span><br><span class="line"><span class="language-xml"><span class="tag">&lt;<span class="name">hr</span> /&gt;</span></span></span><br><span class="line"><span class="language-xml"><span class="tag">&lt;<span class="name">div</span> <span class="attr">class</span>=<span class="string">&#x27;ispeak-comment&#x27;</span>&gt;</span></span><span class="language-xml"><span class="tag">&lt;/<span class="name">div</span>&gt;</span></span></span><br><span class="line">&lt;!-- JS --&gt;</span><br><span class="line"><span class="language-xml"><span class="tag">&lt;<span class="name">script</span> <span class="attr">src</span>=<span class="string">&quot;https://unpkg.com/@waline/client@v2/dist/waline.js&quot;</span>&gt;</span></span><span class="language-xml"><span class="tag">&lt;/<span class="name">script</span>&gt;</span></span></span><br><span class="line"><span class="language-xml"><span class="tag">&lt;<span class="name">script</span> <span class="attr">src</span>=<span class="string">&quot;https://unpkg.com/marked@4.0.18/marked.min.js&quot;</span>&gt;</span></span><span class="language-xml"><span class="tag">&lt;/<span class="name">script</span>&gt;</span></span></span><br><span class="line"><span class="language-xml"><span class="tag">&lt;<span class="name">script</span> <span class="attr">src</span>=<span class="string">&quot;https://cdn.staticfile.org/highlight.js/10.6.0/highlight.min.js&quot;</span>&gt;</span></span><span class="language-xml"><span class="tag">&lt;/<span class="name">script</span>&gt;</span></span></span><br><span class="line"><span class="language-xml"><span class="tag">&lt;<span class="name">script</span>&gt;</span></span></span><br><span class="line"> const searchParams = new URLSearchParams(window.location.search);</span><br><span class="line"> const speakId = searchParams.get(&#x27;q&#x27;);</span><br><span class="line"> const path = window.location.pathname;</span><br><span class="line"> const apiURL = &#x27;https://（你的api地址）/api/ispeak&#x27;;</span><br><span class="line"> const markedRender = (body, loading<span class="emphasis">_img=&#x27;https://bu.dusays.com/2022/05/01/626e88f349943.gif&#x27;) =&gt; &#123;</span></span><br><span class="line"><span class="emphasis"> const renderer = &#123;</span></span><br><span class="line"><span class="emphasis"> image(href, title, text) &#123;</span></span><br><span class="line"><span class="emphasis"> return `<span class="language-xml"><span class="language-javascript">&lt;a href=<span class="string">&quot;$&#123;href&#125;&quot;</span> target=<span class="string">&quot;_blank&quot;</span> data-fancybox=<span class="string">&quot;group&quot;</span> <span class="keyword">class</span>=<span class="string">&quot;fancybox&quot;</span>&gt;</span></span></span></span><br><span class="line"><span class="emphasis"> <span class="language-xml"><span class="language-handlebars"><span class="language-xml"><span class="tag">&lt;<span class="name">img</span> <span class="attr">speak-src</span>=<span class="string">&quot;$&#123;href&#125;&quot;</span> <span class="attr">src</span>=<span class="string">$&#123;loading_img&#125;</span> <span class="attr">alt</span>=<span class="string">&#x27;$&#123;text&#125;&#x27;</span>&gt;</span></span></span></span></span></span><br><span class="line"><span class="emphasis"> <span class="language-xml"><span class="language-handlebars"><span class="language-xml"><span class="tag">&lt;/<span class="name">a</span>&gt;</span></span></span></span>`</span></span><br><span class="line"><span class="emphasis"> &#125;</span></span><br><span class="line"><span class="emphasis"> &#125;</span></span><br><span class="line"><span class="emphasis"> marked.setOptions(&#123;</span></span><br><span class="line"><span class="emphasis"> renderer: new marked.Renderer(),</span></span><br><span class="line"><span class="emphasis"> highlight: function (code) &#123;</span></span><br><span class="line"><span class="emphasis"> if (hljs) &#123;</span></span><br><span class="line"><span class="emphasis"> return hljs.highlightAuto(code).value</span></span><br><span class="line"><span class="emphasis"> &#125; else &#123;</span></span><br><span class="line"><span class="emphasis"> return code</span></span><br><span class="line"><span class="emphasis"> &#125;</span></span><br><span class="line"><span class="emphasis"> &#125;,</span></span><br><span class="line"><span class="emphasis"> pedantic: false,</span></span><br><span class="line"><span class="emphasis"> gfm: true,</span></span><br><span class="line"><span class="emphasis"> tables: true,</span></span><br><span class="line"><span class="emphasis"> breaks: true,</span></span><br><span class="line"><span class="emphasis"> sanitize: false,</span></span><br><span class="line"><span class="emphasis"> smartLists: true,</span></span><br><span class="line"><span class="emphasis"> smartypants: false,</span></span><br><span class="line"><span class="emphasis"> xhtml: false</span></span><br><span class="line"><span class="emphasis"> &#125;)</span></span><br><span class="line"><span class="emphasis"> marked.use(&#123; renderer &#125;)</span></span><br><span class="line"><span class="emphasis"> return marked.parse(body)</span></span><br><span class="line"><span class="emphasis"> &#125;</span></span><br><span class="line"><span class="emphasis"> fetch(`$&#123;apiURL&#125;/get/$&#123;speakId&#125;`)</span></span><br><span class="line"><span class="emphasis"> .then(response =&gt; response.json())</span></span><br><span class="line"><span class="emphasis"> .then(res =&gt; &#123;</span></span><br><span class="line"><span class="emphasis"> const data = res.data;</span></span><br><span class="line"><span class="emphasis"> if(data)&#123;</span></span><br><span class="line"><span class="emphasis"> const &#123;title,content&#125; = data;</span></span><br><span class="line"><span class="emphasis"> const contentSub = content.substring(0, 30);</span></span><br><span class="line"><span class="emphasis"> document.querySelector(&#x27;.content&#x27;).innerHTML = markedRender(content);</span></span><br><span class="line"><span class="emphasis"> if(title)&#123;</span></span><br><span class="line"><span class="emphasis"> document.title = title;</span></span><br><span class="line"><span class="emphasis"> &#125;</span></span><br><span class="line"><span class="emphasis"> Waline.init(&#123;</span></span><br><span class="line"><span class="emphasis"> el: &#x27;.ispeak-comment&#x27;,//不用改</span></span><br><span class="line"><span class="emphasis"> serverURL: &#x27;&#x27;,//填写你的Waline服务端地址</span></span><br><span class="line"><span class="emphasis"> path: path + &#x27;?q=&#x27; + _</span>id,//不用改</span><br><span class="line"><span class="code"> //后面可按照https://waline.js.org/reference/client/props.html 修改（必须放在path后面！以下为一个例子）</span></span><br><span class="line"><span class="code"> emoji: [&quot;//unpkg.com/@waline/emojis@1.0.1/weibo&quot;,&quot;https://emoji.shojo.cn/bili/src/小黄脸&quot;,&quot;//unpkg.com/@waline/emojis@1.0.1/bilibili&quot;,&quot;https://emoji.shojo.cn/bili/src/枕边童话&quot;,&quot;https://emoji.shojo.cn/bili/src/咩栗&quot;,&quot;https://emoji.shojo.cn/bili/src/呜米&quot;,&quot;https://emoji.shojo.cn/bili/src/进击的冰糖&quot;,&quot;https://emoji.shojo.cn/bili/src/冰糖IO 蜕变·闪耀&quot;,&quot;https://emoji.shojo.cn/bili/src/多多poi&quot;,&quot;https://emoji.shojo.cn/bili/src/穆小泠&quot;,&quot;https://emoji.shojo.cn/bili/src/早稻叽&quot;],// 表情包大全</span></span><br><span class="line"><span class="code"> &#125;);</span></span><br><span class="line"><span class="code"> &#125;</span></span><br><span class="line"><span class="code"> &#125;);</span></span><br><span class="line"><span class="code">&lt;/script&gt;</span></span><br></pre></td></tr></table></figure></li></ul></div><div class="tab-pane active" id="前端引入ispeak-2"><ul><li>在博客目录下运行<code>hexo new page speaks</code></li><li>编辑[blogroot]\source\speaks\index.md，将里面的内容替换成：<figure class="highlight markdown"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br><span class="line">5</span><br><span class="line">6</span><br><span class="line">7</span><br><span class="line">8</span><br><span class="line">9</span><br><span class="line">10</span><br><span class="line">11</span><br><span class="line">12</span><br><span class="line">13</span><br><span class="line">14</span><br><span class="line">15</span><br><span class="line">16</span><br><span class="line">17</span><br><span class="line">18</span><br><span class="line">19</span><br><span class="line">20</span><br><span class="line">21</span><br><span class="line">22</span><br><span class="line">23</span><br><span class="line">24</span><br><span class="line">25</span><br><span class="line">26</span><br><span class="line">27</span><br><span class="line">28</span><br><span class="line">29</span><br><span class="line">30</span><br><span class="line">31</span><br><span class="line">32</span><br><span class="line">33</span><br><span class="line">34</span><br><span class="line">35</span><br><span class="line">36</span><br><span class="line">37</span><br><span class="line">38</span><br><span class="line">39</span><br><span class="line">40</span><br><span class="line">41</span><br><span class="line">42</span><br><span class="line">43</span><br><span class="line">44</span><br><span class="line">45</span><br><span class="line">46</span><br><span class="line">47</span><br><span class="line">48</span><br><span class="line">49</span><br><span class="line">50</span><br><span class="line">51</span><br><span class="line">52</span><br><span class="line">53</span><br><span class="line">54</span><br><span class="line">55</span><br><span class="line">56</span><br><span class="line">57</span><br><span class="line">58</span><br><span class="line">59</span><br><span class="line">60</span><br><span class="line">61</span><br><span class="line">62</span><br><span class="line">63</span><br><span class="line">64</span><br><span class="line">65</span><br><span class="line">66</span><br><span class="line">67</span><br><span class="line">68</span><br><span class="line">69</span><br></pre></td><td class="code"><pre><span class="line">---</span><br><span class="line">title: 说说</span><br><span class="line">comments: false</span><br><span class="line"><span class="section">aside: false</span></span><br><span class="line"><span class="section">---</span></span><br><span class="line">&#123;% raw %&#125;</span><br><span class="line"></span><br><span class="line"><span class="language-xml"><span class="tag">&lt;<span class="name">style</span>&gt;</span></span></span><br><span class="line"> .speak-footer,.tk-footer&#123;</span><br><span class="line"><span class="code"> display:none;</span></span><br><span class="line"><span class="code"> &#125;</span></span><br><span class="line"><span class="code">&lt;/style&gt;</span></span><br><span class="line"><span class="code">&lt;div id=&quot;ispeak&quot;&gt;&lt;/div&gt;</span></span><br><span class="line"><span class="code">&lt;link</span></span><br><span class="line"><span class="code"> rel=&quot;stylesheet&quot;</span></span><br><span class="line"><span class="code"> href=&quot;https://cdn.staticfile.org/highlight.js/10.6.0/styles/atom-one-dark.min.css&quot;</span></span><br><span class="line"><span class="code">/&gt;</span></span><br><span class="line"><span class="code">&lt;link</span></span><br><span class="line"><span class="code"> rel=&quot;stylesheet&quot;</span></span><br><span class="line"><span class="code"> href=&quot;https://npm.elemecdn.com/ispeak@4.4.0/style.css&quot;</span></span><br><span class="line"><span class="code">/&gt;</span></span><br><span class="line"><span class="code">&lt;script src=&quot;https://cdn.staticfile.org/highlight.js/10.6.0/highlight.min.js&quot;&gt;&lt;/script&gt;</span></span><br><span class="line"><span class="code">&lt;script src=&quot;https://cdn.staticfile.org/marked/2.0.0/marked.min.js&quot;&gt;&lt;/script&gt;</span></span><br><span class="line"><span class="code">&lt;script src=&quot;https://npm.elemecdn.com/ispeak@4.4.0/ispeak.umd.js&quot;&gt;&lt;/script&gt;</span></span><br><span class="line"><span class="code">&lt;script src=&quot;https://npm.elemecdn.com/twikoo&quot;&gt;&lt;/script&gt;</span></span><br><span class="line"><span class="code">&lt;script&gt;</span></span><br><span class="line"><span class="code"> function load_ispeak() &#123;</span></span><br><span class="line"><span class="code"> setTimeout(function() &#123;</span></span><br><span class="line"><span class="code"> var HEAD = document.getElementsByTagName(&#x27;head&#x27;)[0] || document.documentElement;</span></span><br><span class="line"><span class="code"> var src = &#x27;https://cdn1.tianli0.top/npm/ispeak/ispeak.umd.js&#x27;</span></span><br><span class="line"><span class="code"> var script = document.createElement(&#x27;script&#x27;)</span></span><br><span class="line"><span class="code"> script.setAttribute(&#x27;type&#x27;,&#x27;text/javascript&#x27;)</span></span><br><span class="line"><span class="code"> script.onload = function() &#123;</span></span><br><span class="line"><span class="code"> pjax_ispeak()</span></span><br><span class="line"><span class="code"> &#125;</span></span><br><span class="line"><span class="code"> script.setAttribute(&#x27;src&#x27;, src)</span></span><br><span class="line"><span class="code"> HEAD.appendChild(script)</span></span><br><span class="line"><span class="code"> &#125;, 1);</span></span><br><span class="line"><span class="code"> &#125;;</span></span><br><span class="line"><span class="code"> function pjax_ispeak() &#123;</span></span><br><span class="line"><span class="code"> if(!document.querySelectorAll(&quot;#ispeak&quot;)[0])return;</span></span><br><span class="line"><span class="code"> ispeak</span></span><br><span class="line"><span class="code"> .init(&#123;</span></span><br><span class="line"><span class="code"> el: &#x27;#ispeak&#x27;,//不用改</span></span><br><span class="line"><span class="code"> api: &#x27;&#x27;, //填写你kkapi地址（不是kkadmin后台地址！）</span></span><br><span class="line"><span class="code"> author: &#x27;&#x27;,//填写个人ID</span></span><br><span class="line"><span class="code"> pageSize: 10,//每页speak显示的条数（建议保持默认，除非你要魔改css）</span></span><br><span class="line"><span class="code"> loading_img: &#x27;https://bu.dusays.com/2021/03/04/d2d5e983e2961.gif&#x27;,//加载动画</span></span><br><span class="line"><span class="code"> comment: function (speak) &#123;</span></span><br><span class="line"><span class="code"> const &#123; _id, title, content &#125; = speak</span></span><br><span class="line"><span class="code"> const contentSub = content.substring(0, 30)</span></span><br><span class="line"><span class="code"> twikoo.init(&#123;</span></span><br><span class="line"><span class="code"> envId: &#x27;&#x27;, // 腾讯云环境填 envId；Vercel 环境填地址（https://xxx.vercel.app）</span></span><br><span class="line"><span class="code"> el: &#x27;.ispeak-comment&#x27;, // 不用改</span></span><br><span class="line"><span class="code"> //region: &#x27;ap-guangzhou&#x27;, // 环境地域，默认为 ap-shanghai，腾讯云环境填 ap-shanghai 或 ap-guangzhou；Vercel 环境不填</span></span><br><span class="line"><span class="code"> path: &#x27;/speak/info.html?q=&#x27; + _id, //不用改，除非你将上面的speak改为别的文件夹昵称</span></span><br><span class="line"><span class="code"> lang: &#x27;zh-CN&#x27;, // 用于手动设定评论区语言，支持的语言列表 https://github.com/imaegoo/twikoo/blob/main/src/client/utils/i18n/index.js</span></span><br><span class="line"><span class="code"> &#125;)</span></span><br><span class="line"><span class="code"> &#125;</span></span><br><span class="line"><span class="code"> &#125;);</span></span><br><span class="line"><span class="code"> &#125;</span></span><br><span class="line"><span class="code"> load_ispeak();</span></span><br><span class="line"><span class="code"> document.addEventListener(&#x27;pjax:complete&#x27;, function () &#123;</span></span><br><span class="line"><span class="code"> pjax_ispeak();</span></span><br><span class="line"><span class="code"> &#125;);</span></span><br><span class="line"><span class="code">&lt;/script&gt;</span></span><br><span class="line"><span class="code">&lt;!--建议标注末尾链接--&gt;</span></span><br><span class="line"><span class="code">&lt;p style=&quot;width: 100%;text-align: end;font-size: .75em;color: #999;margin-top: 1em;&quot;&gt;Powered by &lt;a href=&quot;https://www.antmoe.com/speak/&quot;&gt;&lt;strong&gt;iSpeak&lt;/strong&gt;&lt;/a&gt; | Comment by &lt;a href=&quot;https://twikoo.js.org/&quot;&gt;&lt;strong&gt;Twikoo&lt;/strong&gt;&lt;/a&gt;&lt;/p&gt; </span></span><br><span class="line"><span class="code">&#123;% endraw %&#125;</span></span><br></pre></td></tr></table></figure></li><li>在[blogroot]\source\speaks\下新建info.md，内容为下：<figure class="highlight markdown"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br><span class="line">5</span><br><span class="line">6</span><br><span class="line">7</span><br><span class="line">8</span><br><span class="line">9</span><br><span class="line">10</span><br><span class="line">11</span><br><span class="line">12</span><br><span class="line">13</span><br><span class="line">14</span><br><span class="line">15</span><br><span class="line">16</span><br><span class="line">17</span><br><span class="line">18</span><br><span class="line">19</span><br><span class="line">20</span><br><span class="line">21</span><br><span class="line">22</span><br><span class="line">23</span><br><span class="line">24</span><br><span class="line">25</span><br><span class="line">26</span><br><span class="line">27</span><br><span class="line">28</span><br><span class="line">29</span><br><span class="line">30</span><br><span class="line">31</span><br><span class="line">32</span><br><span class="line">33</span><br><span class="line">34</span><br><span class="line">35</span><br><span class="line">36</span><br><span class="line">37</span><br><span class="line">38</span><br><span class="line">39</span><br><span class="line">40</span><br><span class="line">41</span><br><span class="line">42</span><br><span class="line">43</span><br><span class="line">44</span><br><span class="line">45</span><br><span class="line">46</span><br><span class="line">47</span><br><span class="line">48</span><br><span class="line">49</span><br><span class="line">50</span><br><span class="line">51</span><br><span class="line">52</span><br><span class="line">53</span><br><span class="line">54</span><br><span class="line">55</span><br><span class="line">56</span><br><span class="line">57</span><br><span class="line">58</span><br><span class="line">59</span><br><span class="line">60</span><br><span class="line">61</span><br><span class="line">62</span><br><span class="line">63</span><br><span class="line">64</span><br><span class="line">65</span><br><span class="line">66</span><br><span class="line">67</span><br><span class="line">68</span><br><span class="line">69</span><br><span class="line">70</span><br><span class="line">71</span><br><span class="line">72</span><br><span class="line">73</span><br></pre></td><td class="code"><pre><span class="line">---</span><br><span class="line">title: Speak</span><br><span class="line">aside: false</span><br><span class="line">comments: false</span><br><span class="line"><span class="section">description: 欢迎来到SinzMise的日记，快来看看SinzMise分享了什么！ # speak介绍</span></span><br><span class="line"><span class="section">---</span></span><br><span class="line">&lt;!-- CSS --&gt;</span><br><span class="line"><span class="language-xml"><span class="tag">&lt;<span class="name">link</span> <span class="attr">rel</span>=<span class="string">&quot;stylesheet&quot;</span> <span class="attr">href</span>=<span class="string">&quot;https://cdn.staticfile.org/highlight.js/10.6.0/styles/atom-one-dark.min.css&quot;</span> /&gt;</span></span></span><br><span class="line"><span class="language-xml"><span class="tag">&lt;<span class="name">div</span> <span class="attr">class</span>=<span class="string">&#x27;content&#x27;</span>&gt;</span></span></span><br><span class="line"> <span class="language-xml"><span class="tag">&lt;<span class="name">img</span> <span class="attr">src</span>=<span class="string">&#x27;https://bu.dusays.com/2022/05/01/626e88f349943.gif&#x27;</span>&gt;</span></span></span><br><span class="line"><span class="language-xml"><span class="tag">&lt;/<span class="name">div</span>&gt;</span></span></span><br><span class="line">&#123;% btn &#x27;/speaks/&#x27;,查看全部,far fa-hand-point-right,block center blue larger %&#125;</span><br><span class="line"><span class="language-xml"><span class="tag">&lt;<span class="name">hr</span> /&gt;</span></span></span><br><span class="line"><span class="language-xml"><span class="tag">&lt;<span class="name">div</span> <span class="attr">class</span>=<span class="string">&#x27;ispeak-comment&#x27;</span>&gt;</span></span><span class="language-xml"><span class="tag">&lt;/<span class="name">div</span>&gt;</span></span></span><br><span class="line">&lt;!-- JS --&gt;</span><br><span class="line"><span class="language-xml"><span class="tag">&lt;<span class="name">script</span> <span class="attr">src</span>=<span class="string">&quot;https://npm.elemecdn.com/twikoo&quot;</span>&gt;</span></span><span class="language-xml"><span class="tag">&lt;/<span class="name">script</span>&gt;</span></span></span><br><span class="line"><span class="language-xml"><span class="tag">&lt;<span class="name">script</span> <span class="attr">src</span>=<span class="string">&quot;https://unpkg.com/marked@4.0.18/marked.min.js&quot;</span>&gt;</span></span><span class="language-xml"><span class="tag">&lt;/<span class="name">script</span>&gt;</span></span></span><br><span class="line"><span class="language-xml"><span class="tag">&lt;<span class="name">script</span> <span class="attr">src</span>=<span class="string">&quot;https://cdn.staticfile.org/highlight.js/10.6.0/highlight.min.js&quot;</span>&gt;</span></span><span class="language-xml"><span class="tag">&lt;/<span class="name">script</span>&gt;</span></span></span><br><span class="line"><span class="language-xml"><span class="tag">&lt;<span class="name">script</span>&gt;</span></span></span><br><span class="line"> const searchParams = new URLSearchParams(window.location.search);</span><br><span class="line"> const speakId = searchParams.get(&#x27;q&#x27;);</span><br><span class="line"> const path = window.location.pathname;</span><br><span class="line"> const apiURL = &#x27;https://（你的api地址）/api/ispeak&#x27;;</span><br><span class="line"> const markedRender = (body, loading<span class="emphasis">_img=&#x27;https://bu.dusays.com/2022/05/01/626e88f349943.gif&#x27;) =&gt; &#123;</span></span><br><span class="line"><span class="emphasis"> const renderer = &#123;</span></span><br><span class="line"><span class="emphasis"> image(href, title, text) &#123;</span></span><br><span class="line"><span class="emphasis"> return `<span class="language-xml"><span class="language-javascript">&lt;a href=<span class="string">&quot;$&#123;href&#125;&quot;</span> target=<span class="string">&quot;_blank&quot;</span> data-fancybox=<span class="string">&quot;group&quot;</span> <span class="keyword">class</span>=<span class="string">&quot;fancybox&quot;</span>&gt;</span></span></span></span><br><span class="line"><span class="emphasis"> <span class="language-xml"><span class="language-handlebars"><span class="language-xml"><span class="tag">&lt;<span class="name">img</span> <span class="attr">speak-src</span>=<span class="string">&quot;$&#123;href&#125;&quot;</span> <span class="attr">src</span>=<span class="string">$&#123;loading_img&#125;</span> <span class="attr">alt</span>=<span class="string">&#x27;$&#123;text&#125;&#x27;</span>&gt;</span></span></span></span></span></span><br><span class="line"><span class="emphasis"> <span class="language-xml"><span class="language-handlebars"><span class="language-xml"><span class="tag">&lt;/<span class="name">a</span>&gt;</span></span></span></span>`</span></span><br><span class="line"><span class="emphasis"> &#125;</span></span><br><span class="line"><span class="emphasis"> &#125;</span></span><br><span class="line"><span class="emphasis"> marked.setOptions(&#123;</span></span><br><span class="line"><span class="emphasis"> renderer: new marked.Renderer(),</span></span><br><span class="line"><span class="emphasis"> highlight: function (code) &#123;</span></span><br><span class="line"><span class="emphasis"> if (hljs) &#123;</span></span><br><span class="line"><span class="emphasis"> return hljs.highlightAuto(code).value</span></span><br><span class="line"><span class="emphasis"> &#125; else &#123;</span></span><br><span class="line"><span class="emphasis"> return code</span></span><br><span class="line"><span class="emphasis"> &#125;</span></span><br><span class="line"><span class="emphasis"> &#125;,</span></span><br><span class="line"><span class="emphasis"> pedantic: false,</span></span><br><span class="line"><span class="emphasis"> gfm: true,</span></span><br><span class="line"><span class="emphasis"> tables: true,</span></span><br><span class="line"><span class="emphasis"> breaks: true,</span></span><br><span class="line"><span class="emphasis"> sanitize: false,</span></span><br><span class="line"><span class="emphasis"> smartLists: true,</span></span><br><span class="line"><span class="emphasis"> smartypants: false,</span></span><br><span class="line"><span class="emphasis"> xhtml: false</span></span><br><span class="line"><span class="emphasis"> &#125;)</span></span><br><span class="line"><span class="emphasis"> marked.use(&#123; renderer &#125;)</span></span><br><span class="line"><span class="emphasis"> return marked.parse(body)</span></span><br><span class="line"><span class="emphasis"> &#125;</span></span><br><span class="line"><span class="emphasis"> fetch(`$&#123;apiURL&#125;/get/$&#123;speakId&#125;`)</span></span><br><span class="line"><span class="emphasis"> .then(response =&gt; response.json())</span></span><br><span class="line"><span class="emphasis"> .then(res =&gt; &#123;</span></span><br><span class="line"><span class="emphasis"> const data = res.data;</span></span><br><span class="line"><span class="emphasis"> if(data)&#123;</span></span><br><span class="line"><span class="emphasis"> const &#123;title,content&#125; = data;</span></span><br><span class="line"><span class="emphasis"> const contentSub = content.substring(0, 30);</span></span><br><span class="line"><span class="emphasis"> document.querySelector(&#x27;.content&#x27;).innerHTML = markedRender(content);</span></span><br><span class="line"><span class="emphasis"> if(title)&#123;</span></span><br><span class="line"><span class="emphasis"> document.title = title;</span></span><br><span class="line"><span class="emphasis"> &#125;</span></span><br><span class="line"><span class="emphasis"> twikoo.init(&#123;</span></span><br><span class="line"><span class="emphasis"> envId: &#x27;&#x27;, // 腾讯云环境填 envId；Vercel 环境填地址（https://xxx.vercel.app）</span></span><br><span class="line"><span class="emphasis"> el: &#x27;.ispeak-comment&#x27;, // 不用改</span></span><br><span class="line"><span class="emphasis"> //region: &#x27;ap-guangzhou&#x27;, // 环境地域，默认为 ap-shanghai，腾讯云环境填 ap-shanghai 或 ap-guangzhou；Vercel 环境不填</span></span><br><span class="line"><span class="emphasis"> path: path + &#x27;?q=&#x27; + speakId, // 不用改</span></span><br><span class="line"><span class="emphasis"> lang: &#x27;zh-CN&#x27;, // 用于手动设定评论区语言，支持的语言列表 https://github.com/imaegoo/twikoo/blob/main/src/client/utils/i18n/index.js</span></span><br><span class="line"><span class="emphasis"> &#125;)</span></span><br><span class="line"><span class="emphasis"> &#125;</span></span><br><span class="line"><span class="emphasis"> &#125;);</span></span><br><span class="line"><span class="emphasis"><span class="language-xml"><span class="tag">&lt;/<span class="name">script</span>&gt;</span></span></span></span><br></pre></td></tr></table></figure></li></ul></div><div class="tab-pane" id="前端引入ispeak-3"><ul><li>在博客目录下运行<code>hexo new page speaks</code></li><li>编辑[blogroot]\source\speaks\index.md，将里面的内容替换成：<figure class="highlight markdown"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br><span class="line">5</span><br><span class="line">6</span><br><span class="line">7</span><br><span class="line">8</span><br><span class="line">9</span><br><span class="line">10</span><br><span class="line">11</span><br><span class="line">12</span><br><span class="line">13</span><br><span class="line">14</span><br><span class="line">15</span><br><span class="line">16</span><br><span class="line">17</span><br><span class="line">18</span><br><span class="line">19</span><br><span class="line">20</span><br><span class="line">21</span><br><span class="line">22</span><br><span class="line">23</span><br><span class="line">24</span><br><span class="line">25</span><br><span class="line">26</span><br><span class="line">27</span><br><span class="line">28</span><br><span class="line">29</span><br><span class="line">30</span><br><span class="line">31</span><br><span class="line">32</span><br><span class="line">33</span><br><span class="line">34</span><br><span class="line">35</span><br><span class="line">36</span><br><span class="line">37</span><br><span class="line">38</span><br><span class="line">39</span><br><span class="line">40</span><br><span class="line">41</span><br><span class="line">42</span><br><span class="line">43</span><br><span class="line">44</span><br><span class="line">45</span><br><span class="line">46</span><br><span class="line">47</span><br><span class="line">48</span><br><span class="line">49</span><br><span class="line">50</span><br><span class="line">51</span><br><span class="line">52</span><br><span class="line">53</span><br><span class="line">54</span><br><span class="line">55</span><br><span class="line">56</span><br><span class="line">57</span><br><span class="line">58</span><br><span class="line">59</span><br><span class="line">60</span><br><span class="line">61</span><br><span class="line">62</span><br><span class="line">63</span><br><span class="line">64</span><br><span class="line">65</span><br><span class="line">66</span><br><span class="line">67</span><br><span class="line">68</span><br><span class="line">69</span><br><span class="line">70</span><br></pre></td><td class="code"><pre><span class="line">---</span><br><span class="line">title: 说说</span><br><span class="line">comments: false</span><br><span class="line"><span class="section">aside: false</span></span><br><span class="line"><span class="section">---</span></span><br><span class="line">&#123;% raw %&#125;</span><br><span class="line"></span><br><span class="line"><span class="language-xml"><span class="tag">&lt;<span class="name">style</span>&gt;</span></span></span><br><span class="line"> .speak-footer,.D-footer&#123;</span><br><span class="line"><span class="code"> display:none;</span></span><br><span class="line"><span class="code"> &#125;</span></span><br><span class="line"><span class="code">&lt;/style&gt;</span></span><br><span class="line"><span class="code">&lt;div id=&quot;ispeak&quot;&gt;&lt;/div&gt;</span></span><br><span class="line"><span class="code">&lt;link</span></span><br><span class="line"><span class="code"> rel=&quot;stylesheet&quot;</span></span><br><span class="line"><span class="code"> href=&quot;https://cdn.staticfile.org/highlight.js/10.6.0/styles/atom-one-dark.min.css&quot;</span></span><br><span class="line"><span class="code">/&gt;</span></span><br><span class="line"><span class="code">&lt;link</span></span><br><span class="line"><span class="code"> rel=&quot;stylesheet&quot;</span></span><br><span class="line"><span class="code"> href=&quot;https://npm.elemecdn.com/ispeak@4.4.0/style.css&quot;</span></span><br><span class="line"><span class="code">/&gt;</span></span><br><span class="line"><span class="code">&lt;script src=&quot;https://cdn.staticfile.org/highlight.js/10.6.0/highlight.min.js&quot;&gt;&lt;/script&gt;</span></span><br><span class="line"><span class="code">&lt;script src=&quot;https://cdn.staticfile.org/marked/2.0.0/marked.min.js&quot;&gt;&lt;/script&gt;</span></span><br><span class="line"><span class="code">&lt;script src=&quot;https://npm.elemecdn.com/ispeak@4.4.0/ispeak.umd.js&quot;&gt;&lt;/script&gt;</span></span><br><span class="line"><span class="code">&lt;script src=&quot;https://npm.elemecdn.com/discuss@latest/dist/discuss.js&quot;&gt;&lt;/script&gt;</span></span><br><span class="line"><span class="code">&lt;script&gt;</span></span><br><span class="line"><span class="code"> function load_ispeak() &#123;</span></span><br><span class="line"><span class="code"> setTimeout(function() &#123;</span></span><br><span class="line"><span class="code"> var HEAD = document.getElementsByTagName(&#x27;head&#x27;)[0] || document.documentElement;</span></span><br><span class="line"><span class="code"> var src = &#x27;https://cdn1.tianli0.top/npm/ispeak/ispeak.umd.js&#x27;</span></span><br><span class="line"><span class="code"> var script = document.createElement(&#x27;script&#x27;)</span></span><br><span class="line"><span class="code"> script.setAttribute(&#x27;type&#x27;,&#x27;text/javascript&#x27;)</span></span><br><span class="line"><span class="code"> script.onload = function() &#123;</span></span><br><span class="line"><span class="code"> pjax_ispeak()</span></span><br><span class="line"><span class="code"> &#125;</span></span><br><span class="line"><span class="code"> script.setAttribute(&#x27;src&#x27;, src)</span></span><br><span class="line"><span class="code"> HEAD.appendChild(script)</span></span><br><span class="line"><span class="code"> &#125;, 1);</span></span><br><span class="line"><span class="code"> &#125;;</span></span><br><span class="line"><span class="code"> function pjax_ispeak() &#123;</span></span><br><span class="line"><span class="code"> if(!document.querySelectorAll(&quot;#ispeak&quot;)[0])return;</span></span><br><span class="line"><span class="code"> ispeak</span></span><br><span class="line"><span class="code"> .init(&#123;</span></span><br><span class="line"><span class="code"> el: &#x27;#ispeak&#x27;,//不用改</span></span><br><span class="line"><span class="code"> api: &#x27;&#x27;, //填写你kkapi地址（不是kkadmin后台地址！）</span></span><br><span class="line"><span class="code"> author: &#x27;&#x27;,//填写个人ID</span></span><br><span class="line"><span class="code"> pageSize: 10,//每页speak显示的条数（建议保持默认，除非你要魔改css）</span></span><br><span class="line"><span class="code"> loading_img: &#x27;https://bu.dusays.com/2021/03/04/d2d5e983e2961.gif&#x27;,//加载动画</span></span><br><span class="line"><span class="code"> comment: function (speak) &#123;</span></span><br><span class="line"><span class="code"> const &#123; _id, title, content &#125; = speak</span></span><br><span class="line"><span class="code"> const contentSub = content.substring(0, 30)</span></span><br><span class="line"><span class="code"> discuss.init(&#123;</span></span><br><span class="line"><span class="code"> el: &#x27;.ispeak-comment&#x27;,// 不用改</span></span><br><span class="line"><span class="code"> serverURLs: &#x27;&#x27;,//填写你的Discuss服务端地址</span></span><br><span class="line"><span class="code"> path: &#x27;/speak/info.html?q=&#x27; + _id,//不用改，除非你将上面的speak改为别的文件夹昵称</span></span><br><span class="line"><span class="code"> //后面可按照https://discuss.js.org/Quick-Start.html#%E5%AE%A2%E6%88%B7%E7%AB%AF-client 修改（必须放在path后面！以下为一个例子）</span></span><br><span class="line"><span class="code"> ph: &#x27;千山万水总是情，给个评论行不行&#x27; ,//评论框占位符</span></span><br><span class="line"><span class="code"> imgLoading: &#x27;https://bu.dusays.com/2021/03/04/d2d5e983e2961.gif&#x27;//评论图片加载动画</span></span><br><span class="line"><span class="code"> &#125;)</span></span><br><span class="line"><span class="code"> &#125;</span></span><br><span class="line"><span class="code"> &#125;);</span></span><br><span class="line"><span class="code"> &#125;</span></span><br><span class="line"><span class="code"> load_ispeak();</span></span><br><span class="line"><span class="code"> document.addEventListener(&#x27;pjax:complete&#x27;, function () &#123;</span></span><br><span class="line"><span class="code"> pjax_ispeak();</span></span><br><span class="line"><span class="code"> &#125;);</span></span><br><span class="line"><span class="code">&lt;/script&gt;</span></span><br><span class="line"><span class="code">&lt;!--建议标注末尾链接--&gt;</span></span><br><span class="line"><span class="code">&lt;p style=&quot;width: 100%;text-align: end;font-size: .75em;color: #999;margin-top: 1em;&quot;&gt;Powered by &lt;a href=&quot;https://www.antmoe.com/speak/&quot;&gt;&lt;strong&gt;iSpeak&lt;/strong&gt;&lt;/a&gt; | Comment by &lt;a href=&quot;https://discuss.js.org/&quot;&gt;&lt;strong&gt;Discuss&lt;/strong&gt;&lt;/a&gt;&lt;/p&gt; </span></span><br><span class="line"><span class="code">&#123;% endraw %&#125;</span></span><br></pre></td></tr></table></figure></li><li>在[blogroot]\source\speaks\下新建info.md，内容为下：<figure class="highlight markdown"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br><span class="line">5</span><br><span class="line">6</span><br><span class="line">7</span><br><span class="line">8</span><br><span class="line">9</span><br><span class="line">10</span><br><span class="line">11</span><br><span class="line">12</span><br><span class="line">13</span><br><span class="line">14</span><br><span class="line">15</span><br><span class="line">16</span><br><span class="line">17</span><br><span class="line">18</span><br><span class="line">19</span><br><span class="line">20</span><br><span class="line">21</span><br><span class="line">22</span><br><span class="line">23</span><br><span class="line">24</span><br><span class="line">25</span><br><span class="line">26</span><br><span class="line">27</span><br><span class="line">28</span><br><span class="line">29</span><br><span class="line">30</span><br><span class="line">31</span><br><span class="line">32</span><br><span class="line">33</span><br><span class="line">34</span><br><span class="line">35</span><br><span class="line">36</span><br><span class="line">37</span><br><span class="line">38</span><br><span class="line">39</span><br><span class="line">40</span><br><span class="line">41</span><br><span class="line">42</span><br><span class="line">43</span><br><span class="line">44</span><br><span class="line">45</span><br><span class="line">46</span><br><span class="line">47</span><br><span class="line">48</span><br><span class="line">49</span><br><span class="line">50</span><br><span class="line">51</span><br><span class="line">52</span><br><span class="line">53</span><br><span class="line">54</span><br><span class="line">55</span><br><span class="line">56</span><br><span class="line">57</span><br><span class="line">58</span><br><span class="line">59</span><br><span class="line">60</span><br><span class="line">61</span><br><span class="line">62</span><br><span class="line">63</span><br><span class="line">64</span><br><span class="line">65</span><br><span class="line">66</span><br><span class="line">67</span><br><span class="line">68</span><br><span class="line">69</span><br><span class="line">70</span><br><span class="line">71</span><br><span class="line">72</span><br><span class="line">73</span><br><span class="line">74</span><br></pre></td><td class="code"><pre><span class="line">---</span><br><span class="line">title: Speak</span><br><span class="line">aside: false</span><br><span class="line">comments: false</span><br><span class="line"><span class="section">description: 欢迎来到SinzMise的日记，快来看看SinzMise分享了什么！ # speak介绍</span></span><br><span class="line"><span class="section">---</span></span><br><span class="line">&lt;!-- CSS --&gt;</span><br><span class="line"><span class="language-xml"><span class="tag">&lt;<span class="name">link</span> <span class="attr">rel</span>=<span class="string">&quot;stylesheet&quot;</span> <span class="attr">href</span>=<span class="string">&quot;https://cdn.staticfile.org/highlight.js/10.6.0/styles/atom-one-dark.min.css&quot;</span> /&gt;</span></span></span><br><span class="line"><span class="language-xml"><span class="tag">&lt;<span class="name">div</span> <span class="attr">class</span>=<span class="string">&#x27;content&#x27;</span>&gt;</span></span></span><br><span class="line"> <span class="language-xml"><span class="tag">&lt;<span class="name">img</span> <span class="attr">src</span>=<span class="string">&#x27;https://bu.dusays.com/2022/05/01/626e88f349943.gif&#x27;</span>&gt;</span></span></span><br><span class="line"><span class="language-xml"><span class="tag">&lt;/<span class="name">div</span>&gt;</span></span></span><br><span class="line">&#123;% btn &#x27;/speaks/&#x27;,查看全部,far fa-hand-point-right,block center blue larger %&#125;</span><br><span class="line"><span class="language-xml"><span class="tag">&lt;<span class="name">hr</span> /&gt;</span></span></span><br><span class="line"><span class="language-xml"><span class="tag">&lt;<span class="name">div</span> <span class="attr">class</span>=<span class="string">&#x27;ispeak-comment&#x27;</span>&gt;</span></span><span class="language-xml"><span class="tag">&lt;/<span class="name">div</span>&gt;</span></span></span><br><span class="line">&lt;!-- JS --&gt;</span><br><span class="line"><span class="language-xml"><span class="tag">&lt;<span class="name">script</span> <span class="attr">src</span>=<span class="string">&quot;https://npm.elemecdn.com/discuss@latest/dist/discuss.js&quot;</span>&gt;</span></span><span class="language-xml"><span class="tag">&lt;/<span class="name">script</span>&gt;</span></span></span><br><span class="line"><span class="language-xml"><span class="tag">&lt;<span class="name">script</span> <span class="attr">src</span>=<span class="string">&quot;https://unpkg.com/marked@4.0.18/marked.min.js&quot;</span>&gt;</span></span><span class="language-xml"><span class="tag">&lt;/<span class="name">script</span>&gt;</span></span></span><br><span class="line"><span class="language-xml"><span class="tag">&lt;<span class="name">script</span> <span class="attr">src</span>=<span class="string">&quot;https://cdn.staticfile.org/highlight.js/10.6.0/highlight.min.js&quot;</span>&gt;</span></span><span class="language-xml"><span class="tag">&lt;/<span class="name">script</span>&gt;</span></span></span><br><span class="line"><span class="language-xml"><span class="tag">&lt;<span class="name">script</span>&gt;</span></span></span><br><span class="line"> const searchParams = new URLSearchParams(window.location.search);</span><br><span class="line"> const speakId = searchParams.get(&#x27;q&#x27;);</span><br><span class="line"> const path = window.location.pathname;</span><br><span class="line"> const apiURL = &#x27;https://（你的api地址）/api/ispeak&#x27;; //api地址</span><br><span class="line"> const markedRender = (body, loading<span class="emphasis">_img=&#x27;https://bu.dusays.com/2022/05/01/626e88f349943.gif&#x27;) =&gt; &#123;</span></span><br><span class="line"><span class="emphasis"> const renderer = &#123;</span></span><br><span class="line"><span class="emphasis"> image(href, title, text) &#123;</span></span><br><span class="line"><span class="emphasis"> return `<span class="language-xml"><span class="language-javascript">&lt;a href=<span class="string">&quot;$&#123;href&#125;&quot;</span> target=<span class="string">&quot;_blank&quot;</span> data-fancybox=<span class="string">&quot;group&quot;</span> <span class="keyword">class</span>=<span class="string">&quot;fancybox&quot;</span>&gt;</span></span></span></span><br><span class="line"><span class="emphasis"> <span class="language-xml"><span class="language-handlebars"><span class="language-xml"><span class="tag">&lt;<span class="name">img</span> <span class="attr">speak-src</span>=<span class="string">&quot;$&#123;href&#125;&quot;</span> <span class="attr">src</span>=<span class="string">$&#123;loading_img&#125;</span> <span class="attr">alt</span>=<span class="string">&#x27;$&#123;text&#125;&#x27;</span>&gt;</span></span></span></span></span></span><br><span class="line"><span class="emphasis"> <span class="language-xml"><span class="language-handlebars"><span class="language-xml"><span class="tag">&lt;/<span class="name">a</span>&gt;</span></span></span></span>`</span></span><br><span class="line"><span class="emphasis"> &#125;</span></span><br><span class="line"><span class="emphasis"> &#125;</span></span><br><span class="line"><span class="emphasis"> marked.setOptions(&#123;</span></span><br><span class="line"><span class="emphasis"> renderer: new marked.Renderer(),</span></span><br><span class="line"><span class="emphasis"> highlight: function (code) &#123;</span></span><br><span class="line"><span class="emphasis"> if (hljs) &#123;</span></span><br><span class="line"><span class="emphasis"> return hljs.highlightAuto(code).value</span></span><br><span class="line"><span class="emphasis"> &#125; else &#123;</span></span><br><span class="line"><span class="emphasis"> return code</span></span><br><span class="line"><span class="emphasis"> &#125;</span></span><br><span class="line"><span class="emphasis"> &#125;,</span></span><br><span class="line"><span class="emphasis"> pedantic: false,</span></span><br><span class="line"><span class="emphasis"> gfm: true,</span></span><br><span class="line"><span class="emphasis"> tables: true,</span></span><br><span class="line"><span class="emphasis"> breaks: true,</span></span><br><span class="line"><span class="emphasis"> sanitize: false,</span></span><br><span class="line"><span class="emphasis"> smartLists: true,</span></span><br><span class="line"><span class="emphasis"> smartypants: false,</span></span><br><span class="line"><span class="emphasis"> xhtml: false</span></span><br><span class="line"><span class="emphasis"> &#125;)</span></span><br><span class="line"><span class="emphasis"> marked.use(&#123; renderer &#125;)</span></span><br><span class="line"><span class="emphasis"> return marked.parse(body)</span></span><br><span class="line"><span class="emphasis"> &#125;</span></span><br><span class="line"><span class="emphasis"> fetch(`$&#123;apiURL&#125;/get/$&#123;speakId&#125;`)</span></span><br><span class="line"><span class="emphasis"> .then(response =&gt; response.json())</span></span><br><span class="line"><span class="emphasis"> .then(res =&gt; &#123;</span></span><br><span class="line"><span class="emphasis"> const data = res.data;</span></span><br><span class="line"><span class="emphasis"> if(data)&#123;</span></span><br><span class="line"><span class="emphasis"> const &#123;title,content&#125; = data;</span></span><br><span class="line"><span class="emphasis"> const contentSub = content.substring(0, 30);</span></span><br><span class="line"><span class="emphasis"> document.querySelector(&#x27;.content&#x27;).innerHTML = markedRender(content);</span></span><br><span class="line"><span class="emphasis"> if(title)&#123;</span></span><br><span class="line"><span class="emphasis"> document.title = title;</span></span><br><span class="line"><span class="emphasis"> &#125;</span></span><br><span class="line"><span class="emphasis"> discuss.init(&#123;</span></span><br><span class="line"><span class="emphasis"> el: &#x27;.ispeak-comment&#x27;,// 不用改</span></span><br><span class="line"><span class="emphasis"> serverURLs: &#x27;&#x27;,//填写你的Discuss服务端地址</span></span><br><span class="line"><span class="emphasis"> path: path + &#x27;?q=&#x27; + speakId,// 不用改</span></span><br><span class="line"><span class="emphasis"> //后面可按照https://discuss.js.org/Quick-Start.html#%E5%AE%A2%E6%88%B7%E7%AB%AF-client 修改（必须放在path后面！以下为一个例子）</span></span><br><span class="line"><span class="emphasis"> ph: &#x27;千山万水总是情，给个评论行不行&#x27; ,//评论框占位符</span></span><br><span class="line"><span class="emphasis"> imgLoading: &#x27;https://bu.dusays.com/2021/03/04/d2d5e983e2961.gif&#x27;//评论图片加载动画</span></span><br><span class="line"><span class="emphasis"> &#125;)</span></span><br><span class="line"><span class="emphasis"> &#125;</span></span><br><span class="line"><span class="emphasis"> &#125;);</span></span><br><span class="line"><span class="emphasis"><span class="language-xml"><span class="tag">&lt;/<span class="name">script</span>&gt;</span></span></span></span><br></pre></td></tr></table></figure></li></ul></div><div class="tab-pane" id="前端引入ispeak-4"><ul><li>在博客目录下运行<code>hexo new page speaks</code></li><li>编辑[blogroot]\source\speaks\index.md，将里面的内容替换成：<figure class="highlight markdown"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br><span class="line">5</span><br><span class="line">6</span><br><span class="line">7</span><br><span class="line">8</span><br><span class="line">9</span><br><span class="line">10</span><br><span class="line">11</span><br><span class="line">12</span><br><span class="line">13</span><br><span class="line">14</span><br><span class="line">15</span><br><span class="line">16</span><br><span class="line">17</span><br><span class="line">18</span><br><span class="line">19</span><br><span class="line">20</span><br><span class="line">21</span><br><span class="line">22</span><br><span class="line">23</span><br><span class="line">24</span><br><span class="line">25</span><br><span class="line">26</span><br><span class="line">27</span><br><span class="line">28</span><br><span class="line">29</span><br><span class="line">30</span><br><span class="line">31</span><br><span class="line">32</span><br><span class="line">33</span><br><span class="line">34</span><br><span class="line">35</span><br><span class="line">36</span><br><span class="line">37</span><br><span class="line">38</span><br><span class="line">39</span><br><span class="line">40</span><br><span class="line">41</span><br><span class="line">42</span><br><span class="line">43</span><br><span class="line">44</span><br><span class="line">45</span><br><span class="line">46</span><br><span class="line">47</span><br><span class="line">48</span><br><span class="line">49</span><br><span class="line">50</span><br><span class="line">51</span><br><span class="line">52</span><br><span class="line">53</span><br><span class="line">54</span><br><span class="line">55</span><br><span class="line">56</span><br><span class="line">57</span><br><span class="line">58</span><br><span class="line">59</span><br><span class="line">60</span><br><span class="line">61</span><br><span class="line">62</span><br><span class="line">63</span><br><span class="line">64</span><br><span class="line">65</span><br><span class="line">66</span><br><span class="line">67</span><br><span class="line">68</span><br><span class="line">69</span><br><span class="line">70</span><br><span class="line">71</span><br></pre></td><td class="code"><pre><span class="line">---</span><br><span class="line">title: 说说</span><br><span class="line">comments: false</span><br><span class="line"><span class="section">aside: false</span></span><br><span class="line"><span class="section">---</span></span><br><span class="line">&#123;% raw %&#125;</span><br><span class="line"><span class="language-xml"><span class="tag">&lt;<span class="name">style</span>&gt;</span></span></span><br><span class="line"> .speak-footer,.atk-list-footer&#123;</span><br><span class="line"><span class="code"> display:none;</span></span><br><span class="line"><span class="code"> &#125;</span></span><br><span class="line"><span class="code">&lt;/style&gt;</span></span><br><span class="line"><span class="code">&lt;div id=&quot;ispeak&quot;&gt;&lt;/div&gt;</span></span><br><span class="line"><span class="code">&lt;link</span></span><br><span class="line"><span class="code"> rel=&quot;stylesheet&quot;</span></span><br><span class="line"><span class="code"> href=&quot;https://cdn.staticfile.org/highlight.js/10.6.0/styles/atom-one-dark.min.css&quot;</span></span><br><span class="line"><span class="code">/&gt;</span></span><br><span class="line"><span class="code">&lt;link</span></span><br><span class="line"><span class="code"> rel=&quot;stylesheet&quot;</span></span><br><span class="line"><span class="code"> href=&quot;https://npm.elemecdn.com/ispeak@4.4.0/style.css&quot;</span></span><br><span class="line"><span class="code">/&gt;</span></span><br><span class="line"><span class="code">&lt;script src=&quot;https://cdn.staticfile.org/highlight.js/10.6.0/highlight.min.js&quot;&gt;&lt;/script&gt;</span></span><br><span class="line"><span class="code">&lt;script src=&quot;https://cdn.staticfile.org/marked/2.0.0/marked.min.js&quot;&gt;&lt;/script&gt;</span></span><br><span class="line"><span class="code">&lt;script src=&quot;https://npm.elemecdn.com/ispeak@4.4.0/ispeak.umd.js&quot;&gt;&lt;/script&gt;</span></span><br><span class="line"><span class="code">&lt;!-- CSS --&gt;</span></span><br><span class="line"><span class="code">&lt;link href=&quot;https://unpkg.com/artalk@2.3.4/dist/Artalk.css&quot; rel=&quot;stylesheet&quot; /&gt;</span></span><br><span class="line"><span class="code">&lt;!-- JS --&gt;</span></span><br><span class="line"><span class="code">&lt;script src=&quot;https://unpkg.com/artalk@2.3.4/dist/Artalk.js&quot;&gt;&lt;/script&gt;</span></span><br><span class="line"><span class="code">&lt;script&gt;</span></span><br><span class="line"><span class="code"> function load_ispeak() &#123;</span></span><br><span class="line"><span class="code"> setTimeout(function() &#123;</span></span><br><span class="line"><span class="code"> var HEAD = document.getElementsByTagName(&#x27;head&#x27;)[0] || document.documentElement;</span></span><br><span class="line"><span class="code"> var src = &#x27;https://cdn1.tianli0.top/npm/ispeak/ispeak.umd.js&#x27;</span></span><br><span class="line"><span class="code"> var script = document.createElement(&#x27;script&#x27;)</span></span><br><span class="line"><span class="code"> script.setAttribute(&#x27;type&#x27;,&#x27;text/javascript&#x27;)</span></span><br><span class="line"><span class="code"> script.onload = function() &#123;</span></span><br><span class="line"><span class="code"> pjax_ispeak()</span></span><br><span class="line"><span class="code"> &#125;</span></span><br><span class="line"><span class="code"> script.setAttribute(&#x27;src&#x27;, src)</span></span><br><span class="line"><span class="code"> HEAD.appendChild(script)</span></span><br><span class="line"><span class="code"> &#125;, 1);</span></span><br><span class="line"><span class="code"> &#125;;</span></span><br><span class="line"><span class="code"> function pjax_ispeak() &#123;</span></span><br><span class="line"><span class="code"> if(!document.querySelectorAll(&quot;#ispeak&quot;)[0])return;</span></span><br><span class="line"><span class="code"> ispeak</span></span><br><span class="line"><span class="code"> .init(&#123;</span></span><br><span class="line"><span class="code"> el: &#x27;#ispeak&#x27;,//不用改</span></span><br><span class="line"><span class="code"> api: &#x27;&#x27;, //填写你kkapi地址（不是kkadmin后台地址！）</span></span><br><span class="line"><span class="code"> author: &#x27;&#x27;,//填写个人ID</span></span><br><span class="line"><span class="code"> pageSize: 10,//每页speak显示的条数（建议保持默认，除非你要魔改css）</span></span><br><span class="line"><span class="code"> loading_img: &#x27;https://bu.dusays.com/2021/03/04/d2d5e983e2961.gif&#x27;,//加载动画</span></span><br><span class="line"><span class="code"> comment: function (speak) &#123;</span></span><br><span class="line"><span class="code"> const &#123; _id, title, content &#125; = speak</span></span><br><span class="line"><span class="code"> const contentSub = content.substring(0, 30)</span></span><br><span class="line"><span class="code"> new Artalk(&#123;</span></span><br><span class="line"><span class="code"> el: &#x27;.ispeak-comment&#x27;, // 不用改</span></span><br><span class="line"><span class="code"> pageKey: &#x27;/speak/info.html?q=&#x27; + _id, //不用改，除非你将上面的speak改为别的文件夹昵称</span></span><br><span class="line"><span class="code"> pageTitle: title || contentSub, // 不用改</span></span><br><span class="line"><span class="code"> server: &#x27;&#x27;, //填写你的Artalk服务端地址</span></span><br><span class="line"><span class="code"> site: &#x27;&#x27; // 填写你的站点名</span></span><br><span class="line"><span class="code"> &#125;)</span></span><br><span class="line"><span class="code"> &#125;</span></span><br><span class="line"><span class="code"> &#125;);</span></span><br><span class="line"><span class="code"> &#125;</span></span><br><span class="line"><span class="code"> load_ispeak();</span></span><br><span class="line"><span class="code"> document.addEventListener(&#x27;pjax:complete&#x27;, function () &#123;</span></span><br><span class="line"><span class="code"> pjax_ispeak();</span></span><br><span class="line"><span class="code"> &#125;);</span></span><br><span class="line"><span class="code">&lt;/script&gt;</span></span><br><span class="line"><span class="code">&lt;!--建议标注末尾链接--&gt;</span></span><br><span class="line"><span class="code">&lt;p style=&quot;width: 100%;text-align: end;font-size: .75em;color: #999;margin-top: 1em;&quot;&gt;Powered by &lt;a href=&quot;https://www.antmoe.com/speak/&quot;&gt;&lt;strong&gt;iSpeak&lt;/strong&gt;&lt;/a&gt; | Comment by &lt;a href=&quot;https://artalk.js.org/&quot;&gt;&lt;strong&gt;Artalk&lt;/strong&gt;&lt;/a&gt;&lt;/p&gt; </span></span><br><span class="line"><span class="code">&#123;% endraw %&#125;</span></span><br></pre></td></tr></table></figure></li><li>在[blogroot]\source\speaks\下新建info.md，内容为下：<figure class="highlight markdown"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br><span class="line">5</span><br><span class="line">6</span><br><span class="line">7</span><br><span class="line">8</span><br><span class="line">9</span><br><span class="line">10</span><br><span class="line">11</span><br><span class="line">12</span><br><span class="line">13</span><br><span class="line">14</span><br><span class="line">15</span><br><span class="line">16</span><br><span class="line">17</span><br><span class="line">18</span><br><span class="line">19</span><br><span class="line">20</span><br><span class="line">21</span><br><span class="line">22</span><br><span class="line">23</span><br><span class="line">24</span><br><span class="line">25</span><br><span class="line">26</span><br><span class="line">27</span><br><span class="line">28</span><br><span class="line">29</span><br><span class="line">30</span><br><span class="line">31</span><br><span class="line">32</span><br><span class="line">33</span><br><span class="line">34</span><br><span class="line">35</span><br><span class="line">36</span><br><span class="line">37</span><br><span class="line">38</span><br><span class="line">39</span><br><span class="line">40</span><br><span class="line">41</span><br><span class="line">42</span><br><span class="line">43</span><br><span class="line">44</span><br><span class="line">45</span><br><span class="line">46</span><br><span class="line">47</span><br><span class="line">48</span><br><span class="line">49</span><br><span class="line">50</span><br><span class="line">51</span><br><span class="line">52</span><br><span class="line">53</span><br><span class="line">54</span><br><span class="line">55</span><br><span class="line">56</span><br><span class="line">57</span><br><span class="line">58</span><br><span class="line">59</span><br><span class="line">60</span><br><span class="line">61</span><br><span class="line">62</span><br><span class="line">63</span><br><span class="line">64</span><br><span class="line">65</span><br><span class="line">66</span><br><span class="line">67</span><br><span class="line">68</span><br><span class="line">69</span><br><span class="line">70</span><br><span class="line">71</span><br><span class="line">72</span><br><span class="line">73</span><br><span class="line">74</span><br></pre></td><td class="code"><pre><span class="line">---</span><br><span class="line">title: Speak</span><br><span class="line">aside: false</span><br><span class="line">comments: false</span><br><span class="line"><span class="section">description: 欢迎来到SinzMise的日记，快来看看SinzMise分享了什么！ # speak介绍</span></span><br><span class="line"><span class="section">---</span></span><br><span class="line">&lt;!-- CSS --&gt;</span><br><span class="line"><span class="language-xml"><span class="tag">&lt;<span class="name">link</span> <span class="attr">href</span>=<span class="string">&quot;https://unpkg.com/artalk@2.3.4/dist/Artalk.css&quot;</span> <span class="attr">rel</span>=<span class="string">&quot;stylesheet&quot;</span> /&gt;</span></span></span><br><span class="line"><span class="language-xml"><span class="tag">&lt;<span class="name">link</span> <span class="attr">rel</span>=<span class="string">&quot;stylesheet&quot;</span> <span class="attr">href</span>=<span class="string">&quot;https://cdn.staticfile.org/highlight.js/10.6.0/styles/atom-one-dark.min.css&quot;</span> /&gt;</span></span></span><br><span class="line"><span class="language-xml"><span class="tag">&lt;<span class="name">div</span> <span class="attr">class</span>=<span class="string">&#x27;content&#x27;</span>&gt;</span></span></span><br><span class="line"> <span class="language-xml"><span class="tag">&lt;<span class="name">img</span> <span class="attr">src</span>=<span class="string">&#x27;https://bu.dusays.com/2022/05/01/626e88f349943.gif&#x27;</span>&gt;</span></span></span><br><span class="line"><span class="language-xml"><span class="tag">&lt;/<span class="name">div</span>&gt;</span></span></span><br><span class="line">&#123;% btn &#x27;/speaks/&#x27;,查看全部,far fa-hand-point-right,block center blue larger %&#125;</span><br><span class="line"><span class="language-xml"><span class="tag">&lt;<span class="name">hr</span> /&gt;</span></span></span><br><span class="line"><span class="language-xml"><span class="tag">&lt;<span class="name">div</span> <span class="attr">class</span>=<span class="string">&#x27;ispeak-comment&#x27;</span>&gt;</span></span><span class="language-xml"><span class="tag">&lt;/<span class="name">div</span>&gt;</span></span></span><br><span class="line">&lt;!-- JS --&gt;</span><br><span class="line"><span class="language-xml"><span class="tag">&lt;<span class="name">script</span> <span class="attr">src</span>=<span class="string">&quot;https://unpkg.com/artalk@2.3.4/dist/Artalk.js&quot;</span>&gt;</span></span><span class="language-xml"><span class="tag">&lt;/<span class="name">script</span>&gt;</span></span></span><br><span class="line"><span class="language-xml"><span class="tag">&lt;<span class="name">script</span> <span class="attr">src</span>=<span class="string">&quot;https://unpkg.com/marked@4.0.18/marked.min.js&quot;</span>&gt;</span></span><span class="language-xml"><span class="tag">&lt;/<span class="name">script</span>&gt;</span></span></span><br><span class="line"><span class="language-xml"><span class="tag">&lt;<span class="name">script</span> <span class="attr">src</span>=<span class="string">&quot;https://cdn.staticfile.org/highlight.js/10.6.0/highlight.min.js&quot;</span>&gt;</span></span><span class="language-xml"><span class="tag">&lt;/<span class="name">script</span>&gt;</span></span></span><br><span class="line"><span class="language-xml"><span class="tag">&lt;<span class="name">script</span>&gt;</span></span></span><br><span class="line"> const searchParams = new URLSearchParams(window.location.search);</span><br><span class="line"> const speakId = searchParams.get(&#x27;q&#x27;);</span><br><span class="line"> const path = window.location.pathname;</span><br><span class="line"> const apiURL = &#x27;https://（你的api地址）/api/ispeak&#x27;;</span><br><span class="line"> const markedRender = (body, loading<span class="emphasis">_img=&#x27;https://bu.dusays.com/2022/05/01/626e88f349943.gif&#x27;) =&gt; &#123;</span></span><br><span class="line"><span class="emphasis"> const renderer = &#123;</span></span><br><span class="line"><span class="emphasis"> image(href, title, text) &#123;</span></span><br><span class="line"><span class="emphasis"> return `<span class="language-xml"><span class="language-javascript">&lt;a href=<span class="string">&quot;$&#123;href&#125;&quot;</span> target=<span class="string">&quot;_blank&quot;</span> data-fancybox=<span class="string">&quot;group&quot;</span> <span class="keyword">class</span>=<span class="string">&quot;fancybox&quot;</span>&gt;</span></span></span></span><br><span class="line"><span class="emphasis"> <span class="language-xml"><span class="language-handlebars"><span class="language-xml"><span class="tag">&lt;<span class="name">img</span> <span class="attr">speak-src</span>=<span class="string">&quot;$&#123;href&#125;&quot;</span> <span class="attr">src</span>=<span class="string">$&#123;loading_img&#125;</span> <span class="attr">alt</span>=<span class="string">&#x27;$&#123;text&#125;&#x27;</span>&gt;</span></span></span></span></span></span><br><span class="line"><span class="emphasis"> <span class="language-xml"><span class="language-handlebars"><span class="language-xml"><span class="tag">&lt;/<span class="name">a</span>&gt;</span></span></span></span>`</span></span><br><span class="line"><span class="emphasis"> &#125;</span></span><br><span class="line"><span class="emphasis"> &#125;</span></span><br><span class="line"><span class="emphasis"> marked.setOptions(&#123;</span></span><br><span class="line"><span class="emphasis"> renderer: new marked.Renderer(),</span></span><br><span class="line"><span class="emphasis"> highlight: function (code) &#123;</span></span><br><span class="line"><span class="emphasis"> if (hljs) &#123;</span></span><br><span class="line"><span class="emphasis"> return hljs.highlightAuto(code).value</span></span><br><span class="line"><span class="emphasis"> &#125; else &#123;</span></span><br><span class="line"><span class="emphasis"> return code</span></span><br><span class="line"><span class="emphasis"> &#125;</span></span><br><span class="line"><span class="emphasis"> &#125;,</span></span><br><span class="line"><span class="emphasis"> pedantic: false,</span></span><br><span class="line"><span class="emphasis"> gfm: true,</span></span><br><span class="line"><span class="emphasis"> tables: true,</span></span><br><span class="line"><span class="emphasis"> breaks: true,</span></span><br><span class="line"><span class="emphasis"> sanitize: false,</span></span><br><span class="line"><span class="emphasis"> smartLists: true,</span></span><br><span class="line"><span class="emphasis"> smartypants: false,</span></span><br><span class="line"><span class="emphasis"> xhtml: false</span></span><br><span class="line"><span class="emphasis"> &#125;)</span></span><br><span class="line"><span class="emphasis"> marked.use(&#123; renderer &#125;)</span></span><br><span class="line"><span class="emphasis"> return marked.parse(body)</span></span><br><span class="line"><span class="emphasis"> &#125;</span></span><br><span class="line"><span class="emphasis"> fetch(`$&#123;apiURL&#125;/get/$&#123;speakId&#125;`)</span></span><br><span class="line"><span class="emphasis"> .then(response =&gt; response.json())</span></span><br><span class="line"><span class="emphasis"> .then(res =&gt; &#123;</span></span><br><span class="line"><span class="emphasis"> const data = res.data;</span></span><br><span class="line"><span class="emphasis"> if(data)&#123;</span></span><br><span class="line"><span class="emphasis"> const &#123;title,content&#125; = data;</span></span><br><span class="line"><span class="emphasis"> const contentSub = content.substring(0, 30);</span></span><br><span class="line"><span class="emphasis"> document.querySelector(&#x27;.content&#x27;).innerHTML = markedRender(content);</span></span><br><span class="line"><span class="emphasis"> if(title)&#123;</span></span><br><span class="line"><span class="emphasis"> document.title = title;</span></span><br><span class="line"><span class="emphasis"> &#125;</span></span><br><span class="line"><span class="emphasis"> new Artalk(&#123;</span></span><br><span class="line"><span class="emphasis"> el: &#x27;.ispeak-comment&#x27;, // 不用改</span></span><br><span class="line"><span class="emphasis"> pageKey: path + &#x27;?q=&#x27; + speakId, // 不用改</span></span><br><span class="line"><span class="emphasis"> pageTitle: title || contentSub, // 不用改</span></span><br><span class="line"><span class="emphasis"> server: &#x27;&#x27;, //填写你的Artalk服务端地址</span></span><br><span class="line"><span class="emphasis"> site: &#x27;&#x27; // 填写你的站点名</span></span><br><span class="line"><span class="emphasis"> &#125;)</span></span><br><span class="line"><span class="emphasis"> &#125;</span></span><br><span class="line"><span class="emphasis"> &#125;);</span></span><br><span class="line"><span class="emphasis"><span class="language-xml"><span class="tag">&lt;/<span class="name">script</span>&gt;</span></span></span></span><br></pre></td></tr></table></figure></li></ul></div></div></div></div><div class="footer"></div><div class="article-meta" id="bottom"><div class="new-meta-box"><div class="new-meta-item date" itemprop="dateModified"><a class="notlink"><i class="fa-solid fa-edit fa-fw" aria-hidden="true"></i><p>更新于：<time class="dataToShow dt-updated" datetime="2024-11-02T08:49:58+00:00" title="2024年11月2日">2024年11月2日</time></p></a></div><div class="new-meta-item meta-tags"><a class="tag" href="/tags/%E7%AB%99%E7%82%B9%E6%8A%98%E8%85%BE/" rel="nofollow"><i class="fa-solid fa-hashtag fa-fw" aria-hidden="true"></i><p>站点折腾</p></a></div><div class="new-meta-item meta-tags"><a class="tag" href="/tags/%E9%A1%B5%E9%9D%A2%E9%AD%94%E6%94%B9/" rel="nofollow"><i class="fa-solid fa-hashtag fa-fw" aria-hidden="true"></i><p>页面魔改</p></a></div> <span hidden itemprop="keywords">站点折腾 页面魔改</span><div class="new-meta-item share -mob-share-list"><div class="-mob-share-list share-body"> <a class="-mob-share-qq" title="" rel="external nofollow noopener noreferrer noopener" target="_blank" href="http://connect.qq.com/widget/shareqq/index.html?url=https://blog.sinzmise.top/posts/38964/&title=小康大佬的说说方案 ———— ispeak搭建教程 - 汐塔魔法屋&summary=搞ispeak时发现ispeak更新，能自定义评论了，也就是说我之前写的ispeak教程失效了没办法我只能重新写了这篇教程"><img src="https://jsd.cdn.storisinz.site/npm/volantis-static@0.0.1660614606622/media/org.volantis/logo/128/qq.png" class="lazyload" data-srcset="https://jsd.cdn.storisinz.site/npm/volantis-static@0.0.1660614606622/media/org.volantis/logo/128/qq.png" srcset="data:image/gif;base64,R0lGODlhAQABAIAAAP///////yH5BAEKAAEALAAAAAABAAEAAAICTAEAOw=="></a> <a class="-mob-share-qzone" title="" rel="external nofollow noopener noreferrer noopener" target="_blank" href="https://sns.qzone.qq.com/cgi-bin/qzshare/cgi_qzshare_onekey?url=https://blog.sinzmise.top/posts/38964/&title=小康大佬的说说方案 ———— ispeak搭建教程 - 汐塔魔法屋&summary=搞ispeak时发现ispeak更新，能自定义评论了，也就是说我之前写的ispeak教程失效了没办法我只能重新写了这篇教程"><img src="https://jsd.cdn.storisinz.site/npm/volantis-static@0.0.1660614606622/media/org.volantis/logo/128/qzone.png" class="lazyload" data-srcset="https://jsd.cdn.storisinz.site/npm/volantis-static@0.0.1660614606622/media/org.volantis/logo/128/qzone.png" srcset="data:image/gif;base64,R0lGODlhAQABAIAAAP///////yH5BAEKAAEALAAAAAABAAEAAAICTAEAOw=="></a> <a class="-mob-share-weibo" title="" rel="external nofollow noopener noreferrer noopener" target="_blank" href="http://service.weibo.com/share/share.php?url=https://blog.sinzmise.top/posts/38964/&title=小康大佬的说说方案 ———— ispeak搭建教程 - 汐塔魔法屋&summary=搞ispeak时发现ispeak更新，能自定义评论了，也就是说我之前写的ispeak教程失效了没办法我只能重新写了这篇教程"><img src="https://jsd.cdn.storisinz.site/npm/volantis-static@0.0.1660614606622/media/org.volantis/logo/128/weibo.png" class="lazyload" data-srcset="https://jsd.cdn.storisinz.site/npm/volantis-static@0.0.1660614606622/media/org.volantis/logo/128/weibo.png" srcset="data:image/gif;base64,R0lGODlhAQABAIAAAP///////yH5BAEKAAEALAAAAAABAAEAAAICTAEAOw=="></a></div></div></div></div><div class="prev-next"><a class="prev" href="/posts/61417/"><p class="title"><i class="fa-solid fa-angle-double-left" aria-hidden="true"></i>自建Meting服务</p><p class="content">听人说Meting官方API证书过期了，也就是说MetingAPI得自建了然后很快啊，有人就搞出了自建MetingAPI的Vercel版本 教程后端部署Vercel部署（推荐）服务器部署点击下方...</p></a><a class="next" href="/posts/22945/"><p class="title">butterfly主题添加音乐页面（适配手机）<i class="fa-solid fa-angle-double-right" aria-hidden="true"></i></p><p class="content">本博客已经更换主题 没有音乐页面怎么行，花里胡哨的都安排上，本来想摆烂直接上aplayer，但考虑到我不会写样式（虽然我可以自学） 所以我音乐页面用的是Chuckle的方案（等会为啥开头这么像这...</p></a></div></article><article class="post white-box shadow floatable blur" id="comments"><span hidden><meta itemprop="discussionUrl" content="/posts/38964/#comments"></span><p ct><i class="fa-solid fa-comments"></i> 评论</p><div id="layoutHelper-comments"></div></article></div><aside id="l_side" class="not-select default-cursor" itemscope itemtype="http://schema.org/WPSideBar"><section class="widget nextsite desktop pjax"><div class="site-brand-wrapper"><div class="site-meta"> <a href="/" class="brand" rel="start"><span class="site-title">汐塔魔法屋</span></a><p class="site-subtitle" itemprop="description">Ceta Magical House</p></div><div class="site-nav-toggle"> <button aria-label="切换导航栏"><span class="btn-bar"></span><span class="btn-bar"></span><span class="btn-bar"></span></button></div></div><nav class="site-nav"><ul class="next-main"><li class="next-main-item"><a href="/categories/" title="分类" active-action="action-categories"><i class="menu-item-icon fa-solid fa-folder-open fa-fw"></i> 分类</a></li><li class="next-main-item"><a href="/tags/" title="标签" active-action="action-tags"><i class="menu-item-icon fa-solid fa-tags fa-fw"></i> 标签</a></li><li class="next-main-item"><a href="/archives/" title="归档" active-action="action-archives"><i class="menu-item-icon fa-solid fa-archive fa-fw"></i> 归档</a></li><li class="next-main-item"><a href="/link/" title="友链" active-action="action-link"><i class="menu-item-icon fa-solid fa-link fa-fw"></i> 友链</a></li><li class="next-main-item"><a target="_blank" rel="noopener" href="https://www.travellings.cn/go.html" title="开往" active-action="action-https:wwwtravellingscngohtml"><i class="menu-item-icon fa-solid fa-subway fa-fw"></i> 开往</a></li><li class="next-main-item"><a target="_blank" rel="noopener" href="https://en.blog.sinzmise.top/" title="English" active-action="action-https:enblogsinzmisetop"><i class="menu-item-icon fa fa-language fa-fw fa-fw"></i> English</a></li><li class="next-main-item"><a href="javascript:void(0)" title="搜索" active-action="action-javascript:void(0)" onclick="OpenSearch()"><i class="menu-item-icon fa-solid fa-search fa-fw"></i> 搜索</a></li></ul></nav></section><section class="widget nextblogger desktop pjax h-card"><div class="content"> <a class="avatar u-url flat-box" href="https://blog.sinzmise.top/"><img no-lazy class="site-author-image u-photo" itemprop="image" src="/img/avatar.png" alt="王九弦SZ·Ninty"></a><div class="site-author-box"><p class="site-author-name p-name" itemprop="name">王九弦SZ·Ninty</p><p class="site-author-description" itemprop="description">种下故事的种子，随着风和光生根发芽</p></div><div class="links-of-author"><span class="links-of-author-item"><a href="/atom.xml" title="RSS" alt="汐塔魔法屋" rel="me"><i class="fa-solid fa-rss fa-fw"></i></a></span><span class="links-of-author-item"><a href="mailto:email@sinzmise.top" title="Email" alt="汐塔魔法屋" class="u-email" rel="me"><i class="fa-solid fa-envelope fa-fw"></i></a></span><span class="links-of-author-item"><a target="_blank" href="https://github.com/SinzMise/" title="Github" alt="汐塔魔法屋" rel="me noopener"><i class="fab fa-github fa-fw"></i></a></span></div></div></section><section class="widget category desktop pjax"><header><a href="/categories/"><span class="icon"><i class="fa-solid fa-folder-open fa-fw" aria-hidden="true"></i></span> <span class="name">文章分类</span></a></header><div class="content"><ul class="entry navigation"><li><a class="flat-box" title="/categories/%E4%B8%AA%E4%BA%BA%E5%B0%8F%E8%AE%B0/" href="/categories/%E4%B8%AA%E4%BA%BA%E5%B0%8F%E8%AE%B0/" active-action="action-categoriesE4B8AAE4BABAE5B08FE8AEB0"><div class="name">个人小记</div><div class="badge">(19)</div></a></li><li><a class="flat-box" title="/categories/%E6%AD%8C%E6%9B%B2%E6%94%B6%E9%9B%86/" href="/categories/%E6%AD%8C%E6%9B%B2%E6%94%B6%E9%9B%86/" active-action="action-categoriesE6AD8CE69BB2E694B6E99B86"><div class="name">歌曲收集</div><div class="badge">(1)</div></a></li><li><a class="flat-box" title="/categories/%E6%B8%B8%E6%88%8F%E7%9B%B8%E5%85%B3/" href="/categories/%E6%B8%B8%E6%88%8F%E7%9B%B8%E5%85%B3/" active-action="action-categoriesE6B8B8E6888FE79BB8E585B3"><div class="name">游戏相关</div><div class="badge">(4)</div></a></li><li><a class="flat-box" title="/categories/%E7%AB%99%E7%82%B9%E6%8A%98%E8%85%BE/" href="/categories/%E7%AB%99%E7%82%B9%E6%8A%98%E8%85%BE/" active-action="action-categoriesE7AB99E782B9E68A98E885BE"><div class="name">站点折腾</div><div class="badge">(14)</div></a></li><li><a class="flat-box" title="/categories/%E9%A1%B9%E7%9B%AE%E6%8A%98%E8%85%BE/" href="/categories/%E9%A1%B9%E7%9B%AE%E6%8A%98%E8%85%BE/" active-action="action-categoriesE9A1B9E79BAEE68A98E885BE"><div class="name">项目折腾</div><div class="badge">(3)</div></a></li></ul></div></section><section class="widget tagcloud desktop pjax"><header><a href="/tags/"><span class="icon"><i class="fa-solid fa-tags fa-fw" aria-hidden="true"></i></span> <span class="name">热门标签</span></a></header><div class="content"> <a href="/tags/Flash%E7%9B%B8%E5%85%B3/" style="font-size:14px;color:#999">Flash相关</a> <a href="/tags/Steam%E6%B8%B8%E6%88%8F/" style="font-size:14px;color:#999">Steam游戏</a> <a href="/tags/Windows%E8%BD%AF%E4%BB%B6/" style="font-size:15.67px;color:#8e8e8e">Windows软件</a> <a href="/tags/%E4%B8%AA%E4%BA%BA%E5%B0%8F%E8%AE%B0/" style="font-size:24px;color:#555">个人小记</a> <a href="/tags/%E5%85%B6%E5%AE%83%E6%B8%B8%E6%88%8F/" style="font-size:17.33px;color:#828282">其它游戏</a> <a href="/tags/%E5%8A%A0%E8%BD%BD%E5%8A%A8%E7%94%BB/" style="font-size:14px;color:#999">加载动画</a> <a href="/tags/%E6%82%AC%E6%B5%AE%E5%AE%A0%E7%89%A9-%E7%9C%8B%E6%9D%BF%E5%A8%98/" style="font-size:14px;color:#999">悬浮宠物/看板娘</a> <a href="/tags/%E6%AD%8C%E6%9B%B2%E6%94%B6%E9%9B%86/" style="font-size:14px;color:#999">歌曲收集</a> <a href="/tags/%E6%B8%B8%E6%88%8F%E7%9B%B8%E5%85%B3/" style="font-size:19px;color:#777">游戏相关</a> <a href="/tags/%E7%AB%99%E7%82%B9%E5%BA%95%E9%83%A8%E9%AD%94%E6%94%B9/" style="font-size:14px;color:#999">站点底部魔改</a> <a href="/tags/%E7%AB%99%E7%82%B9%E6%8A%98%E8%85%BE/" style="font-size:22.33px;color:#606060">站点折腾</a> <a href="/tags/%E8%87%AA%E5%BB%BA%E9%83%A8%E7%BD%B2/" style="font-size:20.67px;color:#6c6c6c">自建部署</a> <a href="/tags/%E9%A1%B5%E9%9D%A2%E9%AD%94%E6%94%B9/" style="font-size:17.33px;color:#828282">页面魔改</a> <a href="/tags/%E9%A1%B9%E7%9B%AE%E6%8A%98%E8%85%BE/" style="font-size:17.33px;color:#828282">项目折腾</a></div></section><div class="widget-sticky pjax"><section class="widget desktop"><header><span class="icon"><i class="fa-solid fa-award fa-fw" aria-hidden="true"></i></span> <span class="name">站点信息</span></header><div class="content"><div class="webinfo"><div class="webinfo-item"><div>文章数目：</div><div>41 篇</div></div><div class="webinfo-item"><div>本站访客数：</div><div><span id="busuanzi_value_site_uv"><i class="fa-solid fa-fan fa-spin fa-fw" aria-hidden="true"></i></span> 人</div></div><div class="webinfo-item"><div>本站总访问量：</div><div><span id="busuanzi_value_site_pv"><i class="fa-solid fa-fan fa-spin fa-fw" aria-hidden="true"></i></span> 次</div></div><div class="webinfo-item"><div>最后活动时间：</div><div id="last-update-show">2024-11-02 日</div></div></div></div></section></div><div class="pjax"></div><div class="pjax"></div><div class="pjax"></div><div class="pjax"></div><div class="pjax"></div><div class="pjax"></div><div class="pjax"></div></aside><pjax><script>window.pdata={ispage:!0,commentPath:"",commentPlaceholder:"",commentConfig:{}},document.getElementById("l_header")&&document.getElementById("l_header").classList.add("show")</script></pjax></div><footer class="footer clearfix" itemscope itemtype="http://schema.org/WPFooter"><br><br><br><div class="social-wrapper" itemprop="about" itemscope itemtype="http://schema.org/Thing"> <a href="https://www.travellings.cn/go.html" class="social flat-btn" target="_blank" rel="external nofollow noopener noreferrer" itemprop="url" alt="开往-友链接力"><img src="https://www.travellings.cn/assets/logo.gif" class="lazyload" data-srcset="https://www.travellings.cn/assets/logo.gif" srcset="data:image/gif;base64,R0lGODlhAQABAIAAAP///////yH5BAEKAAEALAAAAAABAAEAAAICTAEAOw=="></a> <a href="https://blogscn.fun/" class="social flat-btn" target="_blank" rel="external nofollow noopener noreferrer" itemprop="url" alt="本站已加入BLOGS·CN"><img src="https://photo.xiangming.site/img/blogscn.png" class="lazyload" data-srcset="https://photo.xiangming.site/img/blogscn.png" srcset="data:image/gif;base64,R0lGODlhAQABAIAAAP///////yH5BAEKAAEALAAAAAABAAEAAAICTAEAOw=="></a> <a href="https://blogscn.fun/random.html" class="social flat-btn" target="_blank" rel="external nofollow noopener noreferrer" itemprop="url" alt="BLOGS·CN随机访问"><img src="https://photo.xiangming.site/img/footer.gif" class="lazyload" data-srcset="https://photo.xiangming.site/img/footer.gif" srcset="data:image/gif;base64,R0lGODlhAQABAIAAAP///////yH5BAEKAAEALAAAAAABAAEAAAICTAEAOw=="></a></div><div><p>博客内容遵循 <a target="_blank" rel="noopener" href="https://creativecommons.org/licenses/by-nc-sa/4.0/deed.zh">署名-非商业性使用-相同方式共享 4.0 国际 (CC BY-NC-SA 4.0) 协议</a></p></div> 由 <a href="https://hexo.io" target="_blank" rel="noopener">Hexo</a> 驱动 | 主题 <a href="https://github.com/volantis-x/hexo-theme-volantis/#6.0.0-alpha.0" target="_blank" class="codename">Volantis</a><div class="copyright"><p><a target="_blank" rel="noopener" href="https://xn--sr8hvo.ws/previous">←</a> An <a target="_blank" rel="noopener" href="https://xn--sr8hvo.ws">IndieWeb Webring</a> 🕸💍 <a target="_blank" rel="noopener" href="https://xn--sr8hvo.ws/next">→</a><br>©2021 · <a href="/">中弦局·汐塔魔法屋</a><br><a target="_blank" rel="noopener" href="https://icp.gov.moe/?keyword=20231033">萌ICP备20231033号</a> | <a target="_blank" rel="noopener" href="https://icp.gov.moe/?keyword=20231033">MIIT备20240818号</a> | <a target="_blank" rel="noopener" href="https://guan.ma/hao/2024000155/">官码2024000155号</a><br>我加入的：<a target="_blank" rel="noopener" href="https://zhblogs.ohyee.cc/">中文博客列表</a> | <a target="_blank" rel="noopener" href="https://storeweb.cn/member/o/1585">个站商店</a> | <a target="_blank" rel="noopener" href="https://bf.zzxworld.com/s/995">BlogFinder</a> | <a target="_blank" rel="noopener" href="https://sites.applinzi.com/site-info?siteType=life&amp;siteId=64cb373190e35300a8eec654">站点聚合平台</a> | <a target="_blank" rel="noopener" href="https://boke.lu/">博客录</a> | <a target="_blank" rel="noopener" href="https://rssblog.cn/member/d711afd659d65c2ba2d3b18697818cf7/">RssBlog</a> | <a target="_blank" rel="noopener" href="https://blogscn.fun/">笔墨迹</a> | <a target="_blank" rel="noopener" href="https://daohang.lusongsong.com/">博客大全</a></p></div></footer><a id="s-top" class="fa-solid fa-arrow-up fa-fw" title="top"></a></div></div><div><script>volantis.dom.bodyAnchor=volantis.dom.$(document.getElementById("safearea")),volantis.dom.topBtn=volantis.dom.$(document.getElementById("s-top")),volantis.dom.wrapper=volantis.dom.$(document.getElementById("wrapper")),volantis.dom.coverAnchor=volantis.dom.$(document.querySelector("#l_cover .cover-wrapper")),volantis.dom.switcher=volantis.dom.$(document.querySelector("#l_header .switcher .s-search")),volantis.dom.header=volantis.dom.$(document.getElementById("l_header")),volantis.dom.search=volantis.dom.$(document.querySelector("#l_header .m_search")),volantis.dom.mPhoneList=volantis.dom.$(document.querySelectorAll("#l_header .m-phone .list-v")),top.location!=self.location&&(top.location=self.location),volantis.css("https://jsd.cdn.storisinz.site/npm/@fortawesome/fontawesome-free@6.1.1/css/all.min.css")</script><script src="/js/app.js"></script><script>function loadIssuesJS(){null!=document.getElementById("sites-api")&&"undefined"==typeof SitesJS&&volantis.js("/js/plugins/tags/sites.js");null!=document.getElementById("friends-api")&&"undefined"==typeof FriendsJS&&volantis.js("/js/plugins/tags/friends.js");null!=document.getElementById("contributors-api")&&"undefined"==typeof ContributorsJS&&volantis.js("/js/plugins/tags/contributors.js")}loadIssuesJS(),volantis.pjax.push((()=>{loadIssuesJS()}))</script><script defer="defer" src="https://jsd.cdn.storisinz.site/npm/vanilla-lazyload@17.1.0/dist/lazyload.min.js"></script><script>window.lazyLoadOptions={elements_selector:".lazyload",threshold:0},window.addEventListener("LazyLoad::Initialized",(function(n){window.lazyLoadInstance=n.detail.instance}),!1),document.addEventListener("DOMContentLoaded",(function(){lazyLoadInstance.update()})),document.addEventListener("pjax:complete",(function(){lazyLoadInstance.update()}))</script><script>window.FPConfig={delay:0,ignoreKeywords:["#"],maxRPS:6,hoverDelay:0}</script><script defer="defer" src="https://jsd.cdn.storisinz.site/npm/volantis-static@0.0.1660614606622/libs/flying-pages/flying-pages.min.js"></script><script>function load_twikoo(){document.querySelectorAll("#twikoo_container")[0]&&volantis.js("https://jsd.cdn.storisinz.site/npm/twikoo@1.6.39/dist/twikoo.min.js",pjax_twikoo)}function pjax_twikoo(){if(!document.querySelectorAll("#twikoo_container")[0])return;let o=pdata.commentPath,t=pdata.commentPlaceholder||"";if(0==o.length){o=""||decodeURI(window.location.pathname)}twikoo.init(Object.assign(Object.assign({path:null,envId:"https://tk.pl.blog.sinzmise.top/",placeholder:null,visitor:!1},{el:"#twikoo_container",path:o,placeholder:t,onCommentLoaded:function(){if("undefined"==typeof VolantisFancyBox){const o=setInterval((()=>{"undefined"!=typeof VolantisFancyBox&&(clearInterval(o),VolantisFancyBox.groupBind('.tk-content img:not([class*="emo"])',"Comments"))}))}else VolantisFancyBox.groupBind('.tk-content img:not([class*="emo"])',"Comments")}}),pdata.commentConfig))}volantis.layoutHelper("comments",'<div id="twikoo_container"><i class="fa-solid fa-cog fa-spin fa-fw fa-2x"></i></div>'),load_twikoo(),volantis.pjax.push((()=>{"undefined"==typeof twikoo?load_twikoo():pjax_twikoo()}),"twikoo")</script><script defer="defer" src="https://jsd.cdn.storisinz.site/npm/penndu@1.0.0/bsz.js" data-pjax></script><script>async function loadSearchScript(){return await volantis.js("https://jsd.cdn.storisinz.site/npm/algoliasearch@4.14.2/dist/algoliasearch-lite.umd.js"),await volantis.js("https://jsd.cdn.storisinz.site/npm/instantsearch.js@4.44.0/dist/instantsearch.production.min.js"),volantis.js("/js/search/algolia.js")}function loadSearchService(){document.querySelectorAll(".input.u-search-input").forEach((e=>{e.removeEventListener("focus",loadSearchService,!1)})),document.querySelectorAll(".u-search-form").forEach((e=>{e.addEventListener("submit",(e=>{e.preventDefault()}),!1)}))}function OpenSearch(e=""){"undefined"==typeof SearchService?loadSearchScript().then((()=>{SearchService.setQueryText(e),SearchService.search()})):(SearchService.setQueryText(e),SearchService.search())}if(loadSearchScript(),window.location.search&&/^\?s=/g.test(window.location.search)){OpenSearch(decodeURI(window.location.search).replace(/\ /g,"-").replace(/^\?s=/g,""))}document.querySelectorAll(".input.u-search-input").forEach((e=>{e.addEventListener("focus",loadSearchService,!1)}))</script><script>function pjax_highlightjs_copyCode(){(document.querySelector(".highlight .code pre")||document.querySelector(".article pre code"))&&VolantisApp.utilCopyCode(".highlight .code pre, .article pre code")}volantis.requestAnimationFrame(pjax_highlightjs_copyCode),volantis.pjax.push(pjax_highlightjs_copyCode)</script><script>function load_swiper(){document.querySelectorAll(".swiper-container")[0]&&(volantis.css("https://jsd.cdn.storisinz.site/npm/swiper@8.3.2/swiper-bundle.min.css"),volantis.js("https://jsd.cdn.storisinz.site/npm/swiper@8.3.2/swiper-bundle.min.js").then((()=>{pjax_swiper()})))}function pjax_swiper(){volantis.swiper=new Swiper(".swiper-container",{slidesPerView:"auto",spaceBetween:8,centeredSlides:!0,loop:!0,pagination:{el:".swiper-pagination",clickable:!0},navigation:{nextEl:".swiper-button-next",prevEl:".swiper-button-prev"}})}load_swiper(),volantis.pjax.push((()=>{document.querySelectorAll(".swiper-container")[0]&&(void 0===volantis.swiper?load_swiper():pjax_swiper())}))</script><pjax></pjax><script>function listenSidebarTOC(){const t=document.querySelectorAll(".toc li");if(!t.length)return;const e=[];Array.from(t).forEach((t=>{const n=t.querySelector(".toc-link"),i=document.getElementById(n.getAttribute("href")?decodeURI(n.getAttribute("href")).replace("#",""):n.getAttribute("toc-action").split("toc-")[1]);return e.push(i),n.getAttribute("href")&&(n.setAttribute("toc-action","toc-"+decodeURI(n.getAttribute("href")).replace("#","")),n.removeAttribute("href")),i&&i.id&&n.addEventListener("click",(t=>{t.preventDefault(),volantis.scroll.to(i,{addTop:5,observer:!0}),history.pushState(null,document.title,"#"+i.id)})),i}));function n(t){if(t.classList.contains("active-current"))return;document.querySelectorAll(".toc .active").forEach((t=>{t.classList.remove("active","active-current")})),t.classList.add("active","active-current");let e=t.parentNode;for(;!e.matches(".toc");)e.matches("li")&&e.classList.add("active"),e=e.parentNode}volantis.activateNavIndex=0,n(t[volantis.activateNavIndex]),e[0]&&volantis.scroll.push((()=>{if(e[0].getBoundingClientRect().top>=0)volantis.activateNavIndex=0;else if(e[e.length-1].getBoundingClientRect().top<0)volantis.activateNavIndex=e.length-1;else for(let t=0;t<e.length;t++){const n=e[t],i=e[(t+1)%e.length];if(n.getBoundingClientRect().top<0&&i.getBoundingClientRect().top>=0){volantis.activateNavIndex=t;break}}n(t[volantis.activateNavIndex])}))}document.addEventListener("DOMContentLoaded",(()=>{volantis.requestAnimationFrame(listenSidebarTOC)})),volantis.pjax.push(listenSidebarTOC)</script><script>document.onreadystatechange=function(){if("complete"==document.readyState){const{saveData:e,effectiveType:t}=navigator.connection||navigator.mozConnection||navigator.webkitConnection||{};("none"==getComputedStyle(document.querySelector("#safearea"),null).display||e||/2g/.test(t))&&(document.querySelectorAll(".reveal").forEach((function(e){e.style.opacity="1"})),document.querySelector("#safearea").style.display="block")}}</script><script type="application/ld+json">[{"@context":"http://schema.org","@type":"Organization","name":"汐塔魔法屋","url":"https://blog.sinzmise.top/","logo":{"@type":"ImageObject","url":"https://blog.sinzmise.top/images/siteicon/web-app-manifest-192x192.png","width":192,"height":192}},{"@context":"http://schema.org","@type":"Person","name":"王九弦SZ·Ninty","image":{"@type":"ImageObject","url":"https://blog.sinzmise.top/images/siteicon/web-app-manifest-192x192.png"},"url":"https://blog.sinzmise.top/","sameAs":["https://github.com/SinzMise"],"description":"The Story,The Dream."},{"@context":"http://schema.org","@type":"BreadcrumbList","itemListElement":[{"@type":"ListItem","position":1,"item":{"@id":"https://blog.sinzmise.top/","name":"汐塔魔法屋"}},{"@type":"ListItem","position":2,"item":{"@id":"https://blog.sinzmise.top/categories/站点折腾/","name":"站点折腾"}},{"@type":"ListItem","position":3,"item":{"@id":"https://blog.sinzmise.top/posts/38964/","name":"小康大佬的说说方案 ———— ispeak搭建教程"}}]},{"@context":"http://schema.org","@type":"WebSite","name":"汐塔魔法屋","url":"https://blog.sinzmise.top/","keywords":null,"description":"The Story,The Dream.","author":{"@type":"Person","name":"王九弦SZ·Ninty","image":{"@type":"ImageObject","url":"https://blog.sinzmise.top/images/siteicon/web-app-manifest-192x192.png"},"url":"https://blog.sinzmise.top/","description":"The Story,The Dream."},"publisher":{"@type":"Organization","name":"汐塔魔法屋","url":"https://blog.sinzmise.top/","logo":{"@type":"ImageObject","url":"https://blog.sinzmise.top/images/siteicon/web-app-manifest-192x192.png","width":192,"height":192}},"potentialAction":{"@type":"SearchAction","name":"Site Search","target":{"@type":"EntryPoint","urlTemplate":"https://blog.sinzmise.top?s={search_term_string}"},"query-input":"required name=search_term_string"}},{"@context":"http://schema.org","@type":"BlogPosting","headline":"小康大佬的说说方案 ———— ispeak搭建教程","description":"这篇文章是我之前写过的教程的重写","inLanguage":"zh-CN","mainEntityOfPage":{"@type":"WebPage","@id":"https://blog.sinzmise.top/posts/38964/"},"author":{"@type":"Person","name":"王九弦SZ·Ninty","image":{"@type":"ImageObject","url":"https://blog.sinzmise.top/images/siteicon/web-app-manifest-192x192.png"},"url":"https://blog.sinzmise.top/"},"publisher":{"@type":"Organization","name":"汐塔魔法屋","logo":{"@type":"ImageObject","url":"https://blog.sinzmise.top/images/siteicon/web-app-manifest-192x192.png","width":192,"height":192}},"url":"https://blog.sinzmise.top/posts/38964/","wordCount":61,"datePublished":"2023-01-13T21:01:37.000Z","dateModified":"2024-11-02T08:49:58.797Z","articleSection":"站点折腾","keywords":"站点折腾,页面魔改","image":{"@type":"ImageObject","url":"https://jsd.cdn.storisinz.site/gh/SinzMise/MYPictures@master/20230114/msedge_GVRhG42nuu.1g9uz8t24io0.webp","width":1024,"height":768}}]</script><script src="https://jsd.cdn.storisinz.site/npm/pjax@0.2.8/pjax.min.js"></script><script>var pjax;document.addEventListener("DOMContentLoaded",(function(){pjax=new Pjax({elements:'a[href]:not([href^="#"]):not([href="javascript:void(0)"]):not([pjax-fancybox]):not([onclick="return false;"]):not([onclick="return!1"]):not([target="_blank"]):not([target="view_window"]):not([href$=".xml"])',selectors:["head title","head meta[name=keywords]","head meta[name=description]","#l_cover","#l_main","#pjax-header-nav-list",".pjax","pjax"],cacheBust:!1,timeout:5e3})})),document.addEventListener("pjax:send",(function(e){try{var t=window.location.pathname,n=e.triggerElement.href,a=[""];""!=a[0]&&a.forEach((e=>{-1==t.indexOf(e)&&-1==n.indexOf(e)||(window.location.href=n)}))}catch(e){}volantis.pjax.method.send.start()})),document.addEventListener("pjax:complete",(function(){document.querySelectorAll("script[data-pjax], .pjax-reload script").forEach((e=>{const t=e.text||e.textContent||e.innerHTML||"",n=document.createElement("script");Object.keys(e.attributes).forEach((t=>{n.setAttribute(e.attributes[t].nodeName,e.attributes[t].nodeValue)})),t&&n.appendChild(document.createTextNode(t)),e.parentNode.replaceChild(n,e)})),volantis.pjax.method.complete.start()})),document.addEventListener("pjax:error",(function(e){"pjax"===volantis.debug?(console.error(e),console.log("pjax error: \n"+JSON.stringify(e))):(volantis.pjax.method.error.start(),window.location.href=e.triggerElement.href)}))</script></div><script data-pjax src="https://jsd.cdn.storisinz.site/npm/oh-my-live2d"></script><script>const oml2d=OML2D.loadOml2d({menus:{items:t=>[t[0],t[2],t[3]]},mobileDisplay:!1,models:[{path:"https://files.blog.sinzmise.top/live2d/dujiaoshou_6/dujiaoshou_6.model3.json",mobilePosition:[-10,23],mobileScale:.1,mobileStageStyle:{width:180,height:166},motionPreloadStrategy:"IDLE",position:[-120,-30],scale:.06,stageStyle:{width:250,height:400}},{path:"https://files.blog.sinzmise.top/live2d/dujiaoshou_4/dujiaoshou_4.model3.json",scale:.06,position:[-50,-25],stageStyle:{width:250,height:300},mobileScale:.08,mobilePosition:[0,0],mobileStageStyle:{width:180}}],parentElement:document.body,primaryColor:"var(--primary)",sayHello:!1,tips:{style:{width:230,height:120,left:"calc(50% + 6px)",top:"-100px"},mobileStyle:{width:180,height:80,left:"calc(50% - 30px)",top:"-100px"},idleTips:{interval:15e3,message:function(){return axios.get("https://v1.hitokoto.cn?c=i").then((function(t){return t.data.hitokoto})).catch((function(t){console.error(t)}))}}}})</script></body></html>
1
+ <!DOCTYPE html><html lang="zh-CN"><head hexo-theme="https://github.com/volantis-x/hexo-theme-volantis/#6.0.0-alpha.0"><meta name="generator" content="Hexo 7.3.0"><meta charset="utf-8"><link rel="canonical" href="https://blog.sinzmise.top/posts/38964/"><meta name="renderer" content="webkit"><meta name="force-rendering" content="webkit"><meta http-equiv="X-UA-Compatible" content="IE=Edge,chrome=1"><meta name="HandheldFriendly" content="True"><meta name="apple-mobile-web-app-capable" content="yes"><meta name="viewport" content="width=device-width,initial-scale=1,maximum-scale=5"><meta content="black-translucent" name="apple-mobile-web-app-status-bar-style"><meta content="telephone=no" name="format-detection"><link rel="preload" href="/css/style.css" as="style"><link rel="preload" href="https://jsd.cdn.storisinz.site/npm/volantis-static@0.0.1660614606622/media/fonts/VarelaRound/VarelaRound-Regular.ttf" as="font" type="font/ttf" crossorigin="anonymous"><link rel="preload" href="https://jsd.cdn.storisinz.site/npm/volantis-static@0.0.1660614606622/media/fonts/UbuntuMono/UbuntuMono-Regular.ttf" as="font" type="font/ttf" crossorigin="anonymous"><link rel="alternate" href="/atom.xml" title="汐塔魔法屋" type="application/atom+xml"><title>小康大佬的说说方案 ———— ispeak搭建教程 - 汐塔魔法屋</title><meta name="keywords" content="站点折腾,页面魔改,null"><meta desc name="description" content="这篇文章是我之前写过的教程的重写 - 王九弦SZ·Ninty - 汐塔魔法屋"><meta property="og:type" content="article"><meta property="og:title" content="小康大佬的说说方案 ———— ispeak搭建教程"><meta property="og:url" content="https://blog.sinzmise.top/posts/38964/"><meta property="og:site_name" content="汐塔魔法屋"><meta property="og:description" content="这篇文章是我之前写过的教程的重写"><meta property="og:locale" content="zh_CN"><meta property="og:image" content="https://blog.sinzmise.top/images/siteicon/web-app-manifest-192x192.png"><meta property="article:published_time" content="2023-01-13T21:01:37.000Z"><meta property="article:modified_time" content="2024-11-08T11:09:52.046Z"><meta property="article:author" content="王九弦SZ·Ninty"><meta property="article:tag" content="站点折腾"><meta property="article:tag" content="页面魔改"><meta name="twitter:card" content="summary"><meta name="twitter:image" content="https://blog.sinzmise.top/images/siteicon/web-app-manifest-192x192.png"><style>#safearea{display:none}.fa-duotone.red,.fa-light.red,.fa-regular.red,.fa-solid.red,.fa-thin.red,.fa.red,.fad.red,.fal.red,.far.red,.fas.red,.iziToast>.iziToast-body .iziToast-icon.red{color:#f44336}.fa-duotone.pink,.fa-light.pink,.fa-regular.pink,.fa-solid.pink,.fa-thin.pink,.fa.pink,.fad.pink,.fal.pink,.far.pink,.fas.pink,.iziToast>.iziToast-body .iziToast-icon.pink{color:#e91e63}.fa-duotone.purple,.fa-light.purple,.fa-regular.purple,.fa-solid.purple,.fa-thin.purple,.fa.purple,.fad.purple,.fal.purple,.far.purple,.fas.purple,.iziToast>.iziToast-body .iziToast-icon.purple{color:#9c27b0}.fa-duotone.indigo,.fa-light.indigo,.fa-regular.indigo,.fa-solid.indigo,.fa-thin.indigo,.fa.indigo,.fad.indigo,.fal.indigo,.far.indigo,.fas.indigo,.iziToast>.iziToast-body .iziToast-icon.indigo{color:#3f51b5}.fa-duotone.light-blue,.fa-light.light-blue,.fa-regular.light-blue,.fa-solid.light-blue,.fa-thin.light-blue,.fa.light-blue,.fad.light-blue,.fal.light-blue,.far.light-blue,.fas.light-blue,.iziToast>.iziToast-body .iziToast-icon.light-blue{color:#4ba7ee}.fa-duotone.deep-blue,.fa-light.deep-blue,.fa-regular.deep-blue,.fa-solid.deep-blue,.fa-thin.deep-blue,.fa.deep-blue,.fad.deep-blue,.fal.deep-blue,.far.deep-blue,.fas.deep-blue,.iziToast>.iziToast-body .iziToast-icon.deep-blue{color:#3367d6}.fa-duotone.teal,.fa-light.teal,.fa-regular.teal,.fa-solid.teal,.fa-thin.teal,.fa.teal,.fad.teal,.fal.teal,.far.teal,.fas.teal,.iziToast>.iziToast-body .iziToast-icon.teal{color:#009688}.fa-duotone.light-green,.fa-light.light-green,.fa-regular.light-green,.fa-solid.light-green,.fa-thin.light-green,.fa.light-green,.fad.light-green,.fal.light-green,.far.light-green,.fas.light-green,.iziToast>.iziToast-body .iziToast-icon.light-green{color:#8bc34a}.fa-duotone.orange,.fa-light.orange,.fa-regular.orange,.fa-solid.orange,.fa-thin.orange,.fa.orange,.fad.orange,.fal.orange,.far.orange,.fas.orange,.iziToast>.iziToast-body .iziToast-icon.orange{color:#ff9800}.fa-duotone.deep-orange,.fa-light.deep-orange,.fa-regular.deep-orange,.fa-solid.deep-orange,.fa-thin.deep-orange,.fa.deep-orange,.fad.deep-orange,.fal.deep-orange,.far.deep-orange,.fas.deep-orange,.iziToast>.iziToast-body .iziToast-icon.deep-orange{color:#ff5722}.fa-duotone.brown,.fa-light.brown,.fa-regular.brown,.fa-solid.brown,.fa-thin.brown,.fa.brown,.fad.brown,.fal.brown,.far.brown,.fas.brown,.iziToast>.iziToast-body .iziToast-icon.brown{color:#795548}.fa-duotone.blue-grey,.fa-light.blue-grey,.fa-regular.blue-grey,.fa-solid.blue-grey,.fa-thin.blue-grey,.fa.blue-grey,.fad.blue-grey,.fal.blue-grey,.far.blue-grey,.fas.blue-grey,.iziToast>.iziToast-body .iziToast-icon.blue-grey{color:#607d8b}.fa-duotone.yellow,.fa-light.yellow,.fa-regular.yellow,.fa-solid.yellow,.fa-thin.yellow,.fa.yellow,.fad.yellow,.fal.yellow,.far.yellow,.fas.yellow,.iziToast>.iziToast-body .iziToast-icon.yellow{color:#fcec60}.fa-duotone.TURQUOISE,.fa-light.TURQUOISE,.fa-regular.TURQUOISE,.fa-solid.TURQUOISE,.fa-thin.TURQUOISE,.fa.TURQUOISE,.fad.TURQUOISE,.fal.TURQUOISE,.far.TURQUOISE,.fas.TURQUOISE,.iziToast>.iziToast-body .iziToast-icon.TURQUOISE{color:#1abc9c}.fa-duotone.EMERALD,.fa-light.EMERALD,.fa-regular.EMERALD,.fa-solid.EMERALD,.fa-thin.EMERALD,.fa.EMERALD,.fad.EMERALD,.fal.EMERALD,.far.EMERALD,.fas.EMERALD,.iziToast>.iziToast-body .iziToast-icon.EMERALD{color:#2ecc71}.fa-duotone.PETERRIVE,.fa-light.PETERRIVE,.fa-regular.PETERRIVE,.fa-solid.PETERRIVE,.fa-thin.PETERRIVE,.fa.PETERRIVE,.fad.PETERRIVE,.fal.PETERRIVE,.far.PETERRIVE,.fas.PETERRIVE,.iziToast>.iziToast-body .iziToast-icon.PETERRIVE{color:#3498db}.fa-duotone.AMETHYST,.fa-light.AMETHYST,.fa-regular.AMETHYST,.fa-solid.AMETHYST,.fa-thin.AMETHYST,.fa.AMETHYST,.fad.AMETHYST,.fal.AMETHYST,.far.AMETHYST,.fas.AMETHYST,.iziToast>.iziToast-body .iziToast-icon.AMETHYST{color:#9b59b6}.fa-duotone.WETASPHALT,.fa-light.WETASPHALT,.fa-regular.WETASPHALT,.fa-solid.WETASPHALT,.fa-thin.WETASPHALT,.fa.WETASPHALT,.fad.WETASPHALT,.fal.WETASPHALT,.far.WETASPHALT,.fas.WETASPHALT,.iziToast>.iziToast-body .iziToast-icon.WETASPHALT{color:#34495e}.fa-duotone.GREENSEA,.fa-light.GREENSEA,.fa-regular.GREENSEA,.fa-solid.GREENSEA,.fa-thin.GREENSEA,.fa.GREENSEA,.fad.GREENSEA,.fal.GREENSEA,.far.GREENSEA,.fas.GREENSEA,.iziToast>.iziToast-body .iziToast-icon.GREENSEA{color:#16a085}.fa-duotone.NEPHRITIS,.fa-light.NEPHRITIS,.fa-regular.NEPHRITIS,.fa-solid.NEPHRITIS,.fa-thin.NEPHRITIS,.fa.NEPHRITIS,.fad.NEPHRITIS,.fal.NEPHRITIS,.far.NEPHRITIS,.fas.NEPHRITIS,.iziToast>.iziToast-body .iziToast-icon.NEPHRITIS{color:#27ae60}.fa-duotone.BELIZEHOLE,.fa-light.BELIZEHOLE,.fa-regular.BELIZEHOLE,.fa-solid.BELIZEHOLE,.fa-thin.BELIZEHOLE,.fa.BELIZEHOLE,.fad.BELIZEHOLE,.fal.BELIZEHOLE,.far.BELIZEHOLE,.fas.BELIZEHOLE,.iziToast>.iziToast-body .iziToast-icon.BELIZEHOLE{color:#2980b9}.fa-duotone.WISTERIA,.fa-light.WISTERIA,.fa-regular.WISTERIA,.fa-solid.WISTERIA,.fa-thin.WISTERIA,.fa.WISTERIA,.fad.WISTERIA,.fal.WISTERIA,.far.WISTERIA,.fas.WISTERIA,.iziToast>.iziToast-body .iziToast-icon.WISTERIA{color:#8e44ad}.fa-duotone.MIDNIGHTBLUE,.fa-light.MIDNIGHTBLUE,.fa-regular.MIDNIGHTBLUE,.fa-solid.MIDNIGHTBLUE,.fa-thin.MIDNIGHTBLUE,.fa.MIDNIGHTBLUE,.fad.MIDNIGHTBLUE,.fal.MIDNIGHTBLUE,.far.MIDNIGHTBLUE,.fas.MIDNIGHTBLUE,.iziToast>.iziToast-body .iziToast-icon.MIDNIGHTBLUE{color:#2c3e50}.fa-duotone.SUNFLOWER,.fa-light.SUNFLOWER,.fa-regular.SUNFLOWER,.fa-solid.SUNFLOWER,.fa-thin.SUNFLOWER,.fa.SUNFLOWER,.fad.SUNFLOWER,.fal.SUNFLOWER,.far.SUNFLOWER,.fas.SUNFLOWER,.iziToast>.iziToast-body .iziToast-icon.SUNFLOWER{color:#f1c40f}.fa-duotone.CARROT,.fa-light.CARROT,.fa-regular.CARROT,.fa-solid.CARROT,.fa-thin.CARROT,.fa.CARROT,.fad.CARROT,.fal.CARROT,.far.CARROT,.fas.CARROT,.iziToast>.iziToast-body .iziToast-icon.CARROT{color:#e67e22}.fa-duotone.ALIZARIN,.fa-light.ALIZARIN,.fa-regular.ALIZARIN,.fa-solid.ALIZARIN,.fa-thin.ALIZARIN,.fa.ALIZARIN,.fad.ALIZARIN,.fal.ALIZARIN,.far.ALIZARIN,.fas.ALIZARIN,.iziToast>.iziToast-body .iziToast-icon.ALIZARIN{color:#e74c3c}.fa-duotone.CLOUDS,.fa-light.CLOUDS,.fa-regular.CLOUDS,.fa-solid.CLOUDS,.fa-thin.CLOUDS,.fa.CLOUDS,.fad.CLOUDS,.fal.CLOUDS,.far.CLOUDS,.fas.CLOUDS,.iziToast>.iziToast-body .iziToast-icon.CLOUDS{color:#ecf0f1}.fa-duotone.CONCRETE,.fa-light.CONCRETE,.fa-regular.CONCRETE,.fa-solid.CONCRETE,.fa-thin.CONCRETE,.fa.CONCRETE,.fad.CONCRETE,.fal.CONCRETE,.far.CONCRETE,.fas.CONCRETE,.iziToast>.iziToast-body .iziToast-icon.CONCRETE{color:#95a5a6}.fa-duotone.ORANGE,.fa-light.ORANGE,.fa-regular.ORANGE,.fa-solid.ORANGE,.fa-thin.ORANGE,.fa.ORANGE,.fad.ORANGE,.fal.ORANGE,.far.ORANGE,.fas.ORANGE,.iziToast>.iziToast-body .iziToast-icon.ORANGE{color:#f39c12}.fa-duotone.PUMPKIN,.fa-light.PUMPKIN,.fa-regular.PUMPKIN,.fa-solid.PUMPKIN,.fa-thin.PUMPKIN,.fa.PUMPKIN,.fad.PUMPKIN,.fal.PUMPKIN,.far.PUMPKIN,.fas.PUMPKIN,.iziToast>.iziToast-body .iziToast-icon.PUMPKIN{color:#d35400}.fa-duotone.POMEGRANATE,.fa-light.POMEGRANATE,.fa-regular.POMEGRANATE,.fa-solid.POMEGRANATE,.fa-thin.POMEGRANATE,.fa.POMEGRANATE,.fad.POMEGRANATE,.fal.POMEGRANATE,.far.POMEGRANATE,.fas.POMEGRANATE,.iziToast>.iziToast-body .iziToast-icon.POMEGRANATE{color:#c0392b}.fa-duotone.SILVER,.fa-light.SILVER,.fa-regular.SILVER,.fa-solid.SILVER,.fa-thin.SILVER,.fa.SILVER,.fad.SILVER,.fal.SILVER,.far.SILVER,.fas.SILVER,.iziToast>.iziToast-body .iziToast-icon.SILVER{color:#bdc3c7}.fa-duotone.ASBESTOS,.fa-light.ASBESTOS,.fa-regular.ASBESTOS,.fa-solid.ASBESTOS,.fa-thin.ASBESTOS,.fa.ASBESTOS,.fad.ASBESTOS,.fal.ASBESTOS,.far.ASBESTOS,.fas.ASBESTOS,.iziToast>.iziToast-body .iziToast-icon.ASBESTOS{color:#7f8c8d}.article-title,.md .footer .header,.meta-v3,.new-meta-box,.prev-next,.widget header,details summary{font-family:"Varela Round","PingFang SC","Microsoft YaHei",Helvetica,Arial,Helvetica,monospace}:root{--color-site-body:#f4f4f4;--color-site-bg:#f4f4f4;--color-site-inner:#fff;--color-site-footer:#666;--color-card:#fff;--color-text:#444;--color-block:#f4f4f4;--color-inlinecode:#444;--color-codeblock:#f4f4f4;--color-h1:#3a3a3a;--color-h2:#3a3a3a;--color-h3:#333;--color-h4:#444;--color-h5:#555;--color-h6:#666;--color-p:#444;--color-list:#666;--color-list-hl:#30ad91;--color-meta:#888;--color-read-bkg:#e0d8c8;--color-read-post:#f8f1e2;--color-copyright-bkg:#f5f5f5;--color-white-png:#fff;--color-img-error:#f5f5f5}*{box-sizing:border-box;-webkit-box-sizing:border-box;-moz-box-sizing:border-box;outline:0;margin:0;padding:0}::-webkit-scrollbar{height:4px;width:4px}::-webkit-scrollbar-track-piece{background:0 0}::-webkit-scrollbar-thumb{background:#3dd9b6;cursor:pointer;border-radius:2px;-webkit-border-radius:2px}::-webkit-scrollbar-thumb:hover{background:#ff5722}html{color:var(--color-text);width:100%;height:100%;font-family:UbuntuMono,"Varela Round","PingFang SC","Microsoft YaHei",Helvetica,Arial,Menlo,Monaco,monospace,sans-serif;font-size:16px}html>::-webkit-scrollbar{height:4px;width:4px}html>::-webkit-scrollbar-track-piece{background:0 0}html>::-webkit-scrollbar-thumb{background:#3dd9b6;cursor:pointer;border-radius:2px;-webkit-border-radius:2px}html>::-webkit-scrollbar-thumb:hover{background:#ff5722}body{background-color:var(--color-site-body);text-rendering:optimizelegibility;-webkit-tap-highlight-color:transparent;line-height:1.6;-webkit-text-size-adjust:100%;-ms-text-size-adjust:100%}body.modal-active{overflow:hidden}@media screen and (max-width:680px){body.modal-active{position:fixed;top:0;right:0;bottom:0;left:0}}a{color:#2092ec;cursor:pointer;text-decoration:none;transition:all .28s ease;-webkit-transition:all .28s ease;-khtml-transition:all 0.28s ease;-moz-transition:all .28s ease;-o-transition:all .28s ease;-ms-transition:all .28s ease}a:active,a:hover{outline:0}ol,ul{padding-left:0}ol li,ul li{list-style:none}header{display:block}img{border:0;background:0 0;max-width:100%}svg:not(:root){overflow:hidden}hr{-moz-box-sizing:content-box;box-sizing:content-box;-webkit-box-sizing:content-box;-moz-box-sizing:content-box;height:0;border:0;border-radius:1px;-webkit-border-radius:1px;border-bottom:1px solid rgba(68,68,68,.1)}article hr{background-image:none;height:2em;border:none;margin:1em 0 1em;text-align:center}article hr:after{content:"···";letter-spacing:2em;padding-left:2em;font-weight:700}button,input{color:inherit;font:inherit;margin:0}button{overflow:visible;text-transform:none;-webkit-appearance:button;cursor:pointer}@supports (backdrop-filter:blur(20px)){.blur{background:rgba(255,255,255,.9)!important;backdrop-filter:saturate(200%) blur(20px)}}@supports (backdrop-filter:blur(20px)){.blur#comments{backdrop-filter:unset}}.shadow{box-shadow:0 1px 2px 0 rgba(0,0,0,.1);-webkit-box-shadow:0 1px 2px 0 rgba(0,0,0,.1)}.shadow.floatable{transition:all .28s ease;-webkit-transition:all .28s ease;-khtml-transition:all 0.28s ease;-moz-transition:all .28s ease;-o-transition:all .28s ease;-ms-transition:all .28s ease}.shadow.floatable:hover{box-shadow:0 2px 4px 0 rgba(0,0,0,.1),0 4px 8px 0 rgba(0,0,0,.1),0 8px 16px 0 rgba(0,0,0,.1);-webkit-box-shadow:0 2px 4px 0 rgba(0,0,0,.1),0 4px 8px 0 rgba(0,0,0,.1),0 8px 16px 0 rgba(0,0,0,.1)}#l_cover{min-height:64px}.cover-wrapper{top:0;left:0;max-width:100%;height:100vh;display:flex;flex-wrap:nowrap;-webkit-flex-wrap:nowrap;-khtml-flex-wrap:nowrap;-moz-flex-wrap:nowrap;-o-flex-wrap:nowrap;-ms-flex-wrap:nowrap;-webkit-box-direction:normal;-moz-box-direction:normal;-webkit-box-orient:vertical;-moz-box-orient:vertical;-webkit-flex-direction:column;-ms-flex-direction:column;flex-direction:column;align-items:center;align-self:center;align-content:center;color:var(--color-site-inner);padding:0 16px;user-select:none;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;position:relative;overflow:hidden;margin-bottom:-100px}.cover-wrapper .cover-bg{position:absolute;width:100%;height:100%;background-position:center;background-size:cover;-webkit-background-size:cover;-moz-background-size:cover}.cover-wrapper .cover-bg.lazyload:not(.loaded){opacity:0;-webkit-opacity:0;-moz-opacity:0}.cover-wrapper .cover-bg.lazyload.loaded{animation-delay:0s;animation-duration:.5s;animation-fill-mode:forwards;animation-timing-function:ease-out;animation-name:fadeIn}@-moz-keyframes fadeIn{0%{opacity:0;-webkit-opacity:0;-moz-opacity:0;filter:blur(12px);transform:scale(1.02);-webkit-transform:scale(1.02);-khtml-transform:scale(1.02);-moz-transform:scale(1.02);-o-transform:scale(1.02);-ms-transform:scale(1.02)}100%{opacity:1;-webkit-opacity:1;-moz-opacity:1}}@-webkit-keyframes fadeIn{0%{opacity:0;-webkit-opacity:0;-moz-opacity:0;filter:blur(12px);transform:scale(1.02);-webkit-transform:scale(1.02);-khtml-transform:scale(1.02);-moz-transform:scale(1.02);-o-transform:scale(1.02);-ms-transform:scale(1.02)}100%{opacity:1;-webkit-opacity:1;-moz-opacity:1}}@-o-keyframes fadeIn{0%{opacity:0;-webkit-opacity:0;-moz-opacity:0;filter:blur(12px);transform:scale(1.02);-webkit-transform:scale(1.02);-khtml-transform:scale(1.02);-moz-transform:scale(1.02);-o-transform:scale(1.02);-ms-transform:scale(1.02)}100%{opacity:1;-webkit-opacity:1;-moz-opacity:1}}@keyframes fadeIn{0%{opacity:0;-webkit-opacity:0;-moz-opacity:0;filter:blur(12px);transform:scale(1.02);-webkit-transform:scale(1.02);-khtml-transform:scale(1.02);-moz-transform:scale(1.02);-o-transform:scale(1.02);-ms-transform:scale(1.02)}100%{opacity:1;-webkit-opacity:1;-moz-opacity:1}}.cover-wrapper .cover-body{z-index:1;position:relative;width:100%;height:100%}.cover-wrapper#full{height:calc(100vh + 100px);padding-bottom:100px}.cover-wrapper#half{max-height:640px;min-height:460px;height:calc(36vh - 64px + 200px)}.cover-wrapper #scroll-down{width:100%;height:64px;position:absolute;bottom:100px;text-align:center;cursor:pointer}.cover-wrapper #scroll-down .scroll-down-effects{color:#fff;font-size:24px;line-height:64px;position:absolute;width:24px;left:calc(50% - 12px);text-shadow:0 1px 2px rgba(0,0,0,.1);animation:scroll-down-effect 1.5s infinite;-webkit-animation:scroll-down-effect 1.5s infinite;-khtml-animation:scroll-down-effect 1.5s infinite;-moz-animation:scroll-down-effect 1.5s infinite;-o-animation:scroll-down-effect 1.5s infinite;-ms-animation:scroll-down-effect 1.5s infinite}@-moz-keyframes scroll-down-effect{0%{top:0;opacity:1;-webkit-opacity:1;-moz-opacity:1}50%{top:-16px;opacity:.4;-webkit-opacity:0.4;-moz-opacity:0.4}100%{top:0;opacity:1;-webkit-opacity:1;-moz-opacity:1}}@-webkit-keyframes scroll-down-effect{0%{top:0;opacity:1;-webkit-opacity:1;-moz-opacity:1}50%{top:-16px;opacity:.4;-webkit-opacity:0.4;-moz-opacity:0.4}100%{top:0;opacity:1;-webkit-opacity:1;-moz-opacity:1}}@-o-keyframes scroll-down-effect{0%{top:0;opacity:1;-webkit-opacity:1;-moz-opacity:1}50%{top:-16px;opacity:.4;-webkit-opacity:0.4;-moz-opacity:0.4}100%{top:0;opacity:1;-webkit-opacity:1;-moz-opacity:1}}@keyframes scroll-down-effect{0%{top:0;opacity:1;-webkit-opacity:1;-moz-opacity:1}50%{top:-16px;opacity:.4;-webkit-opacity:0.4;-moz-opacity:0.4}100%{top:0;opacity:1;-webkit-opacity:1;-moz-opacity:1}}.cover-wrapper .cover-body{margin-top:64px;margin-bottom:120px}.cover-wrapper .cover-body,.cover-wrapper .cover-body .bottom,.cover-wrapper .cover-body .top{display:flex;-webkit-box-direction:normal;-moz-box-direction:normal;-webkit-box-orient:vertical;-moz-box-orient:vertical;-webkit-flex-direction:column;-ms-flex-direction:column;flex-direction:column;align-items:center;justify-content:center;-webkit-justify-content:center;-khtml-justify-content:center;-moz-justify-content:center;-o-justify-content:center;-ms-justify-content:center;max-width:100%}.cover-wrapper .cover-body .bottom{margin-top:32px}.cover-wrapper .cover-body .title{font-family:"Varela Round","PingFang SC","Microsoft YaHei",Helvetica,Arial,Helvetica,monospace;font-size:3.125rem;text-shadow:0 1px 2px rgba(0,0,0,.1);text-align:center}.cover-wrapper .cover-body .subtitle{font-size:16px}.cover-wrapper .cover-body .logo{max-height:120px;max-width:calc(100% - 4 * 16px)}@media screen and (min-height:1024px){.cover-wrapper .cover-body .title{font-size:3rem}.cover-wrapper .cover-body .subtitle{font-size:.875rem}.cover-wrapper .cover-body .logo{max-height:150px}}.cover-wrapper .cover-body .m_search{position:relative;max-width:calc(100% - 16px);width:320px;vertical-align:middle}.cover-wrapper .cover-body .m_search .form{position:relative;display:block;width:100%}.cover-wrapper .cover-body .m_search .icon,.cover-wrapper .cover-body .m_search .input{transition:all .28s ease;-webkit-transition:all .28s ease;-khtml-transition:all 0.28s ease;-moz-transition:all .28s ease;-o-transition:all .28s ease;-ms-transition:all .28s ease}.cover-wrapper .cover-body .m_search .icon{position:absolute;display:block;line-height:2.5rem;width:32px;top:0;left:5px;color:rgba(68,68,68,.75)}.cover-wrapper .cover-body .m_search .input{display:block;height:2.5rem;width:100%;box-shadow:none;-webkit-box-shadow:none;box-sizing:border-box;-webkit-box-sizing:border-box;-moz-box-sizing:border-box;font-size:.875rem;-webkit-appearance:none;padding-left:36px;border-radius:1.4rem;-webkit-border-radius:1.4rem;background:rgba(255,255,255,.6);backdrop-filter:blur(10px);border:none;color:var(--color-text)}@media screen and (max-width:500px){.cover-wrapper .cover-body .m_search .input{padding-left:36px}}.cover-wrapper .cover-body .m_search .input:hover{background:rgba(255,255,255,.8)}.cover-wrapper .cover-body .m_search .input:focus{background:#fff}.cover-wrapper .list-h{display:flex;-webkit-box-direction:normal;-moz-box-direction:normal;-webkit-box-orient:horizontal;-moz-box-orient:horizontal;-webkit-flex-direction:row;-ms-flex-direction:row;flex-direction:row;flex-wrap:wrap;-webkit-flex-wrap:wrap;-khtml-flex-wrap:wrap;-moz-flex-wrap:wrap;-o-flex-wrap:wrap;-ms-flex-wrap:wrap;align-items:stretch;border-radius:4px;-webkit-border-radius:4px;user-select:none;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none}.cover-wrapper .list-h a{-webkit-box-flex:1;-moz-box-flex:1;-webkit-flex:1 0;-ms-flex:1 0;flex:1 0;display:flex;font-weight:600}.cover-wrapper .list-h a img{display:block;border-radius:2px;-webkit-border-radius:2px;margin:4px;min-width:40px;max-width:44px}@media screen and (max-width:768px){.cover-wrapper .list-h a img{min-width:36px;max-width:40px}}@media screen and (max-width:500px){.cover-wrapper .list-h a img{margin:2px 4px;min-width:32px;max-width:36px}}@media screen and (max-width:375px){.cover-wrapper .list-h a img{min-width:28px;max-width:32px}}.cover-wrapper{max-width:100%}.cover-wrapper.search .bottom .menu{margin-top:8px}.cover-wrapper.search .bottom .menu .list-h a{white-space:nowrap;-webkit-box-direction:normal;-moz-box-direction:normal;-webkit-box-orient:horizontal;-moz-box-orient:horizontal;-webkit-flex-direction:row;-ms-flex-direction:row;flex-direction:row;align-items:baseline;padding:2px;margin:4px;color:var(--color-site-inner);opacity:.75;-webkit-opacity:0.75;-moz-opacity:0.75;text-shadow:0 1px 2px rgba(0,0,0,.05);border-bottom:2px solid transparent}.cover-wrapper.search .bottom .menu .list-h a i{margin-right:4px}.cover-wrapper.search .bottom .menu .list-h a p{font-size:.9375rem}.cover-wrapper.search .bottom .menu .list-h a.active,.cover-wrapper.search .bottom .menu .list-h a:active,.cover-wrapper.search .bottom .menu .list-h a:hover{opacity:1;-webkit-opacity:1;-moz-opacity:1;border-bottom:2px solid var(--color-site-inner)}@font-face{font-family:UbuntuMono;src:url("https://jsd.cdn.storisinz.site/npm/volantis-static@0.0.1660614606622/media/fonts/UbuntuMono/UbuntuMono-Regular.ttf");font-weight:'normal';font-style:'normal';font-display:swap}@font-face{font-family:'Varela Round';src:url("https://jsd.cdn.storisinz.site/npm/volantis-static@0.0.1660614606622/media/fonts/VarelaRound/VarelaRound-Regular.ttf");font-weight:'normal';font-style:'normal';font-display:swap}.l_header{position:fixed;z-index:1000;top:0;width:100%;height:64px;background:var(--color-card);box-shadow:0 1px 2px 0 rgba(0,0,0,.1);-webkit-box-shadow:0 1px 2px 0 rgba(0,0,0,.1)}.l_header.auto{transition:opacity .4s ease;-webkit-transition:opacity .4s ease;-khtml-transition:opacity 0.4s ease;-moz-transition:opacity .4s ease;-o-transition:opacity .4s ease;-ms-transition:opacity .4s ease;visibility:hidden}.l_header.auto.showed{opacity:1!important;-webkit-opacity:1!important;-moz-opacity:1!important;visibility:visible}.l_header .container{margin-left:16px;margin-right:16px}.l_header #wrapper{height:100%;user-select:none;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none}.l_header #wrapper .nav-main,.l_header #wrapper .nav-sub{display:flex;flex-wrap:nowrap;-webkit-flex-wrap:nowrap;-khtml-flex-wrap:nowrap;-moz-flex-wrap:nowrap;-o-flex-wrap:nowrap;-ms-flex-wrap:nowrap;justify-content:space-between;-webkit-justify-content:space-between;-khtml-justify-content:space-between;-moz-justify-content:space-between;-o-justify-content:space-between;-ms-justify-content:space-between;align-items:center}.l_header #wrapper .nav-main{transition:all .28s ease;-webkit-transition:all .28s ease;-khtml-transition:all 0.28s ease;-moz-transition:all .28s ease;-o-transition:all .28s ease;-ms-transition:all .28s ease}.l_header #wrapper.sub .nav-main{transform:translateY(-64px);-webkit-transform:translateY(-64px);-khtml-transform:translateY(-64px);-moz-transform:translateY(-64px);-o-transform:translateY(-64px);-ms-transform:translateY(-64px)}.l_header #wrapper .nav-sub{transition:all .28s ease;-webkit-transition:all .28s ease;-khtml-transition:all 0.28s ease;-moz-transition:all .28s ease;-o-transition:all .28s ease;-ms-transition:all .28s ease;opacity:0;-webkit-opacity:0;-moz-opacity:0;height:64px;width:calc(100% - 2 * 16px);position:absolute}.l_header #wrapper .nav-sub ::-webkit-scrollbar{display:none}@media screen and (min-width:2048px){.l_header #wrapper .nav-sub{max-width:55vw;margin:auto}}.l_header #wrapper.sub .nav-sub{opacity:1;-webkit-opacity:1;-moz-opacity:1}.l_header #wrapper .title{position:relative;color:var(--color-text);padding-left:24px;max-height:64px}.l_header #wrapper .nav-main .title{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;flex-shrink:0;line-height:64px;padding:0 8px;font-size:1.25rem;font-family:"Varela Round","PingFang SC","Microsoft YaHei",Helvetica,Arial,Helvetica,monospace}.l_header #wrapper .nav-main .title img{height:64px;padding:8px}.l_header .nav-sub{max-width:1080px;margin:auto}.l_header .nav-sub .title{font-weight:700;font-family:UbuntuMono,"Varela Round","PingFang SC","Microsoft YaHei",Helvetica,Arial,Menlo,Monaco,monospace,sans-serif;line-height:1.2;max-height:64px;white-space:normal;flex-shrink:1}.l_header .switcher{display:none;line-height:64px;align-items:center}.l_header .switcher .s-toc{display:none}@media screen and (max-width:768px){.l_header .switcher .s-toc{display:flex}}.l_header .switcher>li{height:48px;transition:all .28s ease;-webkit-transition:all .28s ease;-khtml-transition:all 0.28s ease;-moz-transition:all .28s ease;-o-transition:all .28s ease;-ms-transition:all .28s ease;margin:2px}@media screen and (max-width:500px){.l_header .switcher>li{margin:0 1px;height:48px}}.l_header .switcher>li>a{display:flex;justify-content:center;-webkit-justify-content:center;-khtml-justify-content:center;-moz-justify-content:center;-o-justify-content:center;-ms-justify-content:center;align-items:center;width:48px;height:48px;padding:.85em 1.1em;border-radius:100px;-webkit-border-radius:100px;border:none;transition:all .28s ease;-webkit-transition:all .28s ease;-khtml-transition:all 0.28s ease;-moz-transition:all .28s ease;-o-transition:all .28s ease;-ms-transition:all .28s ease;color:#3dd9b6}.l_header .switcher>li>a:hover{border:none}.l_header .switcher>li>a.active,.l_header .switcher>li>a:active{border:none;background:var(--color-site-bg)}@media screen and (max-width:500px){.l_header .switcher>li>a{width:36px;height:48px}}.l_header .nav-sub .switcher{display:flex}.l_header .m_search{display:flex;height:64px;width:240px;transition:all .28s ease;-webkit-transition:all .28s ease;-khtml-transition:all 0.28s ease;-moz-transition:all .28s ease;-o-transition:all .28s ease;-ms-transition:all .28s ease}@media screen and (max-width:1024px){.l_header .m_search{width:44px;min-width:44px}.l_header .m_search input::placeholder{opacity:0;-webkit-opacity:0;-moz-opacity:0}.l_header .m_search:hover{width:240px}.l_header .m_search:hover input::placeholder{opacity:1;-webkit-opacity:1;-moz-opacity:1}}@media screen and (min-width:500px){.l_header .m_search:hover .input{width:100%}.l_header .m_search:hover .input::placeholder{opacity:1;-webkit-opacity:1;-moz-opacity:1}}@media screen and (max-width:500px){.l_header .m_search{min-width:0}.l_header .m_search input::placeholder{opacity:1;-webkit-opacity:1;-moz-opacity:1}}.l_header .m_search .form{position:relative;display:flex;width:100%;align-items:center}.l_header .m_search .icon{position:absolute;width:36px;left:5px;color:var(--color-meta)}@media screen and (max-width:500px){.l_header .m_search .icon{display:none}}.l_header .m_search .input{display:block;padding-top:8px;padding-bottom:8px;line-height:1.3;width:100%;color:var(--color-text);background:#fafafa;box-shadow:none;-webkit-box-shadow:none;box-sizing:border-box;-webkit-box-sizing:border-box;-moz-box-sizing:border-box;padding-left:40px;font-size:.875rem;border-radius:8px;-webkit-border-radius:8px;border:none;transition:all .28s ease;-webkit-transition:all .28s ease;-khtml-transition:all 0.28s ease;-moz-transition:all .28s ease;-o-transition:all .28s ease;-ms-transition:all .28s ease}@media screen and (min-width:500px){.l_header .m_search .input:focus{box-shadow:0 4px 8px 0 rgba(0,0,0,.1);-webkit-box-shadow:0 4px 8px 0 rgba(0,0,0,.1)}}@media screen and (max-width:500px){.l_header .m_search .input{background:var(--color-block);padding-left:8px;border:none}.l_header .m_search .input:focus,.l_header .m_search .input:hover{border:none}}@media (max-width:500px){.l_header .m_search{left:0;width:0;overflow:hidden;position:absolute;background:#fff;transition:all .28s ease;-webkit-transition:all .28s ease;-khtml-transition:all 0.28s ease;-moz-transition:all .28s ease;-o-transition:all .28s ease;-ms-transition:all .28s ease}.l_header .m_search .input{border-radius:32px;-webkit-border-radius:32px;margin-left:16px;padding-left:16px}.l_header.z_search-open .m_search{width:100%}.l_header.z_search-open .m_search .input{width:calc(100% - 120px)}}ul.list-v li:hover>ul.list-v,ul.m-pc li:hover>ul.list-v{display:block}ul.nav-list-h{display:flex;align-items:stretch}ul.nav-list-h>li{position:relative;justify-content:center;-webkit-justify-content:center;-khtml-justify-content:center;-moz-justify-content:center;-o-justify-content:center;-ms-justify-content:center;height:100%;line-height:2.4;border-radius:4px;-webkit-border-radius:4px}ul.nav-list-h>li>a{-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}ul.nav-list-h>li>a span{font-weight:600}ul.list-v{z-index:1;display:none;position:absolute;background:var(--color-card);box-shadow:0 2px 4px 0 rgba(0,0,0,.08),0 4px 8px 0 rgba(0,0,0,.08),0 8px 16px 0 rgba(0,0,0,.08);-webkit-box-shadow:0 2px 4px 0 rgba(0,0,0,.08),0 4px 8px 0 rgba(0,0,0,.08),0 8px 16px 0 rgba(0,0,0,.08);margin-top:-6px;border-radius:4px;-webkit-border-radius:4px;padding:8px 0}ul.list-v.show{display:block}ul.list-v hr{margin-top:8px;margin-bottom:8px}ul.list-v>li{white-space:nowrap;word-break:keep-all}ul.list-v>li.header{font-size:.78125rem;font-weight:700;line-height:2em;color:var(--color-meta);margin:8px 16px 4px}ul.list-v>li.header i{margin-right:8px}ul.list-v>li ul{margin-left:0;display:none;margin-top:-40px}ul.list-v .aplayer-container{min-height:64px;padding:6px 16px}ul.list-v>li>a{transition:all .28s ease;-webkit-transition:all .28s ease;-khtml-transition:all 0.28s ease;-moz-transition:all .28s ease;-o-transition:all .28s ease;-ms-transition:all .28s ease;display:block;color:var(--color-list);font-size:.875rem;line-height:36px;padding:0 20px 0 16px;text-overflow:ellipsis;margin:0 4px;border-radius:4px;-webkit-border-radius:4px}@media screen and (max-width:1024px){ul.list-v>li>a{line-height:40px}}ul.list-v>li>a>i{margin-right:8px}ul.list-v>li>a.active,ul.list-v>li>a:active{color:var(--color-list-hl)}ul.list-v>li>a:hover{color:var(--color-list-hl);background:var(--color-site-bg)}.l_header .menu>ul>li>a{display:block;padding:0 8px;display:flex}.l_header .menu>ul>li>a .icon{width:16px;margin-right:6px}.l_header .menu>ul>li>a .icon i{display:inline-block}.l_header .menu>ul>li>ul .icon{width:16px;margin-right:2px}.l_header .menu>ul>li>ul .icon i{display:inline-block}.l_header ul.nav-list-h>li{color:var(--color-list);line-height:64px}.l_header ul.nav-list-h>li>a{max-height:64px;overflow:hidden;color:inherit}.l_header ul.nav-list-h>li>a.active span,.l_header ul.nav-list-h>li>a:active span{color:#3dd9b6}.l_header ul.nav-list-h>li:hover>a{color:var(--color-list-hl)}.l_header ul.nav-list-h>li i.music{animation:rotate-effect 1.5s linear infinite;-webkit-animation:rotate-effect 1.5s linear infinite;-khtml-animation:rotate-effect 1.5s linear infinite;-moz-animation:rotate-effect 1.5s linear infinite;-o-animation:rotate-effect 1.5s linear infinite;-ms-animation:rotate-effect 1.5s linear infinite}@-moz-keyframes rotate-effect{0%{transform:rotate(0);-webkit-transform:rotate(0);-khtml-transform:rotate(0);-moz-transform:rotate(0);-o-transform:rotate(0);-ms-transform:rotate(0)}25%{transform:rotate(90deg);-webkit-transform:rotate(90deg);-khtml-transform:rotate(90deg);-moz-transform:rotate(90deg);-o-transform:rotate(90deg);-ms-transform:rotate(90deg)}50%{transform:rotate(180deg);-webkit-transform:rotate(180deg);-khtml-transform:rotate(180deg);-moz-transform:rotate(180deg);-o-transform:rotate(180deg);-ms-transform:rotate(180deg)}75%{transform:rotate(270deg);-webkit-transform:rotate(270deg);-khtml-transform:rotate(270deg);-moz-transform:rotate(270deg);-o-transform:rotate(270deg);-ms-transform:rotate(270deg)}100%{transform:rotate(360deg);-webkit-transform:rotate(360deg);-khtml-transform:rotate(360deg);-moz-transform:rotate(360deg);-o-transform:rotate(360deg);-ms-transform:rotate(360deg)}}@-webkit-keyframes rotate-effect{0%{transform:rotate(0);-webkit-transform:rotate(0);-khtml-transform:rotate(0);-moz-transform:rotate(0);-o-transform:rotate(0);-ms-transform:rotate(0)}25%{transform:rotate(90deg);-webkit-transform:rotate(90deg);-khtml-transform:rotate(90deg);-moz-transform:rotate(90deg);-o-transform:rotate(90deg);-ms-transform:rotate(90deg)}50%{transform:rotate(180deg);-webkit-transform:rotate(180deg);-khtml-transform:rotate(180deg);-moz-transform:rotate(180deg);-o-transform:rotate(180deg);-ms-transform:rotate(180deg)}75%{transform:rotate(270deg);-webkit-transform:rotate(270deg);-khtml-transform:rotate(270deg);-moz-transform:rotate(270deg);-o-transform:rotate(270deg);-ms-transform:rotate(270deg)}100%{transform:rotate(360deg);-webkit-transform:rotate(360deg);-khtml-transform:rotate(360deg);-moz-transform:rotate(360deg);-o-transform:rotate(360deg);-ms-transform:rotate(360deg)}}@-o-keyframes rotate-effect{0%{transform:rotate(0);-webkit-transform:rotate(0);-khtml-transform:rotate(0);-moz-transform:rotate(0);-o-transform:rotate(0);-ms-transform:rotate(0)}25%{transform:rotate(90deg);-webkit-transform:rotate(90deg);-khtml-transform:rotate(90deg);-moz-transform:rotate(90deg);-o-transform:rotate(90deg);-ms-transform:rotate(90deg)}50%{transform:rotate(180deg);-webkit-transform:rotate(180deg);-khtml-transform:rotate(180deg);-moz-transform:rotate(180deg);-o-transform:rotate(180deg);-ms-transform:rotate(180deg)}75%{transform:rotate(270deg);-webkit-transform:rotate(270deg);-khtml-transform:rotate(270deg);-moz-transform:rotate(270deg);-o-transform:rotate(270deg);-ms-transform:rotate(270deg)}100%{transform:rotate(360deg);-webkit-transform:rotate(360deg);-khtml-transform:rotate(360deg);-moz-transform:rotate(360deg);-o-transform:rotate(360deg);-ms-transform:rotate(360deg)}}@keyframes rotate-effect{0%{transform:rotate(0);-webkit-transform:rotate(0);-khtml-transform:rotate(0);-moz-transform:rotate(0);-o-transform:rotate(0);-ms-transform:rotate(0)}25%{transform:rotate(90deg);-webkit-transform:rotate(90deg);-khtml-transform:rotate(90deg);-moz-transform:rotate(90deg);-o-transform:rotate(90deg);-ms-transform:rotate(90deg)}50%{transform:rotate(180deg);-webkit-transform:rotate(180deg);-khtml-transform:rotate(180deg);-moz-transform:rotate(180deg);-o-transform:rotate(180deg);-ms-transform:rotate(180deg)}75%{transform:rotate(270deg);-webkit-transform:rotate(270deg);-khtml-transform:rotate(270deg);-moz-transform:rotate(270deg);-o-transform:rotate(270deg);-ms-transform:rotate(270deg)}100%{transform:rotate(360deg);-webkit-transform:rotate(360deg);-khtml-transform:rotate(360deg);-moz-transform:rotate(360deg);-o-transform:rotate(360deg);-ms-transform:rotate(360deg)}}.menu-phone li ul.list-v{right:calc(100% - .5 * 16px)}.menu-phone li ul.list-v ul{right:calc(100% - .5 * 16px)}#wrapper{max-width:1080px;margin:auto}@media screen and (min-width:2048px){#wrapper{max-width:55vw}}#wrapper .menu{-webkit-box-flex:1;-moz-box-flex:1;-webkit-flex:1 1;-ms-flex:1 1;flex:1 1;margin:0 16px 0 0}#wrapper .menu .list-v ul{left:calc(100% - .5 * 16px)}.menu-phone{display:none;margin-top:16px;right:8px;transition:all .28s ease;-webkit-transition:all .28s ease;-khtml-transition:all 0.28s ease;-moz-transition:all .28s ease;-o-transition:all .28s ease;-ms-transition:all .28s ease}.menu-phone ul{right:calc(100% - .5 * 16px)}@media screen and (max-width:500px){.menu-phone{display:block}}.l_header{max-width:65vw;left:calc((100% - 65vw) * .5);border-bottom-left-radius:8px;border-bottom-right-radius:8px}@media screen and (max-width:2048px){.l_header{max-width:1112px;left:calc((100% - 1112px) * .5)}}@media screen and (max-width:1112px){.l_header{left:0;border-radius:0;-webkit-border-radius:0;max-width:100%}}@media screen and (max-width:500px){.l_header .container{margin-left:0;margin-right:0}.l_header #wrapper .nav-main .title{padding-left:16px;padding-right:16px}.l_header #wrapper .nav-sub{width:100%}.l_header #wrapper .nav-sub .title{overflow-y:scroll;margin-top:2px;padding:8px 16px}.l_header #wrapper .switcher{display:flex;margin-right:8px;height:64px}.l_header .menu{display:none}}@media screen and (max-width:500px){.list-v li{max-width:270px}}@media screen and (min-width:768px){#l_cover,#l_header{display:none}}#u-search{display:none;position:fixed;top:0;left:0;width:100%;height:100%;padding:60px 20px;z-index:1001}@media screen and (max-width:680px){#u-search{padding:0}}</style><link rel="stylesheet" href="/css/style.css" media="print" onload='this.media="all",this.onload=null'><noscript><link rel="stylesheet" href="/css/style.css"></noscript><script>document.addEventListener("error",(function(t){const a=t.target,e=t.target.parentElement,r=e.classList.toString(),s=e.parentElement.classList.toString();"img"===a.tagName.toLowerCase()&&(a.classList.add("fix-cursor-default","error"),"fancybox"===r&&"fancybox"===s?(e.parentElement.classList.add("hideFancybox"),e.parentElement.classList.remove("fancybox"),e.classList.remove("fancybox")):"img-bg"===r&&"img-wrap"===s?e.parentElement.classList.add("hideFancybox"):"author"===r?e.parentElement.classList.add("fix-author-imgError"):-1!=r.indexOf("tk-avatar")&&e.parentElement.classList.add("fix-avatar-imgError"))}),!0)</script><script>window.MSInputMethodContext&&document.documentMode&&document.write('<style>html{overflow-x: hidden !important;overflow-y: hidden !important;}.kill-ie{text-align:center;height: 100%;margin-top: 15%;margin-bottom: 5500%;}.kill-t{font-size: 2rem;}.kill-c{font-size: 1.2rem;}#l_header,#l_body{display: none;}</style><div class="kill-ie"><span class="kill-t"><b>抱歉，您的浏览器无法访问本站</b></span><br/><span class="kill-c">微软已经于2016年终止了对 Internet Explorer (IE) 10 及更早版本的支持，<br/>继续使用存在极大的安全隐患，请使用当代主流的浏览器进行访问。</span><br/><a target="_blank" rel="noopener" href="https://blogs.windows.com/windowsexperience/2021/05/19/the-future-of-internet-explorer-on-windows-10-is-in-microsoft-edge/"><strong>了解详情 ></strong></a></div>')</script><noscript><style>html{overflow-x:hidden!important;overflow-y:hidden!important}.kill-noscript{text-align:center;height:100%;margin-top:15%;margin-bottom:5500%}.kill-t{font-size:2rem}.kill-c{font-size:1.2rem}#l_body,#l_header{display:none}</style><div class="kill-noscript"> <span class="kill-t"><b>抱歉，您的浏览器无法访问本站</b></span><br> <span class="kill-c">本页面需要浏览器支持（启用）JavaScript</span><br> <a target="_blank" rel="noopener" href="https://www.baidu.com/s?wd=启用JavaScript"><strong>了解详情 ></strong></a></div></noscript><script>function volantisEventListener(e,t,n){this.type=e,this.f=t,this.ele=n}function volantisDom(e){return e||(e=document.createElement("div")),this.ele=e,this.ele.find=e=>{let t=this.ele.querySelector(e);if(t)return new volantisDom(t)},this.ele.hasClass=e=>this.ele.className.match(new RegExp("(\\s|^)"+e+"(\\s|$)")),this.ele.addClass=e=>(this.ele.classList.add(e),this.ele),this.ele.removeClass=e=>(this.ele.classList.remove(e),this.ele),this.ele.toggleClass=e=>(this.ele.hasClass(e)?this.ele.removeClass(e):this.ele.addClass(e),this.ele),this.ele.on=(e,t,n=1)=>(this.ele.addEventListener(e,t,!1),n&&volantis.EventListener.list.push(new volantisEventListener(e,t,this.ele)),this.ele),this.ele.click=(e,t)=>(this.ele.on("click",e,t),this.ele),this.ele.scroll=(e,t)=>(this.ele.on("scroll",e,t),this.ele),this.ele.html=e=>(this.ele.innerHTML=e,this.ele),this.ele.hide=e=>(this.ele.style.display="none",this.ele),this.ele.show=e=>(this.ele.style.display="block",this.ele),this.ele}function RunItem(){function e(e,t){this.name=t||e.name,this.run=()=>{try{e()}catch(e){console.log(e)}}}this.list=[],this.start=()=>{for(var e=0;e<this.list.length;e++)this.list[e].run()},this.push=(t,n,s=!0)=>{let o=t;s&&(o=()=>{volantis.requestAnimationFrame(t)});var l=new e(o,n);this.list.push(l)},this.remove=e=>{for(let t=0;t<this.list.length;t++){this.list[t].name==e&&this.list.splice(t,1)}}}function errorImgAvatar(e){e.src="https://jsd.cdn.storisinz.site/npm/volantis-static@0.0.1660614606622/media/placeholder/avatar/round/3442075.svg",e.onerror=null}function errorImgCover(e){e.src="https://jsd.cdn.storisinz.site/npm/volantis-static@0.0.1660614606622/media/placeholder/cover/76b86c0226ffd.svg",e.onerror=null}window.volantis={},volantis.debug="env",volantis.dom={},volantis.EventListener={},volantis.EventListener.list=[],volantis.EventListener.remove=()=>{volantis.EventListener.list.forEach((function(e){e.ele.removeEventListener(e.type,e.f,!1)})),volantis.EventListener.list=[]},volantis.dom.$=e=>e?new volantisDom(e):null,volantis.pjax={},volantis.pjax.method={complete:new RunItem,error:new RunItem,send:new RunItem},volantis.pjax=Object.assign(volantis.pjax,{push:volantis.pjax.method.complete.push,error:volantis.pjax.method.error.push,send:volantis.pjax.method.send.push}),volantis.rightmenu={},volantis.rightmenu.method={handle:new RunItem},volantis.rightmenu=Object.assign(volantis.rightmenu,{handle:volantis.rightmenu.method.handle.push}),volantis.dark={},volantis.dark.method={toggle:new RunItem},volantis.dark=Object.assign(volantis.dark,{push:volantis.dark.method.toggle.push}),volantis.js=(e,t)=>new Promise((n=>{setTimeout((function(){var s=document.getElementsByTagName("head")[0]||document.documentElement,o=document.createElement("script");if(o.setAttribute("type","text/javascript"),t)if(JSON.stringify(t))for(let e in t)"onload"==e?o[e]=()=>{t[e](),n()}:(o[e]=t[e],o.onload=n);else o.onload=()=>{t(),n()};else o.onload=n;o.setAttribute("src",e),s.appendChild(o)}))})),volantis.css=e=>new Promise((t=>{setTimeout((function(){var n=document.createElement("link");n.rel="stylesheet",n.href=e,n.onload=t,document.getElementsByTagName("head")[0].appendChild(n)}))})),volantis.import={jQuery:()=>"undefined"==typeof jQuery?volantis.js("https://jsd.cdn.storisinz.site/npm/jquery@3.6.0/dist/jquery.min.js"):new Promise((e=>{e()}))},volantis.requestAnimationFrame=e=>{window.requestAnimationFrame||(window.requestAnimationFrame=window.requestAnimationFrame||window.mozRequestAnimationFrame||window.webkitRequestAnimationFrame),window.requestAnimationFrame(e)},volantis.layoutHelper=(e,t,n)=>{function s(e,t,n){volantis.tempDiv=document.createElement("div"),volantis.tempDiv.innerHTML=t;let s=document.querySelector("#layoutHelper-"+e);s&&(n&&(s.innerHTML=""),s.append(volantis.tempDiv))}n=Object.assign({clean:!1,pjax:!0},n),s(e,t,n.clean),n.pjax&&volantis.pjax.push((()=>{s(e,t,n.clean)}),"layoutHelper-"+e)},volantis.scroll={engine:new RunItem,unengine:new RunItem},volantis.scroll=Object.assign(volantis.scroll,{push:volantis.scroll.engine.push}),volantis.scroll.getScrollTop=()=>{let e;return window.pageYOffset?e=window.pageYOffset:document.compatMode&&"BackCompat"!=document.compatMode?e=document.documentElement.scrollTop:document.body&&(e=document.body.scrollTop),e},volantis.scroll.scrollHeight=function(){return Math.max(document.body.scrollHeight,document.documentElement.scrollHeight)},volantis.scroll.offsetHeight=function(){return Math.max(document.body.offsetHeight,document.documentElement.offsetHeight,document.body.clientHeight,document.documentElement.clientHeight)},volantis.scroll.progress=function(){return volantis.scroll.getScrollTop()/(volantis.scroll.scrollHeight()-volantis.scroll.offsetHeight())},volantis.scroll.handleScrollEvents=()=>{volantis.scroll.lastScrollTop=volantis.scroll.getScrollTop(),volantis.requestAnimationFrame((function e(){const t=volantis.scroll.getScrollTop();volantis.scroll.lastScrollTop!==t?(volantis.scroll.del=t-volantis.scroll.lastScrollTop,volantis.scroll.lastScrollTop=t,volantis.scroll.unengine.list=[],volantis.scroll.engine.start()):volantis.scroll.unengine.start(),volantis.requestAnimationFrame(e)}))},volantis.scroll.handleScrollEvents(),volantis.scroll.ele=null,volantis.scroll.to=(e,t={})=>{e&&(volantis.scroll.ele=e,opt={top:e.getBoundingClientRect().top+document.documentElement.scrollTop,behavior:"smooth"},"top"in t&&(opt.top=t.top),"behavior"in t&&(opt.behavior=t.behavior),"addTop"in t&&(opt.top+=t.addTop),"observerDic"in t||(t.observerDic=100),window.scrollTo(opt),t.observer&&setTimeout((()=>{volantis.scroll.ele==e&&volantis.scroll.unengine.push((()=>{let n=e.getBoundingClientRect().top;n>=-t.observerDic&&n<=t.observerDic||volantis.scroll.to(e,t),volantis.scroll.unengine.remove("unengineObserver")}),"unengineObserver")}),1e3))},volantis.cleanContentVisibility=()=>{document.querySelector(".post-story")&&(console.log("cleanContentVisibility"),document.querySelectorAll(".post-story").forEach((e=>{e.classList.remove("post-story")})))}</script><script>volantis.GLOBAL_CONFIG={root:"/",debug:"env",default:{avatar:"https://jsd.cdn.storisinz.site/npm/volantis-static@0.0.1660614606622/media/placeholder/avatar/round/3442075.svg",link:"https://jsd.cdn.storisinz.site/npm/volantis-static@0.0.1660614606622/media/placeholder/link/8f277b4ee0ecd.svg",cover:"https://jsd.cdn.storisinz.site/npm/volantis-static@0.0.1660614606622/media/placeholder/cover/76b86c0226ffd.svg",image:"https://jsd.cdn.storisinz.site/npm/volantis-static@0.0.1660614606622/media/placeholder/image/2659360.svg"},lastupdate:new Date(1731064218127),cdn:{izitoast_css:"https://jsd.cdn.storisinz.site/npm/izitoast@1.4.0/dist/css/iziToast.min.css",izitoast_js:"https://jsd.cdn.storisinz.site/npm/izitoast@1.4.0/dist/js/iziToast.min.js",fancybox_css:"https://jsd.cdn.storisinz.site/npm/@fancyapps/ui@4.0.31/dist/fancybox.css",fancybox_js:"https://jsd.cdn.storisinz.site/npm/@fancyapps/ui@4.0.31/dist/fancybox.umd.js"},sidebar:{for_page:["nextsite","nextblogger","category","tagcloud","webinfo"],for_post:["nextsite","nextblogger","category","tagcloud","webinfo"],webinfo:{lastupd:{enable:!0,friendlyShow:!0},runtime:{data:"2020/01/01",unit:"天"}}},plugins:{message:{enable:!0,icon:{default:"fa-solid fa-info-circle light-blue",quection:"fa-solid fa-question-circle light-blue"},time:{default:5e3,quection:2e4},position:"topRight",transitionIn:"bounceInLeft",transitionOut:"fadeOutRight",titleColor:"var(--color-text)",messageColor:"var(--color-text)",backgroundColor:"var(--color-card)",zindex:2147483647,copyright:{enable:!0,title:"知识共享许可协议",message:"请遵守 CC BY-NC-SA 4.0 协议。",icon:"far fa-copyright light-blue"},aplayer:{enable:!0,play:"fa-solid fa-play",pause:"fa-solid fa-pause"},rightmenu:{enable:!0,notice:!0}}},search:{appId:"72TOQYD33Q",indexName:"hexo",apiKey:"608d2f3acd06140a2473153f6cb61eda",hitsPerPage:"5",placeholder:"Search...",searchAsYouType:!0},languages:{search:{hits_empty:"找不到您查询的内容：${query}",hits_stats:"找到 ${hits} 条结果，用时 ${time} 毫秒"}}}</script><link rel="authorization_endpoint" href="https://indieauth.com/auth"><link rel="token_endpoint" href="https://tokens.indieauth.com/token"><script src="https://jsd.cdn.storisinz.site/npm/axios@1.7.7/dist/axios.js" crossorigin="anonymous" referrerpolicy="no-referrer"></script><script>"serviceWorker"in navigator?navigator.serviceWorker.register("/sw.js").then((function(){navigator.serviceWorker.controller?console.log("Assets cached by the controlling service worker."):console.log("Please reload this page to allow the service worker to handle network operations.")})).catch((function(e){console.log("ERROR: "+e)})):console.log("Service workers are not supported in the current browser.")</script></head><body itemscope itemtype="http://schema.org/WebPage"><header itemscope itemtype="http://schema.org/WPHeader" id="l_header" class="l_header auto shadow floatable blur show showed" style="opacity:0"><div class="container"><div id="wrapper"><div class="nav-sub"><p class="title fix-header-title"></p><ul class="switcher nav-list-h m-phone" id="pjax-header-nav-list"><li><a id="s-comment" class="fa-solid fa-comments fa-fw" target="_self" title="comment"></a></li><li><a id="s-toc" class="s-toc fa-solid fa-list fa-fw" target="_self" title="toc"></a></li></ul></div><div class="nav-main"><a class="title flat-box" target="_self" href="/"><i class="fa fa-home"></i> <span>汐塔魔法屋</span></a><div class="menu navigation"><ul class="nav-list-h m-pc"><li><a class="menuitem flat-box faa-parent animated-hover" href="/categories/" title="分类" active-action="action-categories"><span class="icon"><i class="fa-solid fa-folder-open fa-fw"></i></span> <span>分类</span></a></li><li><a class="menuitem flat-box faa-parent animated-hover" href="/tags/" title="标签" active-action="action-tags"><span class="icon"><i class="fa-solid fa-tags fa-fw"></i></span> <span>标签</span></a></li><li><a class="menuitem flat-box faa-parent animated-hover" href="/archives/" title="归档" active-action="action-archives"><span class="icon"><i class="fa-solid fa-archive fa-fw"></i></span> <span>归档</span></a></li><li><a class="menuitem flat-box faa-parent animated-hover" href="/link/" title="友链" active-action="action-link"><span class="icon"><i class="fa-solid fa-link fa-fw"></i></span> <span>友链</span></a></li><li><a class="menuitem flat-box faa-parent animated-hover" target="_blank" rel="noopener" href="https://www.travellings.cn/go.html" title="开往" active-action="action-https:wwwtravellingscngohtml"><span class="icon"><i class="fa-solid fa-subway fa-fw"></i></span> <span>开往</span></a></li><li><a class="menuitem flat-box faa-parent animated-hover" target="_blank" rel="noopener" href="https://en.blog.sinzmise.top/" title="English" active-action="action-https:enblogsinzmisetop"><span class="icon"><i class="fa fa-language fa-fw fa-fw"></i></span> <span>English</span></a></li></ul></div><div class="m_search"><form name="searchform" class="form u-search-form"><i class="icon fas fa-search fa-fw"></i> <input type="text" class="input u-search-input" placeholder="Search..."></form></div><ul class="switcher nav-list-h m-phone"><li><a class="s-search fa-solid fa-search fa-fw" target="_self" title="search"></a></li><li><a class="s-menu fa-solid fa-bars fa-fw" target="_self" title="menu"></a><ul class="menu-phone list-v navigation white-box"><li><a class="menuitem flat-box faa-parent animated-hover" href="/categories/" title="分类" active-action="action-categories"><span class="icon"><i class="fa-solid fa-folder-open fa-fw"></i></span> <span>分类</span></a></li><li><a class="menuitem flat-box faa-parent animated-hover" href="/tags/" title="标签" active-action="action-tags"><span class="icon"><i class="fa-solid fa-tags fa-fw"></i></span> <span>标签</span></a></li><li><a class="menuitem flat-box faa-parent animated-hover" href="/archives/" title="归档" active-action="action-archives"><span class="icon"><i class="fa-solid fa-archive fa-fw"></i></span> <span>归档</span></a></li><li><a class="menuitem flat-box faa-parent animated-hover" href="/link/" title="友链" active-action="action-link"><span class="icon"><i class="fa-solid fa-link fa-fw"></i></span> <span>友链</span></a></li><li><a class="menuitem flat-box faa-parent animated-hover" target="_blank" rel="noopener" href="https://www.travellings.cn/go.html" title="开往" active-action="action-https:wwwtravellingscngohtml"><span class="icon"><i class="fa-solid fa-subway fa-fw"></i></span> <span>开往</span></a></li><li><a class="menuitem flat-box faa-parent animated-hover" target="_blank" rel="noopener" href="https://en.blog.sinzmise.top/" title="English" active-action="action-https:enblogsinzmisetop"><span class="icon"><i class="fa fa-language fa-fw fa-fw"></i></span> <span>English</span></a></li></ul></li></ul></div></div></div></header><div id="l_body"><div id="l_cover"></div><div id="safearea"><div class="body-wrapper"><div id="l_main" class=""><article itemscope itemtype="http://schema.org/Article" class="h-entry article post white-box reveal md shadow floatable blur article-type-post" id="post" itemscope itemprop="blogPost"><link itemprop="mainEntityOfPage" href="https://blog.sinzmise.top/posts/38964/"><span hidden itemprop="publisher" itemscope itemtype="http://schema.org/Organization"><meta itemprop="name" content="汐塔魔法屋"></span><span hidden itemprop="post" itemscope itemtype="http://schema.org/Post"><meta itemprop="name" content="汐塔魔法屋"><meta itemprop="description" content="The Story,The Dream."></span><span hidden><meta itemprop="image" content="https://blog.sinzmise.top/images/siteicon/web-app-manifest-192x192.png"></span><div class="article-meta" id="top"><h1 class="title allow-select p-name" itemprop="name headline"> 小康大佬的说说方案 ———— ispeak搭建教程</h1><div class="new-meta-box"><div class="new-meta-item author p-author h-card" itemprop="author" itemscope itemtype="http://schema.org/Person"> <a itemprop="url" class="author u-url" href="https://blog.sinzmise.top/" rel="nofollow"><img itemprop="image" class="u-photo" no-lazy src="/img/avatar.png" alt="Author"><p itemprop="name" class="p-name">王九弦SZ·Ninty</p></a></div><div class="new-meta-item category"><i class="fa-solid fa-folder-open fa-fw" aria-hidden="true"></i> <a class="category-link" href="/categories/%E7%AB%99%E7%82%B9%E6%8A%98%E8%85%BE/">站点折腾</a> <span hidden itemprop="about" itemscope itemtype="http://schema.org/Thing"><a href="/categories/%E7%AB%99%E7%82%B9%E6%8A%98%E8%85%BE/" itemprop="url"><span itemprop="name p-category">站点折腾</span></a></span></div><div class="new-meta-item date" itemprop="dateCreated datePublished"><a class="notlink"><i class="fa-solid fa-calendar-alt fa-fw" aria-hidden="true"></i><p>发布于：<time class="dataToShow dt-published" datetime="2023-01-13T21:01:37+00:00" title="2023年1月13日">2023年1月13日</time></p></a></div><div class="new-meta-item browse"><a class="notlink"><p><i class="fa-solid fa-eye fa-fw" aria-hidden="true"></i><span id="busuanzi_value_page_pv"><i class="fa-solid fa-loader fa-spin fa-fw" aria-hidden="true"></i></span> <span>次浏览</span></p></a></div></div></div><div id="layoutHelper-page-plugins"></div><div id="post-body" itemprop="articleBody" class="e-content"><p>搞ispeak时发现ispeak更新，能自定义评论了，也就是说我之前写的<a target="_blank" rel="noopener" href="https://blog.xsnet.eu.org/posts/43224/">ispeak教程</a>失效了<br>没办法我只能重新写了这篇教程<br><span id="more"></span></p><h1 id="教程"><a href="#教程" class="headerlink" title="教程"></a>教程</h1><h2 id="后端部署"><a href="#后端部署" class="headerlink" title="后端部署"></a>后端部署</h2><h3 id="配置数据库"><a href="#配置数据库" class="headerlink" title="配置数据库"></a>配置数据库</h3><div class="note info"><p>以下内容来自：<a target="_blank" rel="noopener" href="https://discuss.js.org/guide/Get-MongoDB-DataBase.html">https://discuss.js.org/guide/Get-MongoDB-DataBase.html</a></p></div><ul><li>注册<a target="_blank" rel="noopener" href="https://www.mongodb.com/cloud/atlas/register">MongoDB</a>账号，注册完成后会提示你创建一个组织，并且输入一个项目昵称，选择编程语言(不选也可以)，随后点击右下角的 <code>Continue</code>(继续)，如果没有可以跟如下图执行，点击 <code>Create an Organization</code>(创建组织)<br> <img src="https://discuss.js.org/img/guide/Get-MongoDB-DataBase/Organizations-Home.png" class="lazyload" data-srcset="https://discuss.js.org/img/guide/Get-MongoDB-DataBase/Organizations-Home.png" srcset="data:image/gif;base64,R0lGODlhAQABAIAAAP///////yH5BAEKAAEALAAAAAABAAEAAAICTAEAOw==" alt="Organizations-Home"><br> <img src="https://discuss.js.org/img/guide/Get-MongoDB-DataBase/Register-Organizations.png" class="lazyload" data-srcset="https://discuss.js.org/img/guide/Get-MongoDB-DataBase/Register-Organizations.png" srcset="data:image/gif;base64,R0lGODlhAQABAIAAAP///////yH5BAEKAAEALAAAAAABAAEAAAICTAEAOw==" alt="Register-Organizations"><br> <img src="https://discuss.js.org/img/guide/Get-MongoDB-DataBase/Create-Organization.png" class="lazyload" data-srcset="https://discuss.js.org/img/guide/Get-MongoDB-DataBase/Create-Organization.png" srcset="data:image/gif;base64,R0lGODlhAQABAIAAAP///////yH5BAEKAAEALAAAAAABAAEAAAICTAEAOw==" alt="Create-Organization"><br> <img src="https://discuss.js.org/img/guide/Get-MongoDB-DataBase/New-Project.png" class="lazyload" data-srcset="https://discuss.js.org/img/guide/Get-MongoDB-DataBase/New-Project.png" srcset="data:image/gif;base64,R0lGODlhAQABAIAAAP///////yH5BAEKAAEALAAAAAABAAEAAAICTAEAOw==" alt="New-Project"><br> <img src="https://discuss.js.org/img/guide/Get-MongoDB-DataBase/Project-Name.png" class="lazyload" data-srcset="https://discuss.js.org/img/guide/Get-MongoDB-DataBase/Project-Name.png" srcset="data:image/gif;base64,R0lGODlhAQABAIAAAP///////yH5BAEKAAEALAAAAAABAAEAAAICTAEAOw==" alt="Project-Name"><br> <img src="https://discuss.js.org/img/guide/Get-MongoDB-DataBase/Create-Project.png" class="lazyload" data-srcset="https://discuss.js.org/img/guide/Get-MongoDB-DataBase/Create-Project.png" srcset="data:image/gif;base64,R0lGODlhAQABAIAAAP///////yH5BAEKAAEALAAAAAABAAEAAAICTAEAOw==" alt="Create-Project"><br> <img src="https://discuss.js.org/img/guide/Get-MongoDB-DataBase/Build-Database.png" class="lazyload" data-srcset="https://discuss.js.org/img/guide/Get-MongoDB-DataBase/Build-Database.png" srcset="data:image/gif;base64,R0lGODlhAQABAIAAAP///////yH5BAEKAAEALAAAAAABAAEAAAICTAEAOw==" alt="Build-Database"><br> <img src="https://discuss.js.org/img/guide/Get-MongoDB-DataBase/Select-Free.png" class="lazyload" data-srcset="https://discuss.js.org/img/guide/Get-MongoDB-DataBase/Select-Free.png" srcset="data:image/gif;base64,R0lGODlhAQABAIAAAP///////yH5BAEKAAEALAAAAAABAAEAAAICTAEAOw==" alt="Select-Free"><br> <img src="https://discuss.js.org/img/guide/Get-MongoDB-DataBase/AWS-N.Virginia.png" class="lazyload" data-srcset="https://discuss.js.org/img/guide/Get-MongoDB-DataBase/AWS-N.Virginia.png" srcset="data:image/gif;base64,R0lGODlhAQABAIAAAP///////yH5BAEKAAEALAAAAAABAAEAAAICTAEAOw==" alt="AWS-N.Virginia"></li><li>选择免费的共享数据库，随后会跳出选择地区(选择离你服务端近的即可)，点击 <code>Create Cluster</code>创建</li><li>随后您需要创建数据库用户，输入用户名和密码，继续向下滚动就是添加 IP 地址，最后点击下方的 <code>Finish and Close</code>(完成并关闭)按钮</li></ul><div class="note warning"><p><strong>注意</strong><br>服务器部署，则填服务器公网 IP<br><code>无服务器(ServerLess)</code>ServerLess 一般都是动态 IP，你无法得到一个固定 IP，我们建议填写 <code>0.0.0.0</code></p></div><p><img src="https://discuss.js.org/img/guide/Get-MongoDB-DataBase/Add-IP.png" class="lazyload" data-srcset="https://discuss.js.org/img/guide/Get-MongoDB-DataBase/Add-IP.png" srcset="data:image/gif;base64,R0lGODlhAQABAIAAAP///////yH5BAEKAAEALAAAAAABAAEAAAICTAEAOw==" alt="Add IP"></p><ul><li>稍作等待创建好数据库即可，随后点击 <code>Connect</code>(连接)，点击选择 <code>Connect you application</code>(连接应用程序)，然后复制连接数据库字符串</li></ul><div class="note warning"><p><strong>注意</strong><br>需要将字符串中的 <code>&lt;password&gt;</code>替换为您在第三步创建的数据库用户密码，修改 <code>myFirstDatabase</code>为你想要的数据库名称例如:<code>Discuss</code></p></div><p><img src="https://discuss.js.org/img/guide/Get-MongoDB-DataBase/Connect.png" class="lazyload" data-srcset="https://discuss.js.org/img/guide/Get-MongoDB-DataBase/Connect.png" srcset="data:image/gif;base64,R0lGODlhAQABAIAAAP///////yH5BAEKAAEALAAAAAABAAEAAAICTAEAOw==" alt="Connect"><br><img src="https://discuss.js.org/img/guide/Get-MongoDB-DataBase/Get-Connect.png" class="lazyload" data-srcset="https://discuss.js.org/img/guide/Get-MongoDB-DataBase/Get-Connect.png" srcset="data:image/gif;base64,R0lGODlhAQABAIAAAP///////yH5BAEKAAEALAAAAAABAAEAAAICTAEAOw==" alt="Get Connect"></p><h3 id="部署kkapi"><a href="#部署kkapi" class="headerlink" title="部署kkapi"></a>部署kkapi</h3><div class="tabs" id="tab-部署kkapi"><ul class="nav-tabs"><li class="tab active"><a class="#部署kkapi-1">Vercel部署（推荐）</a></li><li class="tab"><a class="#部署kkapi-2">服务器部署</a></li><li class="tab"><a class="#部署kkapi-3">docker 部署</a></li></ul><div class="tab-content"><div class="tab-pane active" id="部署kkapi-1"><ul><li>点击下方按钮，跳转至 Vercel 进行部署。<br><a target="_blank" rel="noopener" href="https://vercel.com/new/clone?repository-url=https://github.com/kkfive/kkapi-open/tree/vercel"><img src="https://vercel.com/button" class="lazyload" data-srcset="https://vercel.com/button" srcset="data:image/gif;base64,R0lGODlhAQABAIAAAP///////yH5BAEKAAEALAAAAAABAAEAAAICTAEAOw==" alt="部署到Vercel"></a></li><li>配置环境变量：<br><img src="https://jsd.cdn.storisinz.site/gh/SinzMise/MYPictures@master/20230114/msedge_wwcTzH8isA.10hmhosvut28.webp" class="lazyload" data-srcset="https://jsd.cdn.storisinz.site/gh/SinzMise/MYPictures@master/20230114/msedge_wwcTzH8isA.10hmhosvut28.webp" srcset="data:image/gif;base64,R0lGODlhAQABAIAAAP///////yH5BAEKAAEALAAAAAABAAEAAAICTAEAOw==" alt="msedge_wwcTzH8isA"><br>环境变量可能随项目的迭代而增加必填的环境变量，具体请参考<a target="_blank" rel="noopener" href="https://kkapi.js.org/reference/kkapi/environment.html">官网 —— kkapi环境变量</a></li><li>重新部署<br><img src="https://jsd.cdn.storisinz.site/gh/SinzMise/MYPictures@master/20230114/msedge_owqMifozPi.37vcfu5vfpm0.webp" class="lazyload" data-srcset="https://jsd.cdn.storisinz.site/gh/SinzMise/MYPictures@master/20230114/msedge_owqMifozPi.37vcfu5vfpm0.webp" srcset="data:image/gif;base64,R0lGODlhAQABAIAAAP///////yH5BAEKAAEALAAAAAABAAEAAAICTAEAOw==" alt="msedge_owqMifozPi"><br><img src="https://jsd.cdn.storisinz.site/gh/SinzMise/MYPictures@master/20230114/msedge_5WUBTLL0NZ.1nl1z1a7qiqo.webp" class="lazyload" data-srcset="https://jsd.cdn.storisinz.site/gh/SinzMise/MYPictures@master/20230114/msedge_5WUBTLL0NZ.1nl1z1a7qiqo.webp" srcset="data:image/gif;base64,R0lGODlhAQABAIAAAP///////yH5BAEKAAEALAAAAAABAAEAAAICTAEAOw==" alt="msedge_5WUBTLL0NZ"><br><img src="https://jsd.cdn.storisinz.site/gh/SinzMise/MYPictures@master/20230114/msedge_mMprAjHb9O.3b2527plrfg.webp" class="lazyload" data-srcset="https://jsd.cdn.storisinz.site/gh/SinzMise/MYPictures@master/20230114/msedge_mMprAjHb9O.3b2527plrfg.webp" srcset="data:image/gif;base64,R0lGODlhAQABAIAAAP///////yH5BAEKAAEALAAAAAABAAEAAAICTAEAOw==" alt="msedge_mMprAjHb9O"></li><li>绑定域名（建议）<br><img src="https://jsd.cdn.storisinz.site/gh/SinzMise/MYPictures@master/20230114/msedge_miAwQcdm9f.3htnm9dlllq0.webp" class="lazyload" data-srcset="https://jsd.cdn.storisinz.site/gh/SinzMise/MYPictures@master/20230114/msedge_miAwQcdm9f.3htnm9dlllq0.webp" srcset="data:image/gif;base64,R0lGODlhAQABAIAAAP///////yH5BAEKAAEALAAAAAABAAEAAAICTAEAOw==" alt="msedge_miAwQcdm9f"></li><li>初始化账户<br>浏览器访问：<br>你刚刚复制的地址/api/user/init?userName=你想设置的账户名<br>如果不指定用户名则自动将账户名设置为admin</li></ul></div><div class="tab-pane" id="部署kkapi-2"><div class="note info"><p>以下内容来自：<a target="_blank" rel="noopener" href="https://kkapi.js.org/guide/setup/deploy.html#%E7%AC%AC%E4%BA%8C%E7%A7%8D%E9%83%A8%E7%BD%B2%E5%A7%BF%E5%8A%BF%EF%BC%9A%E6%9C%8D%E5%8A%A1%E5%99%A8%E9%83%A8%E7%BD%B2">第二种部署姿势：服务器部署</a></p></div><ul><li>克隆源代码<br><code>git clone https://ghproxy.com/https://github.com/kkfive/kkapi-open.git</code></li><li>安装依赖<br><code>yarn install</code><br>如果没有<code>yarn</code>则先允许<code>npm i yarn -g</code>进行安装</li><li>安装 pm2<br><code>npm i pm2 -g</code></li><li>编译项目<br><code>yarn build</code></li><li>配置环境变量<br>在项目目录新建文件<code>local.env</code>，将环境变量写入其中即可。例如：<figure class="highlight plaintext"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br><span class="line">5</span><br><span class="line">6</span><br></pre></td><td class="code"><pre><span class="line">PORT=3000</span><br><span class="line">DATABASE_URL=mongodb://127.0.0.1:27017/kkpaiopen?authSource=admin</span><br><span class="line">DATABASE_USER=root</span><br><span class="line">DATABASE_PASSWORD=root</span><br><span class="line"># 加密密钥 测试</span><br><span class="line">SECRETKEY=xxxxxxxxxxxxxxx</span><br></pre></td></tr></table></figure> 其中 PORT 表示启动的端口</li><li>启动项目<br><code>pm2 start pm2.json</code><br>然后通过命令<code>curl http://127.0.0.1:3000/api/user/init</code>检查是否允许成功<br><img src="https://file.acs.pw/picGo/2022/02/27/20220227101623.png" class="lazyload" data-srcset="https://file.acs.pw/picGo/2022/02/27/20220227101623.png" srcset="data:image/gif;base64,R0lGODlhAQABAIAAAP///////yH5BAEKAAEALAAAAAABAAEAAAICTAEAOw==" alt="image-20220227101623911"></li><li>更新项目<br>进入项目并执行一下命令<figure class="highlight bash"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br></pre></td><td class="code"><pre><span class="line">git pull</span><br><span class="line">yarn build</span><br><span class="line">pm2 restart pm2.json</span><br></pre></td></tr></table></figure></li></ul></div><div class="tab-pane" id="部署kkapi-3"><p>尚未写完</p></div></div></div><h3 id="部署kkadmin"><a href="#部署kkadmin" class="headerlink" title="部署kkadmin"></a>部署kkadmin</h3><p>介绍：kkadmin是kkapi的后台，方便发布说说<br></p><div class="note tip"><p>以下部署姿势你只需要任选其一即可，无需全部部署。</p></div><p></p><div class="tabs" id="tab-部署kkadmin"><ul class="nav-tabs"><li class="tab"><a class="#部署kkadmin-1">Vercel部署</a></li><li class="tab active"><a class="#部署kkadmin-2">CF pages部署（推荐）</a></li><li class="tab"><a class="#部署kkadmin-3">其他环境部署</a></li></ul><div class="tab-content"><div class="tab-pane" id="部署kkadmin-1"><div class="note warning"><p>由于构建 kkadmin 时部分依赖文件需要 nodejs16 及以上版本才可以安装，因此不能将源代码扔给 vercel 进行构建。<br>所以只能够利用 GitHub actions 构建完成后将产物扔给 vercel 进行使用</p></div><ul><li>Fork这个项目：<a target="_blank" rel="noopener" href="https://github.com/kkfive/kkadmin-open/">https://github.com/kkfive/kkadmin-open/</a></li></ul><p><img src="https://jsd.cdn.storisinz.site/gh/StarWEB890/TuChuang@master/images/msedge_6HMaGfN000.1csf0rae8okg.webp" class="lazyload" data-srcset="https://jsd.cdn.storisinz.site/gh/StarWEB890/TuChuang@master/images/msedge_6HMaGfN000.1csf0rae8okg.webp" srcset="data:image/gif;base64,R0lGODlhAQABAIAAAP///////yH5BAEKAAEALAAAAAABAAEAAAICTAEAOw==" alt="msedge_6HMaGfN000"><br><img src="https://jsd.cdn.storisinz.site/gh/StarWEB890/TuChuang@master/images/msedge_UPsCgr2okQ.7k0gi7brxoc0.webp" class="lazyload" data-srcset="https://jsd.cdn.storisinz.site/gh/StarWEB890/TuChuang@master/images/msedge_UPsCgr2okQ.7k0gi7brxoc0.webp" srcset="data:image/gif;base64,R0lGODlhAQABAIAAAP///////yH5BAEKAAEALAAAAAABAAEAAAICTAEAOw==" alt="msedge_UPsCgr2okQ"></p><ul><li>配置变量<br><img src="https://jsd.cdn.storisinz.site/gh/StarWEB890/TuChuang@master/images/msedge_ktuszZjpej.7ftbduod9uc0.webp" class="lazyload" data-srcset="https://jsd.cdn.storisinz.site/gh/StarWEB890/TuChuang@master/images/msedge_ktuszZjpej.7ftbduod9uc0.webp" srcset="data:image/gif;base64,R0lGODlhAQABAIAAAP///////yH5BAEKAAEALAAAAAABAAEAAAICTAEAOw==" alt="msedge_ktuszZjpej"></li></ul><p>VITE_GLOB_API_URL（必选）<br><img src="https://jsd.cdn.storisinz.site/gh/StarWEB890/TuChuang@master/images/msedge_wqMbtdCCon.26m2h3r94d7k.webp" class="lazyload" data-srcset="https://jsd.cdn.storisinz.site/gh/StarWEB890/TuChuang@master/images/msedge_wqMbtdCCon.26m2h3r94d7k.webp" srcset="data:image/gif;base64,R0lGODlhAQABAIAAAP///////yH5BAEKAAEALAAAAAABAAEAAAICTAEAOw==" alt="msedge_wqMbtdCCon"></p><ul><li>构建actions</li></ul><p><img src="https://jsd.cdn.storisinz.site/gh/StarWEB890/TuChuang@master/images/msedge_yymiOm8Kek.23xjzofdum3.webp" class="lazyload" data-srcset="https://jsd.cdn.storisinz.site/gh/StarWEB890/TuChuang@master/images/msedge_yymiOm8Kek.23xjzofdum3.webp" srcset="data:image/gif;base64,R0lGODlhAQABAIAAAP///////yH5BAEKAAEALAAAAAABAAEAAAICTAEAOw==" alt="msedge_yymiOm8Kek"><br><img src="https://jsd.cdn.storisinz.site/gh/StarWEB890/TuChuang@master/images/msedge_4awdNaFJGz.1rdq0mxyfhog.webp" class="lazyload" data-srcset="https://jsd.cdn.storisinz.site/gh/StarWEB890/TuChuang@master/images/msedge_4awdNaFJGz.1rdq0mxyfhog.webp" srcset="data:image/gif;base64,R0lGODlhAQABAIAAAP///////yH5BAEKAAEALAAAAAABAAEAAAICTAEAOw==" alt="msedge_4awdNaFJGz"><br><img src="https://jsd.cdn.storisinz.site/gh/StarWEB890/TuChuang@master/images/msedge_2uYyc6Qh4I.4p3ngtkhmh00.webp" class="lazyload" data-srcset="https://jsd.cdn.storisinz.site/gh/StarWEB890/TuChuang@master/images/msedge_2uYyc6Qh4I.4p3ngtkhmh00.webp" srcset="data:image/gif;base64,R0lGODlhAQABAIAAAP///////yH5BAEKAAEALAAAAAABAAEAAAICTAEAOw==" alt="msedge_2uYyc6Qh4I"></p><ul><li>部署到Vercel<br>复制下面这个网址</li></ul><figure class="highlight plaintext"><table><tr><td class="gutter"><pre><span class="line">1</span><br></pre></td><td class="code"><pre><span class="line">https://vercel.com/new/import?s=https://github.com/SinInno/kkadmin-open/tree/vercel</span><br></pre></td></tr></table></figure><p>并将“SinInno”改为你Github的用户名后访问你刚刚修改的网址<br>PS：如果你Fork的这个项目有改Repository name，那么请将上面的“kkapi-open”改为你这个项目的Repository name</p><p>然后直接部署</p><p><img src="https://jsd.cdn.storisinz.site/gh/StarWEB890/TuChuang@master/images/msedge_GJbsx9xoOw.8zgxw8og644.webp" class="lazyload" data-srcset="https://jsd.cdn.storisinz.site/gh/StarWEB890/TuChuang@master/images/msedge_GJbsx9xoOw.8zgxw8og644.webp" srcset="data:image/gif;base64,R0lGODlhAQABAIAAAP///////yH5BAEKAAEALAAAAAABAAEAAAICTAEAOw==" alt="msedge_GJbsx9xoOw"></p><p>部署完成后点“Go to Dashboard”，并点左上角的“Visit”</p><p><img src="https://jsd.cdn.storisinz.site/gh/StarWEB890/TuChuang@master/images/msedge_Lyo0nIvIqF.d4g2uabkljk.webp" class="lazyload" data-srcset="https://jsd.cdn.storisinz.site/gh/StarWEB890/TuChuang@master/images/msedge_Lyo0nIvIqF.d4g2uabkljk.webp" srcset="data:image/gif;base64,R0lGODlhAQABAIAAAP///////yH5BAEKAAEALAAAAAABAAEAAAICTAEAOw==" alt="msedge_Lyo0nIvIqF"></p><p>账号输入你之前初始化账户的账户名<br>密码请输入默认密码：123456<br>登入面板后请更改默认密码！</p></div><div class="tab-pane active" id="部署kkadmin-2"><div class="note info"><p>如果你已经在 GitHub actions 部署了，那么 cf pages 部署时也可以选择 vercel 进行部署。也可以使用主干分支进行打包部署。<br>接下来的教程以使用 cf pages 构建为例介绍</p></div><ul><li>fork项目（可直接fork）</li><li>导入项目</li></ul><p><img src="https://jsd.cdn.storisinz.site/gh/SinzMise/MYPictures@master/msedge_1bV5Of8ioS.xtthsj95ytc.webp" class="lazyload" data-srcset="https://jsd.cdn.storisinz.site/gh/SinzMise/MYPictures@master/msedge_1bV5Of8ioS.xtthsj95ytc.webp" srcset="data:image/gif;base64,R0lGODlhAQABAIAAAP///////yH5BAEKAAEALAAAAAABAAEAAAICTAEAOw==" alt="msedge_1bV5Of8ioS"><br><img src="https://jsd.cdn.storisinz.site/gh/SinzMise/MYPictures@master/msedge_CcnQ68DBFQ.2q893j8w72k0.webp" class="lazyload" data-srcset="https://jsd.cdn.storisinz.site/gh/SinzMise/MYPictures@master/msedge_CcnQ68DBFQ.2q893j8w72k0.webp" srcset="data:image/gif;base64,R0lGODlhAQABAIAAAP///////yH5BAEKAAEALAAAAAABAAEAAAICTAEAOw==" alt="msedge_CcnQ68DBFQ"></p><ul><li>配置环境变量</li></ul><p>环境变量参考：<a target="_blank" rel="noopener" href="https://kkapi.js.org/reference/kkadmin/environment.html">官网 —— kkadmin环境变量</a></p><p><img src="https://file.acs.pw/picGo/2022/02/27/20220227113526.png" class="lazyload" data-srcset="https://file.acs.pw/picGo/2022/02/27/20220227113526.png" srcset="data:image/gif;base64,R0lGODlhAQABAIAAAP///////yH5BAEKAAEALAAAAAABAAEAAAICTAEAOw==" alt="配置环境变量"></p><ul><li>等待构建完成后即可</li></ul><p><img src="https://file.acs.pw/picGo/2022/02/27/20220227114643.png" class="lazyload" data-srcset="https://file.acs.pw/picGo/2022/02/27/20220227114643.png" srcset="data:image/gif;base64,R0lGODlhAQABAIAAAP///////yH5BAEKAAEALAAAAAABAAEAAAICTAEAOw==" alt="构建中"></p></div><div class="tab-pane" id="部署kkadmin-3"><p>其他环境部署基本可以直接使用 GitHub 构建后的 vercel 进行，毕竟只是 HTML</p></div></div></div><h2 id="前端配置"><a href="#前端配置" class="headerlink" title="前端配置"></a>前端配置</h2><h3 id="进入后台，查看个人ID"><a href="#进入后台，查看个人ID" class="headerlink" title="进入后台，查看个人ID"></a>进入后台，查看个人ID</h3><p><img src="https://file.acs.pw/picGo/2022/02/27/20220227131425.png" class="lazyload" data-srcset="https://file.acs.pw/picGo/2022/02/27/20220227131425.png" srcset="data:image/gif;base64,R0lGODlhAQABAIAAAP///////yH5BAEKAAEALAAAAAABAAEAAAICTAEAOw==" alt="查看个人ID"></p><h3 id="前端引入"><a href="#前端引入" class="headerlink" title="前端引入"></a>前端引入</h3><div class="note info"><p>ipseak 使用 marked 依赖和 highlight 依赖，为了减少打包体积，并没有将该依赖打包，因此需要使用 cdn 进行外部引入。</p></div><div class="tabs" id="tab-前端引入ispeak"><ul class="nav-tabs"><li class="tab"><a class="#前端引入ispeak-1">使用Waline</a></li><li class="tab active"><a class="#前端引入ispeak-2">使用Twikoo</a></li><li class="tab"><a class="#前端引入ispeak-3">使用Discuss</a></li><li class="tab"><a class="#前端引入ispeak-4">使用Artalk</a></li></ul><div class="tab-content"><div class="tab-pane" id="前端引入ispeak-1"><ul><li>在博客目录下运行<code>hexo new page speaks</code></li><li>编辑[blogroot]\source\speaks\index.md，将里面的内容替换成：<figure class="highlight markdown"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br><span class="line">5</span><br><span class="line">6</span><br><span class="line">7</span><br><span class="line">8</span><br><span class="line">9</span><br><span class="line">10</span><br><span class="line">11</span><br><span class="line">12</span><br><span class="line">13</span><br><span class="line">14</span><br><span class="line">15</span><br><span class="line">16</span><br><span class="line">17</span><br><span class="line">18</span><br><span class="line">19</span><br><span class="line">20</span><br><span class="line">21</span><br><span class="line">22</span><br><span class="line">23</span><br><span class="line">24</span><br><span class="line">25</span><br><span class="line">26</span><br><span class="line">27</span><br><span class="line">28</span><br><span class="line">29</span><br><span class="line">30</span><br><span class="line">31</span><br><span class="line">32</span><br><span class="line">33</span><br><span class="line">34</span><br><span class="line">35</span><br><span class="line">36</span><br><span class="line">37</span><br><span class="line">38</span><br><span class="line">39</span><br><span class="line">40</span><br><span class="line">41</span><br><span class="line">42</span><br><span class="line">43</span><br><span class="line">44</span><br><span class="line">45</span><br><span class="line">46</span><br><span class="line">47</span><br><span class="line">48</span><br><span class="line">49</span><br><span class="line">50</span><br><span class="line">51</span><br><span class="line">52</span><br><span class="line">53</span><br><span class="line">54</span><br><span class="line">55</span><br><span class="line">56</span><br><span class="line">57</span><br><span class="line">58</span><br><span class="line">59</span><br><span class="line">60</span><br><span class="line">61</span><br><span class="line">62</span><br><span class="line">63</span><br><span class="line">64</span><br><span class="line">65</span><br><span class="line">66</span><br><span class="line">67</span><br><span class="line">68</span><br><span class="line">69</span><br><span class="line">70</span><br></pre></td><td class="code"><pre><span class="line">---</span><br><span class="line">title: 说说</span><br><span class="line">comments: false</span><br><span class="line"><span class="section">aside: false</span></span><br><span class="line"><span class="section">---</span></span><br><span class="line">&#123;% raw %&#125;</span><br><span class="line"></span><br><span class="line"><span class="language-xml"><span class="tag">&lt;<span class="name">style</span>&gt;</span></span></span><br><span class="line"> .speak-footer,.wl-power&#123;</span><br><span class="line"><span class="code"> display:none;</span></span><br><span class="line"><span class="code"> &#125;</span></span><br><span class="line"><span class="code">&lt;/style&gt;</span></span><br><span class="line"><span class="code">&lt;div id=&quot;ispeak&quot;&gt;&lt;/div&gt;</span></span><br><span class="line"><span class="code">&lt;link</span></span><br><span class="line"><span class="code"> rel=&quot;stylesheet&quot;</span></span><br><span class="line"><span class="code"> href=&quot;https://cdn.staticfile.org/highlight.js/10.6.0/styles/atom-one-dark.min.css&quot;</span></span><br><span class="line"><span class="code">/&gt;</span></span><br><span class="line"><span class="code">&lt;link</span></span><br><span class="line"><span class="code"> rel=&quot;stylesheet&quot;</span></span><br><span class="line"><span class="code"> href=&quot;https://npm.elemecdn.com/ispeak@4.4.0/style.css&quot;</span></span><br><span class="line"><span class="code">/&gt;</span></span><br><span class="line"><span class="code">&lt;script src=&quot;https://cdn.staticfile.org/highlight.js/10.6.0/highlight.min.js&quot;&gt;&lt;/script&gt;</span></span><br><span class="line"><span class="code">&lt;script src=&quot;https://cdn.staticfile.org/marked/2.0.0/marked.min.js&quot;&gt;&lt;/script&gt;</span></span><br><span class="line"><span class="code">&lt;!-- CSS --&gt;</span></span><br><span class="line"><span class="code">&lt;link href=&quot;https://unpkg.com/@waline/client/dist/waline.css&quot; rel=&quot;stylesheet&quot; /&gt;</span></span><br><span class="line"><span class="code">&lt;script src=&quot;https://unpkg.com/@waline/client@v2/dist/waline.js&quot;&gt;&lt;/script&gt;</span></span><br><span class="line"><span class="code">&lt;script&gt;</span></span><br><span class="line"><span class="code"> function load_ispeak() &#123;</span></span><br><span class="line"><span class="code"> setTimeout(function() &#123;</span></span><br><span class="line"><span class="code"> var HEAD = document.getElementsByTagName(&#x27;head&#x27;)[0] || document.documentElement;</span></span><br><span class="line"><span class="code"> var src = &#x27;https://cdn1.tianli0.top/npm/ispeak/ispeak.umd.js&#x27;</span></span><br><span class="line"><span class="code"> var script = document.createElement(&#x27;script&#x27;)</span></span><br><span class="line"><span class="code"> script.setAttribute(&#x27;type&#x27;,&#x27;text/javascript&#x27;)</span></span><br><span class="line"><span class="code"> script.onload = function() &#123;</span></span><br><span class="line"><span class="code"> pjax_ispeak()</span></span><br><span class="line"><span class="code"> &#125;</span></span><br><span class="line"><span class="code"> script.setAttribute(&#x27;src&#x27;, src)</span></span><br><span class="line"><span class="code"> HEAD.appendChild(script)</span></span><br><span class="line"><span class="code"> &#125;, 1);</span></span><br><span class="line"><span class="code"> &#125;;</span></span><br><span class="line"><span class="code"> function pjax_ispeak() &#123;</span></span><br><span class="line"><span class="code"> if(!document.querySelectorAll(&quot;#ispeak&quot;)[0])return;</span></span><br><span class="line"><span class="code"> ispeak</span></span><br><span class="line"><span class="code"> .init(&#123;</span></span><br><span class="line"><span class="code"> el: &#x27;#ispeak&#x27;,//不用改</span></span><br><span class="line"><span class="code"> api: &#x27;&#x27;, //填写你kkapi地址（不是kkadmin后台地址！）</span></span><br><span class="line"><span class="code"> author: &#x27;&#x27;,//填写个人ID</span></span><br><span class="line"><span class="code"> pageSize: 10,//每页speak显示的条数（建议保持默认，除非你要魔改css）</span></span><br><span class="line"><span class="code"> loading_img: &#x27;https://bu.dusays.com/2021/03/04/d2d5e983e2961.gif&#x27;,//加载动画</span></span><br><span class="line"><span class="code"> comment: function (speak) &#123;</span></span><br><span class="line"><span class="code"> const &#123; _id, title, content &#125; = speak</span></span><br><span class="line"><span class="code"> const contentSub = content.substring(0, 30)</span></span><br><span class="line"><span class="code"> Waline.init(&#123;</span></span><br><span class="line"><span class="code"> el: &#x27;.ispeak-comment&#x27;,//不用改</span></span><br><span class="line"><span class="code"> serverURL: &#x27;&#x27;,//填写你的Waline服务端地址</span></span><br><span class="line"><span class="code"> path:&#x27;/speak/info.html?q=&#x27; + _id,//不用改，除非你将上面的speak改为别的文件夹昵称</span></span><br><span class="line"><span class="code"> //后面可按照https://waline.js.org/reference/client/props.html 修改（必须放在path后面！以下为一个例子）</span></span><br><span class="line"><span class="code"> emoji: [&quot;//unpkg.com/@waline/emojis@1.0.1/weibo&quot;,&quot;https://emoji.shojo.cn/bili/src/小黄脸&quot;,&quot;//unpkg.com/@waline/emojis@1.0.1/bilibili&quot;,&quot;https://emoji.shojo.cn/bili/src/枕边童话&quot;,&quot;https://emoji.shojo.cn/bili/src/咩栗&quot;,&quot;https://emoji.shojo.cn/bili/src/呜米&quot;,&quot;https://emoji.shojo.cn/bili/src/进击的冰糖&quot;,&quot;https://emoji.shojo.cn/bili/src/冰糖IO 蜕变·闪耀&quot;,&quot;https://emoji.shojo.cn/bili/src/多多poi&quot;,&quot;https://emoji.shojo.cn/bili/src/穆小泠&quot;,&quot;https://emoji.shojo.cn/bili/src/早稻叽&quot;],// 表情包大全</span></span><br><span class="line"><span class="code"> &#125;);</span></span><br><span class="line"><span class="code"> &#125;</span></span><br><span class="line"><span class="code"> &#125;);</span></span><br><span class="line"><span class="code"> &#125;</span></span><br><span class="line"><span class="code"> load_ispeak();</span></span><br><span class="line"><span class="code"> document.addEventListener(&#x27;pjax:complete&#x27;, function () &#123;</span></span><br><span class="line"><span class="code"> pjax_ispeak();</span></span><br><span class="line"><span class="code"> &#125;);</span></span><br><span class="line"><span class="code">&lt;/script&gt;</span></span><br><span class="line"><span class="code">&lt;!--建议标注末尾链接--&gt;</span></span><br><span class="line"><span class="code">&lt;p style=&quot;width: 100%;text-align: end;font-size: .75em;color: #999;margin-top: 1em;&quot;&gt;Powered by &lt;a href=&quot;https://www.antmoe.com/speak/&quot;&gt;&lt;strong&gt;iSpeak&lt;/strong&gt;&lt;/a&gt; | Comment by &lt;a href=&quot;https://discuss.js.org/&quot;&gt;&lt;strong&gt;Waline&lt;/strong&gt;&lt;/a&gt;&lt;/p&gt; </span></span><br><span class="line"><span class="code">&#123;% endraw %&#125;</span></span><br></pre></td></tr></table></figure></li><li>在[blogroot]\source\speaks\下新建info.md，内容为下：<figure class="highlight markdown"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br><span class="line">5</span><br><span class="line">6</span><br><span class="line">7</span><br><span class="line">8</span><br><span class="line">9</span><br><span class="line">10</span><br><span class="line">11</span><br><span class="line">12</span><br><span class="line">13</span><br><span class="line">14</span><br><span class="line">15</span><br><span class="line">16</span><br><span class="line">17</span><br><span class="line">18</span><br><span class="line">19</span><br><span class="line">20</span><br><span class="line">21</span><br><span class="line">22</span><br><span class="line">23</span><br><span class="line">24</span><br><span class="line">25</span><br><span class="line">26</span><br><span class="line">27</span><br><span class="line">28</span><br><span class="line">29</span><br><span class="line">30</span><br><span class="line">31</span><br><span class="line">32</span><br><span class="line">33</span><br><span class="line">34</span><br><span class="line">35</span><br><span class="line">36</span><br><span class="line">37</span><br><span class="line">38</span><br><span class="line">39</span><br><span class="line">40</span><br><span class="line">41</span><br><span class="line">42</span><br><span class="line">43</span><br><span class="line">44</span><br><span class="line">45</span><br><span class="line">46</span><br><span class="line">47</span><br><span class="line">48</span><br><span class="line">49</span><br><span class="line">50</span><br><span class="line">51</span><br><span class="line">52</span><br><span class="line">53</span><br><span class="line">54</span><br><span class="line">55</span><br><span class="line">56</span><br><span class="line">57</span><br><span class="line">58</span><br><span class="line">59</span><br><span class="line">60</span><br><span class="line">61</span><br><span class="line">62</span><br><span class="line">63</span><br><span class="line">64</span><br><span class="line">65</span><br><span class="line">66</span><br><span class="line">67</span><br><span class="line">68</span><br><span class="line">69</span><br><span class="line">70</span><br><span class="line">71</span><br><span class="line">72</span><br><span class="line">73</span><br><span class="line">74</span><br></pre></td><td class="code"><pre><span class="line">---</span><br><span class="line">title: Speak</span><br><span class="line">aside: false</span><br><span class="line">comments: false</span><br><span class="line"><span class="section">description: 欢迎来到SinzMise的日记，快来看看SinzMise分享了什么！ # speak介绍</span></span><br><span class="line"><span class="section">---</span></span><br><span class="line">&lt;!-- CSS --&gt;</span><br><span class="line"><span class="language-xml"><span class="tag">&lt;<span class="name">link</span> <span class="attr">rel</span>=<span class="string">&quot;stylesheet&quot;</span> <span class="attr">href</span>=<span class="string">&quot;https://cdn.staticfile.org/highlight.js/10.6.0/styles/atom-one-dark.min.css&quot;</span> /&gt;</span></span></span><br><span class="line"><span class="language-xml"><span class="tag">&lt;<span class="name">link</span> <span class="attr">href</span>=<span class="string">&quot;https://unpkg.com/@waline/client/dist/waline.css&quot;</span> <span class="attr">rel</span>=<span class="string">&quot;stylesheet&quot;</span> /&gt;</span></span></span><br><span class="line"><span class="language-xml"><span class="tag">&lt;<span class="name">div</span> <span class="attr">class</span>=<span class="string">&#x27;content&#x27;</span>&gt;</span></span></span><br><span class="line"> <span class="language-xml"><span class="tag">&lt;<span class="name">img</span> <span class="attr">src</span>=<span class="string">&#x27;https://bu.dusays.com/2022/05/01/626e88f349943.gif&#x27;</span>&gt;</span></span></span><br><span class="line"><span class="language-xml"><span class="tag">&lt;/<span class="name">div</span>&gt;</span></span></span><br><span class="line">&#123;% btn &#x27;/speaks/&#x27;,查看全部,far fa-hand-point-right,block center blue larger %&#125;</span><br><span class="line"><span class="language-xml"><span class="tag">&lt;<span class="name">hr</span> /&gt;</span></span></span><br><span class="line"><span class="language-xml"><span class="tag">&lt;<span class="name">div</span> <span class="attr">class</span>=<span class="string">&#x27;ispeak-comment&#x27;</span>&gt;</span></span><span class="language-xml"><span class="tag">&lt;/<span class="name">div</span>&gt;</span></span></span><br><span class="line">&lt;!-- JS --&gt;</span><br><span class="line"><span class="language-xml"><span class="tag">&lt;<span class="name">script</span> <span class="attr">src</span>=<span class="string">&quot;https://unpkg.com/@waline/client@v2/dist/waline.js&quot;</span>&gt;</span></span><span class="language-xml"><span class="tag">&lt;/<span class="name">script</span>&gt;</span></span></span><br><span class="line"><span class="language-xml"><span class="tag">&lt;<span class="name">script</span> <span class="attr">src</span>=<span class="string">&quot;https://unpkg.com/marked@4.0.18/marked.min.js&quot;</span>&gt;</span></span><span class="language-xml"><span class="tag">&lt;/<span class="name">script</span>&gt;</span></span></span><br><span class="line"><span class="language-xml"><span class="tag">&lt;<span class="name">script</span> <span class="attr">src</span>=<span class="string">&quot;https://cdn.staticfile.org/highlight.js/10.6.0/highlight.min.js&quot;</span>&gt;</span></span><span class="language-xml"><span class="tag">&lt;/<span class="name">script</span>&gt;</span></span></span><br><span class="line"><span class="language-xml"><span class="tag">&lt;<span class="name">script</span>&gt;</span></span></span><br><span class="line"> const searchParams = new URLSearchParams(window.location.search);</span><br><span class="line"> const speakId = searchParams.get(&#x27;q&#x27;);</span><br><span class="line"> const path = window.location.pathname;</span><br><span class="line"> const apiURL = &#x27;https://（你的api地址）/api/ispeak&#x27;;</span><br><span class="line"> const markedRender = (body, loading<span class="emphasis">_img=&#x27;https://bu.dusays.com/2022/05/01/626e88f349943.gif&#x27;) =&gt; &#123;</span></span><br><span class="line"><span class="emphasis"> const renderer = &#123;</span></span><br><span class="line"><span class="emphasis"> image(href, title, text) &#123;</span></span><br><span class="line"><span class="emphasis"> return `<span class="language-xml"><span class="language-javascript">&lt;a href=<span class="string">&quot;$&#123;href&#125;&quot;</span> target=<span class="string">&quot;_blank&quot;</span> data-fancybox=<span class="string">&quot;group&quot;</span> <span class="keyword">class</span>=<span class="string">&quot;fancybox&quot;</span>&gt;</span></span></span></span><br><span class="line"><span class="emphasis"> <span class="language-xml"><span class="language-handlebars"><span class="language-xml"><span class="tag">&lt;<span class="name">img</span> <span class="attr">speak-src</span>=<span class="string">&quot;$&#123;href&#125;&quot;</span> <span class="attr">src</span>=<span class="string">$&#123;loading_img&#125;</span> <span class="attr">alt</span>=<span class="string">&#x27;$&#123;text&#125;&#x27;</span>&gt;</span></span></span></span></span></span><br><span class="line"><span class="emphasis"> <span class="language-xml"><span class="language-handlebars"><span class="language-xml"><span class="tag">&lt;/<span class="name">a</span>&gt;</span></span></span></span>`</span></span><br><span class="line"><span class="emphasis"> &#125;</span></span><br><span class="line"><span class="emphasis"> &#125;</span></span><br><span class="line"><span class="emphasis"> marked.setOptions(&#123;</span></span><br><span class="line"><span class="emphasis"> renderer: new marked.Renderer(),</span></span><br><span class="line"><span class="emphasis"> highlight: function (code) &#123;</span></span><br><span class="line"><span class="emphasis"> if (hljs) &#123;</span></span><br><span class="line"><span class="emphasis"> return hljs.highlightAuto(code).value</span></span><br><span class="line"><span class="emphasis"> &#125; else &#123;</span></span><br><span class="line"><span class="emphasis"> return code</span></span><br><span class="line"><span class="emphasis"> &#125;</span></span><br><span class="line"><span class="emphasis"> &#125;,</span></span><br><span class="line"><span class="emphasis"> pedantic: false,</span></span><br><span class="line"><span class="emphasis"> gfm: true,</span></span><br><span class="line"><span class="emphasis"> tables: true,</span></span><br><span class="line"><span class="emphasis"> breaks: true,</span></span><br><span class="line"><span class="emphasis"> sanitize: false,</span></span><br><span class="line"><span class="emphasis"> smartLists: true,</span></span><br><span class="line"><span class="emphasis"> smartypants: false,</span></span><br><span class="line"><span class="emphasis"> xhtml: false</span></span><br><span class="line"><span class="emphasis"> &#125;)</span></span><br><span class="line"><span class="emphasis"> marked.use(&#123; renderer &#125;)</span></span><br><span class="line"><span class="emphasis"> return marked.parse(body)</span></span><br><span class="line"><span class="emphasis"> &#125;</span></span><br><span class="line"><span class="emphasis"> fetch(`$&#123;apiURL&#125;/get/$&#123;speakId&#125;`)</span></span><br><span class="line"><span class="emphasis"> .then(response =&gt; response.json())</span></span><br><span class="line"><span class="emphasis"> .then(res =&gt; &#123;</span></span><br><span class="line"><span class="emphasis"> const data = res.data;</span></span><br><span class="line"><span class="emphasis"> if(data)&#123;</span></span><br><span class="line"><span class="emphasis"> const &#123;title,content&#125; = data;</span></span><br><span class="line"><span class="emphasis"> const contentSub = content.substring(0, 30);</span></span><br><span class="line"><span class="emphasis"> document.querySelector(&#x27;.content&#x27;).innerHTML = markedRender(content);</span></span><br><span class="line"><span class="emphasis"> if(title)&#123;</span></span><br><span class="line"><span class="emphasis"> document.title = title;</span></span><br><span class="line"><span class="emphasis"> &#125;</span></span><br><span class="line"><span class="emphasis"> Waline.init(&#123;</span></span><br><span class="line"><span class="emphasis"> el: &#x27;.ispeak-comment&#x27;,//不用改</span></span><br><span class="line"><span class="emphasis"> serverURL: &#x27;&#x27;,//填写你的Waline服务端地址</span></span><br><span class="line"><span class="emphasis"> path: path + &#x27;?q=&#x27; + _</span>id,//不用改</span><br><span class="line"><span class="code"> //后面可按照https://waline.js.org/reference/client/props.html 修改（必须放在path后面！以下为一个例子）</span></span><br><span class="line"><span class="code"> emoji: [&quot;//unpkg.com/@waline/emojis@1.0.1/weibo&quot;,&quot;https://emoji.shojo.cn/bili/src/小黄脸&quot;,&quot;//unpkg.com/@waline/emojis@1.0.1/bilibili&quot;,&quot;https://emoji.shojo.cn/bili/src/枕边童话&quot;,&quot;https://emoji.shojo.cn/bili/src/咩栗&quot;,&quot;https://emoji.shojo.cn/bili/src/呜米&quot;,&quot;https://emoji.shojo.cn/bili/src/进击的冰糖&quot;,&quot;https://emoji.shojo.cn/bili/src/冰糖IO 蜕变·闪耀&quot;,&quot;https://emoji.shojo.cn/bili/src/多多poi&quot;,&quot;https://emoji.shojo.cn/bili/src/穆小泠&quot;,&quot;https://emoji.shojo.cn/bili/src/早稻叽&quot;],// 表情包大全</span></span><br><span class="line"><span class="code"> &#125;);</span></span><br><span class="line"><span class="code"> &#125;</span></span><br><span class="line"><span class="code"> &#125;);</span></span><br><span class="line"><span class="code">&lt;/script&gt;</span></span><br></pre></td></tr></table></figure></li></ul></div><div class="tab-pane active" id="前端引入ispeak-2"><ul><li>在博客目录下运行<code>hexo new page speaks</code></li><li>编辑[blogroot]\source\speaks\index.md，将里面的内容替换成：<figure class="highlight markdown"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br><span class="line">5</span><br><span class="line">6</span><br><span class="line">7</span><br><span class="line">8</span><br><span class="line">9</span><br><span class="line">10</span><br><span class="line">11</span><br><span class="line">12</span><br><span class="line">13</span><br><span class="line">14</span><br><span class="line">15</span><br><span class="line">16</span><br><span class="line">17</span><br><span class="line">18</span><br><span class="line">19</span><br><span class="line">20</span><br><span class="line">21</span><br><span class="line">22</span><br><span class="line">23</span><br><span class="line">24</span><br><span class="line">25</span><br><span class="line">26</span><br><span class="line">27</span><br><span class="line">28</span><br><span class="line">29</span><br><span class="line">30</span><br><span class="line">31</span><br><span class="line">32</span><br><span class="line">33</span><br><span class="line">34</span><br><span class="line">35</span><br><span class="line">36</span><br><span class="line">37</span><br><span class="line">38</span><br><span class="line">39</span><br><span class="line">40</span><br><span class="line">41</span><br><span class="line">42</span><br><span class="line">43</span><br><span class="line">44</span><br><span class="line">45</span><br><span class="line">46</span><br><span class="line">47</span><br><span class="line">48</span><br><span class="line">49</span><br><span class="line">50</span><br><span class="line">51</span><br><span class="line">52</span><br><span class="line">53</span><br><span class="line">54</span><br><span class="line">55</span><br><span class="line">56</span><br><span class="line">57</span><br><span class="line">58</span><br><span class="line">59</span><br><span class="line">60</span><br><span class="line">61</span><br><span class="line">62</span><br><span class="line">63</span><br><span class="line">64</span><br><span class="line">65</span><br><span class="line">66</span><br><span class="line">67</span><br><span class="line">68</span><br><span class="line">69</span><br></pre></td><td class="code"><pre><span class="line">---</span><br><span class="line">title: 说说</span><br><span class="line">comments: false</span><br><span class="line"><span class="section">aside: false</span></span><br><span class="line"><span class="section">---</span></span><br><span class="line">&#123;% raw %&#125;</span><br><span class="line"></span><br><span class="line"><span class="language-xml"><span class="tag">&lt;<span class="name">style</span>&gt;</span></span></span><br><span class="line"> .speak-footer,.tk-footer&#123;</span><br><span class="line"><span class="code"> display:none;</span></span><br><span class="line"><span class="code"> &#125;</span></span><br><span class="line"><span class="code">&lt;/style&gt;</span></span><br><span class="line"><span class="code">&lt;div id=&quot;ispeak&quot;&gt;&lt;/div&gt;</span></span><br><span class="line"><span class="code">&lt;link</span></span><br><span class="line"><span class="code"> rel=&quot;stylesheet&quot;</span></span><br><span class="line"><span class="code"> href=&quot;https://cdn.staticfile.org/highlight.js/10.6.0/styles/atom-one-dark.min.css&quot;</span></span><br><span class="line"><span class="code">/&gt;</span></span><br><span class="line"><span class="code">&lt;link</span></span><br><span class="line"><span class="code"> rel=&quot;stylesheet&quot;</span></span><br><span class="line"><span class="code"> href=&quot;https://npm.elemecdn.com/ispeak@4.4.0/style.css&quot;</span></span><br><span class="line"><span class="code">/&gt;</span></span><br><span class="line"><span class="code">&lt;script src=&quot;https://cdn.staticfile.org/highlight.js/10.6.0/highlight.min.js&quot;&gt;&lt;/script&gt;</span></span><br><span class="line"><span class="code">&lt;script src=&quot;https://cdn.staticfile.org/marked/2.0.0/marked.min.js&quot;&gt;&lt;/script&gt;</span></span><br><span class="line"><span class="code">&lt;script src=&quot;https://npm.elemecdn.com/ispeak@4.4.0/ispeak.umd.js&quot;&gt;&lt;/script&gt;</span></span><br><span class="line"><span class="code">&lt;script src=&quot;https://npm.elemecdn.com/twikoo&quot;&gt;&lt;/script&gt;</span></span><br><span class="line"><span class="code">&lt;script&gt;</span></span><br><span class="line"><span class="code"> function load_ispeak() &#123;</span></span><br><span class="line"><span class="code"> setTimeout(function() &#123;</span></span><br><span class="line"><span class="code"> var HEAD = document.getElementsByTagName(&#x27;head&#x27;)[0] || document.documentElement;</span></span><br><span class="line"><span class="code"> var src = &#x27;https://cdn1.tianli0.top/npm/ispeak/ispeak.umd.js&#x27;</span></span><br><span class="line"><span class="code"> var script = document.createElement(&#x27;script&#x27;)</span></span><br><span class="line"><span class="code"> script.setAttribute(&#x27;type&#x27;,&#x27;text/javascript&#x27;)</span></span><br><span class="line"><span class="code"> script.onload = function() &#123;</span></span><br><span class="line"><span class="code"> pjax_ispeak()</span></span><br><span class="line"><span class="code"> &#125;</span></span><br><span class="line"><span class="code"> script.setAttribute(&#x27;src&#x27;, src)</span></span><br><span class="line"><span class="code"> HEAD.appendChild(script)</span></span><br><span class="line"><span class="code"> &#125;, 1);</span></span><br><span class="line"><span class="code"> &#125;;</span></span><br><span class="line"><span class="code"> function pjax_ispeak() &#123;</span></span><br><span class="line"><span class="code"> if(!document.querySelectorAll(&quot;#ispeak&quot;)[0])return;</span></span><br><span class="line"><span class="code"> ispeak</span></span><br><span class="line"><span class="code"> .init(&#123;</span></span><br><span class="line"><span class="code"> el: &#x27;#ispeak&#x27;,//不用改</span></span><br><span class="line"><span class="code"> api: &#x27;&#x27;, //填写你kkapi地址（不是kkadmin后台地址！）</span></span><br><span class="line"><span class="code"> author: &#x27;&#x27;,//填写个人ID</span></span><br><span class="line"><span class="code"> pageSize: 10,//每页speak显示的条数（建议保持默认，除非你要魔改css）</span></span><br><span class="line"><span class="code"> loading_img: &#x27;https://bu.dusays.com/2021/03/04/d2d5e983e2961.gif&#x27;,//加载动画</span></span><br><span class="line"><span class="code"> comment: function (speak) &#123;</span></span><br><span class="line"><span class="code"> const &#123; _id, title, content &#125; = speak</span></span><br><span class="line"><span class="code"> const contentSub = content.substring(0, 30)</span></span><br><span class="line"><span class="code"> twikoo.init(&#123;</span></span><br><span class="line"><span class="code"> envId: &#x27;&#x27;, // 腾讯云环境填 envId；Vercel 环境填地址（https://xxx.vercel.app）</span></span><br><span class="line"><span class="code"> el: &#x27;.ispeak-comment&#x27;, // 不用改</span></span><br><span class="line"><span class="code"> //region: &#x27;ap-guangzhou&#x27;, // 环境地域，默认为 ap-shanghai，腾讯云环境填 ap-shanghai 或 ap-guangzhou；Vercel 环境不填</span></span><br><span class="line"><span class="code"> path: &#x27;/speak/info.html?q=&#x27; + _id, //不用改，除非你将上面的speak改为别的文件夹昵称</span></span><br><span class="line"><span class="code"> lang: &#x27;zh-CN&#x27;, // 用于手动设定评论区语言，支持的语言列表 https://github.com/imaegoo/twikoo/blob/main/src/client/utils/i18n/index.js</span></span><br><span class="line"><span class="code"> &#125;)</span></span><br><span class="line"><span class="code"> &#125;</span></span><br><span class="line"><span class="code"> &#125;);</span></span><br><span class="line"><span class="code"> &#125;</span></span><br><span class="line"><span class="code"> load_ispeak();</span></span><br><span class="line"><span class="code"> document.addEventListener(&#x27;pjax:complete&#x27;, function () &#123;</span></span><br><span class="line"><span class="code"> pjax_ispeak();</span></span><br><span class="line"><span class="code"> &#125;);</span></span><br><span class="line"><span class="code">&lt;/script&gt;</span></span><br><span class="line"><span class="code">&lt;!--建议标注末尾链接--&gt;</span></span><br><span class="line"><span class="code">&lt;p style=&quot;width: 100%;text-align: end;font-size: .75em;color: #999;margin-top: 1em;&quot;&gt;Powered by &lt;a href=&quot;https://www.antmoe.com/speak/&quot;&gt;&lt;strong&gt;iSpeak&lt;/strong&gt;&lt;/a&gt; | Comment by &lt;a href=&quot;https://twikoo.js.org/&quot;&gt;&lt;strong&gt;Twikoo&lt;/strong&gt;&lt;/a&gt;&lt;/p&gt; </span></span><br><span class="line"><span class="code">&#123;% endraw %&#125;</span></span><br></pre></td></tr></table></figure></li><li>在[blogroot]\source\speaks\下新建info.md，内容为下：<figure class="highlight markdown"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br><span class="line">5</span><br><span class="line">6</span><br><span class="line">7</span><br><span class="line">8</span><br><span class="line">9</span><br><span class="line">10</span><br><span class="line">11</span><br><span class="line">12</span><br><span class="line">13</span><br><span class="line">14</span><br><span class="line">15</span><br><span class="line">16</span><br><span class="line">17</span><br><span class="line">18</span><br><span class="line">19</span><br><span class="line">20</span><br><span class="line">21</span><br><span class="line">22</span><br><span class="line">23</span><br><span class="line">24</span><br><span class="line">25</span><br><span class="line">26</span><br><span class="line">27</span><br><span class="line">28</span><br><span class="line">29</span><br><span class="line">30</span><br><span class="line">31</span><br><span class="line">32</span><br><span class="line">33</span><br><span class="line">34</span><br><span class="line">35</span><br><span class="line">36</span><br><span class="line">37</span><br><span class="line">38</span><br><span class="line">39</span><br><span class="line">40</span><br><span class="line">41</span><br><span class="line">42</span><br><span class="line">43</span><br><span class="line">44</span><br><span class="line">45</span><br><span class="line">46</span><br><span class="line">47</span><br><span class="line">48</span><br><span class="line">49</span><br><span class="line">50</span><br><span class="line">51</span><br><span class="line">52</span><br><span class="line">53</span><br><span class="line">54</span><br><span class="line">55</span><br><span class="line">56</span><br><span class="line">57</span><br><span class="line">58</span><br><span class="line">59</span><br><span class="line">60</span><br><span class="line">61</span><br><span class="line">62</span><br><span class="line">63</span><br><span class="line">64</span><br><span class="line">65</span><br><span class="line">66</span><br><span class="line">67</span><br><span class="line">68</span><br><span class="line">69</span><br><span class="line">70</span><br><span class="line">71</span><br><span class="line">72</span><br><span class="line">73</span><br></pre></td><td class="code"><pre><span class="line">---</span><br><span class="line">title: Speak</span><br><span class="line">aside: false</span><br><span class="line">comments: false</span><br><span class="line"><span class="section">description: 欢迎来到SinzMise的日记，快来看看SinzMise分享了什么！ # speak介绍</span></span><br><span class="line"><span class="section">---</span></span><br><span class="line">&lt;!-- CSS --&gt;</span><br><span class="line"><span class="language-xml"><span class="tag">&lt;<span class="name">link</span> <span class="attr">rel</span>=<span class="string">&quot;stylesheet&quot;</span> <span class="attr">href</span>=<span class="string">&quot;https://cdn.staticfile.org/highlight.js/10.6.0/styles/atom-one-dark.min.css&quot;</span> /&gt;</span></span></span><br><span class="line"><span class="language-xml"><span class="tag">&lt;<span class="name">div</span> <span class="attr">class</span>=<span class="string">&#x27;content&#x27;</span>&gt;</span></span></span><br><span class="line"> <span class="language-xml"><span class="tag">&lt;<span class="name">img</span> <span class="attr">src</span>=<span class="string">&#x27;https://bu.dusays.com/2022/05/01/626e88f349943.gif&#x27;</span>&gt;</span></span></span><br><span class="line"><span class="language-xml"><span class="tag">&lt;/<span class="name">div</span>&gt;</span></span></span><br><span class="line">&#123;% btn &#x27;/speaks/&#x27;,查看全部,far fa-hand-point-right,block center blue larger %&#125;</span><br><span class="line"><span class="language-xml"><span class="tag">&lt;<span class="name">hr</span> /&gt;</span></span></span><br><span class="line"><span class="language-xml"><span class="tag">&lt;<span class="name">div</span> <span class="attr">class</span>=<span class="string">&#x27;ispeak-comment&#x27;</span>&gt;</span></span><span class="language-xml"><span class="tag">&lt;/<span class="name">div</span>&gt;</span></span></span><br><span class="line">&lt;!-- JS --&gt;</span><br><span class="line"><span class="language-xml"><span class="tag">&lt;<span class="name">script</span> <span class="attr">src</span>=<span class="string">&quot;https://npm.elemecdn.com/twikoo&quot;</span>&gt;</span></span><span class="language-xml"><span class="tag">&lt;/<span class="name">script</span>&gt;</span></span></span><br><span class="line"><span class="language-xml"><span class="tag">&lt;<span class="name">script</span> <span class="attr">src</span>=<span class="string">&quot;https://unpkg.com/marked@4.0.18/marked.min.js&quot;</span>&gt;</span></span><span class="language-xml"><span class="tag">&lt;/<span class="name">script</span>&gt;</span></span></span><br><span class="line"><span class="language-xml"><span class="tag">&lt;<span class="name">script</span> <span class="attr">src</span>=<span class="string">&quot;https://cdn.staticfile.org/highlight.js/10.6.0/highlight.min.js&quot;</span>&gt;</span></span><span class="language-xml"><span class="tag">&lt;/<span class="name">script</span>&gt;</span></span></span><br><span class="line"><span class="language-xml"><span class="tag">&lt;<span class="name">script</span>&gt;</span></span></span><br><span class="line"> const searchParams = new URLSearchParams(window.location.search);</span><br><span class="line"> const speakId = searchParams.get(&#x27;q&#x27;);</span><br><span class="line"> const path = window.location.pathname;</span><br><span class="line"> const apiURL = &#x27;https://（你的api地址）/api/ispeak&#x27;;</span><br><span class="line"> const markedRender = (body, loading<span class="emphasis">_img=&#x27;https://bu.dusays.com/2022/05/01/626e88f349943.gif&#x27;) =&gt; &#123;</span></span><br><span class="line"><span class="emphasis"> const renderer = &#123;</span></span><br><span class="line"><span class="emphasis"> image(href, title, text) &#123;</span></span><br><span class="line"><span class="emphasis"> return `<span class="language-xml"><span class="language-javascript">&lt;a href=<span class="string">&quot;$&#123;href&#125;&quot;</span> target=<span class="string">&quot;_blank&quot;</span> data-fancybox=<span class="string">&quot;group&quot;</span> <span class="keyword">class</span>=<span class="string">&quot;fancybox&quot;</span>&gt;</span></span></span></span><br><span class="line"><span class="emphasis"> <span class="language-xml"><span class="language-handlebars"><span class="language-xml"><span class="tag">&lt;<span class="name">img</span> <span class="attr">speak-src</span>=<span class="string">&quot;$&#123;href&#125;&quot;</span> <span class="attr">src</span>=<span class="string">$&#123;loading_img&#125;</span> <span class="attr">alt</span>=<span class="string">&#x27;$&#123;text&#125;&#x27;</span>&gt;</span></span></span></span></span></span><br><span class="line"><span class="emphasis"> <span class="language-xml"><span class="language-handlebars"><span class="language-xml"><span class="tag">&lt;/<span class="name">a</span>&gt;</span></span></span></span>`</span></span><br><span class="line"><span class="emphasis"> &#125;</span></span><br><span class="line"><span class="emphasis"> &#125;</span></span><br><span class="line"><span class="emphasis"> marked.setOptions(&#123;</span></span><br><span class="line"><span class="emphasis"> renderer: new marked.Renderer(),</span></span><br><span class="line"><span class="emphasis"> highlight: function (code) &#123;</span></span><br><span class="line"><span class="emphasis"> if (hljs) &#123;</span></span><br><span class="line"><span class="emphasis"> return hljs.highlightAuto(code).value</span></span><br><span class="line"><span class="emphasis"> &#125; else &#123;</span></span><br><span class="line"><span class="emphasis"> return code</span></span><br><span class="line"><span class="emphasis"> &#125;</span></span><br><span class="line"><span class="emphasis"> &#125;,</span></span><br><span class="line"><span class="emphasis"> pedantic: false,</span></span><br><span class="line"><span class="emphasis"> gfm: true,</span></span><br><span class="line"><span class="emphasis"> tables: true,</span></span><br><span class="line"><span class="emphasis"> breaks: true,</span></span><br><span class="line"><span class="emphasis"> sanitize: false,</span></span><br><span class="line"><span class="emphasis"> smartLists: true,</span></span><br><span class="line"><span class="emphasis"> smartypants: false,</span></span><br><span class="line"><span class="emphasis"> xhtml: false</span></span><br><span class="line"><span class="emphasis"> &#125;)</span></span><br><span class="line"><span class="emphasis"> marked.use(&#123; renderer &#125;)</span></span><br><span class="line"><span class="emphasis"> return marked.parse(body)</span></span><br><span class="line"><span class="emphasis"> &#125;</span></span><br><span class="line"><span class="emphasis"> fetch(`$&#123;apiURL&#125;/get/$&#123;speakId&#125;`)</span></span><br><span class="line"><span class="emphasis"> .then(response =&gt; response.json())</span></span><br><span class="line"><span class="emphasis"> .then(res =&gt; &#123;</span></span><br><span class="line"><span class="emphasis"> const data = res.data;</span></span><br><span class="line"><span class="emphasis"> if(data)&#123;</span></span><br><span class="line"><span class="emphasis"> const &#123;title,content&#125; = data;</span></span><br><span class="line"><span class="emphasis"> const contentSub = content.substring(0, 30);</span></span><br><span class="line"><span class="emphasis"> document.querySelector(&#x27;.content&#x27;).innerHTML = markedRender(content);</span></span><br><span class="line"><span class="emphasis"> if(title)&#123;</span></span><br><span class="line"><span class="emphasis"> document.title = title;</span></span><br><span class="line"><span class="emphasis"> &#125;</span></span><br><span class="line"><span class="emphasis"> twikoo.init(&#123;</span></span><br><span class="line"><span class="emphasis"> envId: &#x27;&#x27;, // 腾讯云环境填 envId；Vercel 环境填地址（https://xxx.vercel.app）</span></span><br><span class="line"><span class="emphasis"> el: &#x27;.ispeak-comment&#x27;, // 不用改</span></span><br><span class="line"><span class="emphasis"> //region: &#x27;ap-guangzhou&#x27;, // 环境地域，默认为 ap-shanghai，腾讯云环境填 ap-shanghai 或 ap-guangzhou；Vercel 环境不填</span></span><br><span class="line"><span class="emphasis"> path: path + &#x27;?q=&#x27; + speakId, // 不用改</span></span><br><span class="line"><span class="emphasis"> lang: &#x27;zh-CN&#x27;, // 用于手动设定评论区语言，支持的语言列表 https://github.com/imaegoo/twikoo/blob/main/src/client/utils/i18n/index.js</span></span><br><span class="line"><span class="emphasis"> &#125;)</span></span><br><span class="line"><span class="emphasis"> &#125;</span></span><br><span class="line"><span class="emphasis"> &#125;);</span></span><br><span class="line"><span class="emphasis"><span class="language-xml"><span class="tag">&lt;/<span class="name">script</span>&gt;</span></span></span></span><br></pre></td></tr></table></figure></li></ul></div><div class="tab-pane" id="前端引入ispeak-3"><ul><li>在博客目录下运行<code>hexo new page speaks</code></li><li>编辑[blogroot]\source\speaks\index.md，将里面的内容替换成：<figure class="highlight markdown"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br><span class="line">5</span><br><span class="line">6</span><br><span class="line">7</span><br><span class="line">8</span><br><span class="line">9</span><br><span class="line">10</span><br><span class="line">11</span><br><span class="line">12</span><br><span class="line">13</span><br><span class="line">14</span><br><span class="line">15</span><br><span class="line">16</span><br><span class="line">17</span><br><span class="line">18</span><br><span class="line">19</span><br><span class="line">20</span><br><span class="line">21</span><br><span class="line">22</span><br><span class="line">23</span><br><span class="line">24</span><br><span class="line">25</span><br><span class="line">26</span><br><span class="line">27</span><br><span class="line">28</span><br><span class="line">29</span><br><span class="line">30</span><br><span class="line">31</span><br><span class="line">32</span><br><span class="line">33</span><br><span class="line">34</span><br><span class="line">35</span><br><span class="line">36</span><br><span class="line">37</span><br><span class="line">38</span><br><span class="line">39</span><br><span class="line">40</span><br><span class="line">41</span><br><span class="line">42</span><br><span class="line">43</span><br><span class="line">44</span><br><span class="line">45</span><br><span class="line">46</span><br><span class="line">47</span><br><span class="line">48</span><br><span class="line">49</span><br><span class="line">50</span><br><span class="line">51</span><br><span class="line">52</span><br><span class="line">53</span><br><span class="line">54</span><br><span class="line">55</span><br><span class="line">56</span><br><span class="line">57</span><br><span class="line">58</span><br><span class="line">59</span><br><span class="line">60</span><br><span class="line">61</span><br><span class="line">62</span><br><span class="line">63</span><br><span class="line">64</span><br><span class="line">65</span><br><span class="line">66</span><br><span class="line">67</span><br><span class="line">68</span><br><span class="line">69</span><br><span class="line">70</span><br></pre></td><td class="code"><pre><span class="line">---</span><br><span class="line">title: 说说</span><br><span class="line">comments: false</span><br><span class="line"><span class="section">aside: false</span></span><br><span class="line"><span class="section">---</span></span><br><span class="line">&#123;% raw %&#125;</span><br><span class="line"></span><br><span class="line"><span class="language-xml"><span class="tag">&lt;<span class="name">style</span>&gt;</span></span></span><br><span class="line"> .speak-footer,.D-footer&#123;</span><br><span class="line"><span class="code"> display:none;</span></span><br><span class="line"><span class="code"> &#125;</span></span><br><span class="line"><span class="code">&lt;/style&gt;</span></span><br><span class="line"><span class="code">&lt;div id=&quot;ispeak&quot;&gt;&lt;/div&gt;</span></span><br><span class="line"><span class="code">&lt;link</span></span><br><span class="line"><span class="code"> rel=&quot;stylesheet&quot;</span></span><br><span class="line"><span class="code"> href=&quot;https://cdn.staticfile.org/highlight.js/10.6.0/styles/atom-one-dark.min.css&quot;</span></span><br><span class="line"><span class="code">/&gt;</span></span><br><span class="line"><span class="code">&lt;link</span></span><br><span class="line"><span class="code"> rel=&quot;stylesheet&quot;</span></span><br><span class="line"><span class="code"> href=&quot;https://npm.elemecdn.com/ispeak@4.4.0/style.css&quot;</span></span><br><span class="line"><span class="code">/&gt;</span></span><br><span class="line"><span class="code">&lt;script src=&quot;https://cdn.staticfile.org/highlight.js/10.6.0/highlight.min.js&quot;&gt;&lt;/script&gt;</span></span><br><span class="line"><span class="code">&lt;script src=&quot;https://cdn.staticfile.org/marked/2.0.0/marked.min.js&quot;&gt;&lt;/script&gt;</span></span><br><span class="line"><span class="code">&lt;script src=&quot;https://npm.elemecdn.com/ispeak@4.4.0/ispeak.umd.js&quot;&gt;&lt;/script&gt;</span></span><br><span class="line"><span class="code">&lt;script src=&quot;https://npm.elemecdn.com/discuss@latest/dist/discuss.js&quot;&gt;&lt;/script&gt;</span></span><br><span class="line"><span class="code">&lt;script&gt;</span></span><br><span class="line"><span class="code"> function load_ispeak() &#123;</span></span><br><span class="line"><span class="code"> setTimeout(function() &#123;</span></span><br><span class="line"><span class="code"> var HEAD = document.getElementsByTagName(&#x27;head&#x27;)[0] || document.documentElement;</span></span><br><span class="line"><span class="code"> var src = &#x27;https://cdn1.tianli0.top/npm/ispeak/ispeak.umd.js&#x27;</span></span><br><span class="line"><span class="code"> var script = document.createElement(&#x27;script&#x27;)</span></span><br><span class="line"><span class="code"> script.setAttribute(&#x27;type&#x27;,&#x27;text/javascript&#x27;)</span></span><br><span class="line"><span class="code"> script.onload = function() &#123;</span></span><br><span class="line"><span class="code"> pjax_ispeak()</span></span><br><span class="line"><span class="code"> &#125;</span></span><br><span class="line"><span class="code"> script.setAttribute(&#x27;src&#x27;, src)</span></span><br><span class="line"><span class="code"> HEAD.appendChild(script)</span></span><br><span class="line"><span class="code"> &#125;, 1);</span></span><br><span class="line"><span class="code"> &#125;;</span></span><br><span class="line"><span class="code"> function pjax_ispeak() &#123;</span></span><br><span class="line"><span class="code"> if(!document.querySelectorAll(&quot;#ispeak&quot;)[0])return;</span></span><br><span class="line"><span class="code"> ispeak</span></span><br><span class="line"><span class="code"> .init(&#123;</span></span><br><span class="line"><span class="code"> el: &#x27;#ispeak&#x27;,//不用改</span></span><br><span class="line"><span class="code"> api: &#x27;&#x27;, //填写你kkapi地址（不是kkadmin后台地址！）</span></span><br><span class="line"><span class="code"> author: &#x27;&#x27;,//填写个人ID</span></span><br><span class="line"><span class="code"> pageSize: 10,//每页speak显示的条数（建议保持默认，除非你要魔改css）</span></span><br><span class="line"><span class="code"> loading_img: &#x27;https://bu.dusays.com/2021/03/04/d2d5e983e2961.gif&#x27;,//加载动画</span></span><br><span class="line"><span class="code"> comment: function (speak) &#123;</span></span><br><span class="line"><span class="code"> const &#123; _id, title, content &#125; = speak</span></span><br><span class="line"><span class="code"> const contentSub = content.substring(0, 30)</span></span><br><span class="line"><span class="code"> discuss.init(&#123;</span></span><br><span class="line"><span class="code"> el: &#x27;.ispeak-comment&#x27;,// 不用改</span></span><br><span class="line"><span class="code"> serverURLs: &#x27;&#x27;,//填写你的Discuss服务端地址</span></span><br><span class="line"><span class="code"> path: &#x27;/speak/info.html?q=&#x27; + _id,//不用改，除非你将上面的speak改为别的文件夹昵称</span></span><br><span class="line"><span class="code"> //后面可按照https://discuss.js.org/Quick-Start.html#%E5%AE%A2%E6%88%B7%E7%AB%AF-client 修改（必须放在path后面！以下为一个例子）</span></span><br><span class="line"><span class="code"> ph: &#x27;千山万水总是情，给个评论行不行&#x27; ,//评论框占位符</span></span><br><span class="line"><span class="code"> imgLoading: &#x27;https://bu.dusays.com/2021/03/04/d2d5e983e2961.gif&#x27;//评论图片加载动画</span></span><br><span class="line"><span class="code"> &#125;)</span></span><br><span class="line"><span class="code"> &#125;</span></span><br><span class="line"><span class="code"> &#125;);</span></span><br><span class="line"><span class="code"> &#125;</span></span><br><span class="line"><span class="code"> load_ispeak();</span></span><br><span class="line"><span class="code"> document.addEventListener(&#x27;pjax:complete&#x27;, function () &#123;</span></span><br><span class="line"><span class="code"> pjax_ispeak();</span></span><br><span class="line"><span class="code"> &#125;);</span></span><br><span class="line"><span class="code">&lt;/script&gt;</span></span><br><span class="line"><span class="code">&lt;!--建议标注末尾链接--&gt;</span></span><br><span class="line"><span class="code">&lt;p style=&quot;width: 100%;text-align: end;font-size: .75em;color: #999;margin-top: 1em;&quot;&gt;Powered by &lt;a href=&quot;https://www.antmoe.com/speak/&quot;&gt;&lt;strong&gt;iSpeak&lt;/strong&gt;&lt;/a&gt; | Comment by &lt;a href=&quot;https://discuss.js.org/&quot;&gt;&lt;strong&gt;Discuss&lt;/strong&gt;&lt;/a&gt;&lt;/p&gt; </span></span><br><span class="line"><span class="code">&#123;% endraw %&#125;</span></span><br></pre></td></tr></table></figure></li><li>在[blogroot]\source\speaks\下新建info.md，内容为下：<figure class="highlight markdown"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br><span class="line">5</span><br><span class="line">6</span><br><span class="line">7</span><br><span class="line">8</span><br><span class="line">9</span><br><span class="line">10</span><br><span class="line">11</span><br><span class="line">12</span><br><span class="line">13</span><br><span class="line">14</span><br><span class="line">15</span><br><span class="line">16</span><br><span class="line">17</span><br><span class="line">18</span><br><span class="line">19</span><br><span class="line">20</span><br><span class="line">21</span><br><span class="line">22</span><br><span class="line">23</span><br><span class="line">24</span><br><span class="line">25</span><br><span class="line">26</span><br><span class="line">27</span><br><span class="line">28</span><br><span class="line">29</span><br><span class="line">30</span><br><span class="line">31</span><br><span class="line">32</span><br><span class="line">33</span><br><span class="line">34</span><br><span class="line">35</span><br><span class="line">36</span><br><span class="line">37</span><br><span class="line">38</span><br><span class="line">39</span><br><span class="line">40</span><br><span class="line">41</span><br><span class="line">42</span><br><span class="line">43</span><br><span class="line">44</span><br><span class="line">45</span><br><span class="line">46</span><br><span class="line">47</span><br><span class="line">48</span><br><span class="line">49</span><br><span class="line">50</span><br><span class="line">51</span><br><span class="line">52</span><br><span class="line">53</span><br><span class="line">54</span><br><span class="line">55</span><br><span class="line">56</span><br><span class="line">57</span><br><span class="line">58</span><br><span class="line">59</span><br><span class="line">60</span><br><span class="line">61</span><br><span class="line">62</span><br><span class="line">63</span><br><span class="line">64</span><br><span class="line">65</span><br><span class="line">66</span><br><span class="line">67</span><br><span class="line">68</span><br><span class="line">69</span><br><span class="line">70</span><br><span class="line">71</span><br><span class="line">72</span><br><span class="line">73</span><br><span class="line">74</span><br></pre></td><td class="code"><pre><span class="line">---</span><br><span class="line">title: Speak</span><br><span class="line">aside: false</span><br><span class="line">comments: false</span><br><span class="line"><span class="section">description: 欢迎来到SinzMise的日记，快来看看SinzMise分享了什么！ # speak介绍</span></span><br><span class="line"><span class="section">---</span></span><br><span class="line">&lt;!-- CSS --&gt;</span><br><span class="line"><span class="language-xml"><span class="tag">&lt;<span class="name">link</span> <span class="attr">rel</span>=<span class="string">&quot;stylesheet&quot;</span> <span class="attr">href</span>=<span class="string">&quot;https://cdn.staticfile.org/highlight.js/10.6.0/styles/atom-one-dark.min.css&quot;</span> /&gt;</span></span></span><br><span class="line"><span class="language-xml"><span class="tag">&lt;<span class="name">div</span> <span class="attr">class</span>=<span class="string">&#x27;content&#x27;</span>&gt;</span></span></span><br><span class="line"> <span class="language-xml"><span class="tag">&lt;<span class="name">img</span> <span class="attr">src</span>=<span class="string">&#x27;https://bu.dusays.com/2022/05/01/626e88f349943.gif&#x27;</span>&gt;</span></span></span><br><span class="line"><span class="language-xml"><span class="tag">&lt;/<span class="name">div</span>&gt;</span></span></span><br><span class="line">&#123;% btn &#x27;/speaks/&#x27;,查看全部,far fa-hand-point-right,block center blue larger %&#125;</span><br><span class="line"><span class="language-xml"><span class="tag">&lt;<span class="name">hr</span> /&gt;</span></span></span><br><span class="line"><span class="language-xml"><span class="tag">&lt;<span class="name">div</span> <span class="attr">class</span>=<span class="string">&#x27;ispeak-comment&#x27;</span>&gt;</span></span><span class="language-xml"><span class="tag">&lt;/<span class="name">div</span>&gt;</span></span></span><br><span class="line">&lt;!-- JS --&gt;</span><br><span class="line"><span class="language-xml"><span class="tag">&lt;<span class="name">script</span> <span class="attr">src</span>=<span class="string">&quot;https://npm.elemecdn.com/discuss@latest/dist/discuss.js&quot;</span>&gt;</span></span><span class="language-xml"><span class="tag">&lt;/<span class="name">script</span>&gt;</span></span></span><br><span class="line"><span class="language-xml"><span class="tag">&lt;<span class="name">script</span> <span class="attr">src</span>=<span class="string">&quot;https://unpkg.com/marked@4.0.18/marked.min.js&quot;</span>&gt;</span></span><span class="language-xml"><span class="tag">&lt;/<span class="name">script</span>&gt;</span></span></span><br><span class="line"><span class="language-xml"><span class="tag">&lt;<span class="name">script</span> <span class="attr">src</span>=<span class="string">&quot;https://cdn.staticfile.org/highlight.js/10.6.0/highlight.min.js&quot;</span>&gt;</span></span><span class="language-xml"><span class="tag">&lt;/<span class="name">script</span>&gt;</span></span></span><br><span class="line"><span class="language-xml"><span class="tag">&lt;<span class="name">script</span>&gt;</span></span></span><br><span class="line"> const searchParams = new URLSearchParams(window.location.search);</span><br><span class="line"> const speakId = searchParams.get(&#x27;q&#x27;);</span><br><span class="line"> const path = window.location.pathname;</span><br><span class="line"> const apiURL = &#x27;https://（你的api地址）/api/ispeak&#x27;; //api地址</span><br><span class="line"> const markedRender = (body, loading<span class="emphasis">_img=&#x27;https://bu.dusays.com/2022/05/01/626e88f349943.gif&#x27;) =&gt; &#123;</span></span><br><span class="line"><span class="emphasis"> const renderer = &#123;</span></span><br><span class="line"><span class="emphasis"> image(href, title, text) &#123;</span></span><br><span class="line"><span class="emphasis"> return `<span class="language-xml"><span class="language-javascript">&lt;a href=<span class="string">&quot;$&#123;href&#125;&quot;</span> target=<span class="string">&quot;_blank&quot;</span> data-fancybox=<span class="string">&quot;group&quot;</span> <span class="keyword">class</span>=<span class="string">&quot;fancybox&quot;</span>&gt;</span></span></span></span><br><span class="line"><span class="emphasis"> <span class="language-xml"><span class="language-handlebars"><span class="language-xml"><span class="tag">&lt;<span class="name">img</span> <span class="attr">speak-src</span>=<span class="string">&quot;$&#123;href&#125;&quot;</span> <span class="attr">src</span>=<span class="string">$&#123;loading_img&#125;</span> <span class="attr">alt</span>=<span class="string">&#x27;$&#123;text&#125;&#x27;</span>&gt;</span></span></span></span></span></span><br><span class="line"><span class="emphasis"> <span class="language-xml"><span class="language-handlebars"><span class="language-xml"><span class="tag">&lt;/<span class="name">a</span>&gt;</span></span></span></span>`</span></span><br><span class="line"><span class="emphasis"> &#125;</span></span><br><span class="line"><span class="emphasis"> &#125;</span></span><br><span class="line"><span class="emphasis"> marked.setOptions(&#123;</span></span><br><span class="line"><span class="emphasis"> renderer: new marked.Renderer(),</span></span><br><span class="line"><span class="emphasis"> highlight: function (code) &#123;</span></span><br><span class="line"><span class="emphasis"> if (hljs) &#123;</span></span><br><span class="line"><span class="emphasis"> return hljs.highlightAuto(code).value</span></span><br><span class="line"><span class="emphasis"> &#125; else &#123;</span></span><br><span class="line"><span class="emphasis"> return code</span></span><br><span class="line"><span class="emphasis"> &#125;</span></span><br><span class="line"><span class="emphasis"> &#125;,</span></span><br><span class="line"><span class="emphasis"> pedantic: false,</span></span><br><span class="line"><span class="emphasis"> gfm: true,</span></span><br><span class="line"><span class="emphasis"> tables: true,</span></span><br><span class="line"><span class="emphasis"> breaks: true,</span></span><br><span class="line"><span class="emphasis"> sanitize: false,</span></span><br><span class="line"><span class="emphasis"> smartLists: true,</span></span><br><span class="line"><span class="emphasis"> smartypants: false,</span></span><br><span class="line"><span class="emphasis"> xhtml: false</span></span><br><span class="line"><span class="emphasis"> &#125;)</span></span><br><span class="line"><span class="emphasis"> marked.use(&#123; renderer &#125;)</span></span><br><span class="line"><span class="emphasis"> return marked.parse(body)</span></span><br><span class="line"><span class="emphasis"> &#125;</span></span><br><span class="line"><span class="emphasis"> fetch(`$&#123;apiURL&#125;/get/$&#123;speakId&#125;`)</span></span><br><span class="line"><span class="emphasis"> .then(response =&gt; response.json())</span></span><br><span class="line"><span class="emphasis"> .then(res =&gt; &#123;</span></span><br><span class="line"><span class="emphasis"> const data = res.data;</span></span><br><span class="line"><span class="emphasis"> if(data)&#123;</span></span><br><span class="line"><span class="emphasis"> const &#123;title,content&#125; = data;</span></span><br><span class="line"><span class="emphasis"> const contentSub = content.substring(0, 30);</span></span><br><span class="line"><span class="emphasis"> document.querySelector(&#x27;.content&#x27;).innerHTML = markedRender(content);</span></span><br><span class="line"><span class="emphasis"> if(title)&#123;</span></span><br><span class="line"><span class="emphasis"> document.title = title;</span></span><br><span class="line"><span class="emphasis"> &#125;</span></span><br><span class="line"><span class="emphasis"> discuss.init(&#123;</span></span><br><span class="line"><span class="emphasis"> el: &#x27;.ispeak-comment&#x27;,// 不用改</span></span><br><span class="line"><span class="emphasis"> serverURLs: &#x27;&#x27;,//填写你的Discuss服务端地址</span></span><br><span class="line"><span class="emphasis"> path: path + &#x27;?q=&#x27; + speakId,// 不用改</span></span><br><span class="line"><span class="emphasis"> //后面可按照https://discuss.js.org/Quick-Start.html#%E5%AE%A2%E6%88%B7%E7%AB%AF-client 修改（必须放在path后面！以下为一个例子）</span></span><br><span class="line"><span class="emphasis"> ph: &#x27;千山万水总是情，给个评论行不行&#x27; ,//评论框占位符</span></span><br><span class="line"><span class="emphasis"> imgLoading: &#x27;https://bu.dusays.com/2021/03/04/d2d5e983e2961.gif&#x27;//评论图片加载动画</span></span><br><span class="line"><span class="emphasis"> &#125;)</span></span><br><span class="line"><span class="emphasis"> &#125;</span></span><br><span class="line"><span class="emphasis"> &#125;);</span></span><br><span class="line"><span class="emphasis"><span class="language-xml"><span class="tag">&lt;/<span class="name">script</span>&gt;</span></span></span></span><br></pre></td></tr></table></figure></li></ul></div><div class="tab-pane" id="前端引入ispeak-4"><ul><li>在博客目录下运行<code>hexo new page speaks</code></li><li>编辑[blogroot]\source\speaks\index.md，将里面的内容替换成：<figure class="highlight markdown"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br><span class="line">5</span><br><span class="line">6</span><br><span class="line">7</span><br><span class="line">8</span><br><span class="line">9</span><br><span class="line">10</span><br><span class="line">11</span><br><span class="line">12</span><br><span class="line">13</span><br><span class="line">14</span><br><span class="line">15</span><br><span class="line">16</span><br><span class="line">17</span><br><span class="line">18</span><br><span class="line">19</span><br><span class="line">20</span><br><span class="line">21</span><br><span class="line">22</span><br><span class="line">23</span><br><span class="line">24</span><br><span class="line">25</span><br><span class="line">26</span><br><span class="line">27</span><br><span class="line">28</span><br><span class="line">29</span><br><span class="line">30</span><br><span class="line">31</span><br><span class="line">32</span><br><span class="line">33</span><br><span class="line">34</span><br><span class="line">35</span><br><span class="line">36</span><br><span class="line">37</span><br><span class="line">38</span><br><span class="line">39</span><br><span class="line">40</span><br><span class="line">41</span><br><span class="line">42</span><br><span class="line">43</span><br><span class="line">44</span><br><span class="line">45</span><br><span class="line">46</span><br><span class="line">47</span><br><span class="line">48</span><br><span class="line">49</span><br><span class="line">50</span><br><span class="line">51</span><br><span class="line">52</span><br><span class="line">53</span><br><span class="line">54</span><br><span class="line">55</span><br><span class="line">56</span><br><span class="line">57</span><br><span class="line">58</span><br><span class="line">59</span><br><span class="line">60</span><br><span class="line">61</span><br><span class="line">62</span><br><span class="line">63</span><br><span class="line">64</span><br><span class="line">65</span><br><span class="line">66</span><br><span class="line">67</span><br><span class="line">68</span><br><span class="line">69</span><br><span class="line">70</span><br><span class="line">71</span><br></pre></td><td class="code"><pre><span class="line">---</span><br><span class="line">title: 说说</span><br><span class="line">comments: false</span><br><span class="line"><span class="section">aside: false</span></span><br><span class="line"><span class="section">---</span></span><br><span class="line">&#123;% raw %&#125;</span><br><span class="line"><span class="language-xml"><span class="tag">&lt;<span class="name">style</span>&gt;</span></span></span><br><span class="line"> .speak-footer,.atk-list-footer&#123;</span><br><span class="line"><span class="code"> display:none;</span></span><br><span class="line"><span class="code"> &#125;</span></span><br><span class="line"><span class="code">&lt;/style&gt;</span></span><br><span class="line"><span class="code">&lt;div id=&quot;ispeak&quot;&gt;&lt;/div&gt;</span></span><br><span class="line"><span class="code">&lt;link</span></span><br><span class="line"><span class="code"> rel=&quot;stylesheet&quot;</span></span><br><span class="line"><span class="code"> href=&quot;https://cdn.staticfile.org/highlight.js/10.6.0/styles/atom-one-dark.min.css&quot;</span></span><br><span class="line"><span class="code">/&gt;</span></span><br><span class="line"><span class="code">&lt;link</span></span><br><span class="line"><span class="code"> rel=&quot;stylesheet&quot;</span></span><br><span class="line"><span class="code"> href=&quot;https://npm.elemecdn.com/ispeak@4.4.0/style.css&quot;</span></span><br><span class="line"><span class="code">/&gt;</span></span><br><span class="line"><span class="code">&lt;script src=&quot;https://cdn.staticfile.org/highlight.js/10.6.0/highlight.min.js&quot;&gt;&lt;/script&gt;</span></span><br><span class="line"><span class="code">&lt;script src=&quot;https://cdn.staticfile.org/marked/2.0.0/marked.min.js&quot;&gt;&lt;/script&gt;</span></span><br><span class="line"><span class="code">&lt;script src=&quot;https://npm.elemecdn.com/ispeak@4.4.0/ispeak.umd.js&quot;&gt;&lt;/script&gt;</span></span><br><span class="line"><span class="code">&lt;!-- CSS --&gt;</span></span><br><span class="line"><span class="code">&lt;link href=&quot;https://unpkg.com/artalk@2.3.4/dist/Artalk.css&quot; rel=&quot;stylesheet&quot; /&gt;</span></span><br><span class="line"><span class="code">&lt;!-- JS --&gt;</span></span><br><span class="line"><span class="code">&lt;script src=&quot;https://unpkg.com/artalk@2.3.4/dist/Artalk.js&quot;&gt;&lt;/script&gt;</span></span><br><span class="line"><span class="code">&lt;script&gt;</span></span><br><span class="line"><span class="code"> function load_ispeak() &#123;</span></span><br><span class="line"><span class="code"> setTimeout(function() &#123;</span></span><br><span class="line"><span class="code"> var HEAD = document.getElementsByTagName(&#x27;head&#x27;)[0] || document.documentElement;</span></span><br><span class="line"><span class="code"> var src = &#x27;https://cdn1.tianli0.top/npm/ispeak/ispeak.umd.js&#x27;</span></span><br><span class="line"><span class="code"> var script = document.createElement(&#x27;script&#x27;)</span></span><br><span class="line"><span class="code"> script.setAttribute(&#x27;type&#x27;,&#x27;text/javascript&#x27;)</span></span><br><span class="line"><span class="code"> script.onload = function() &#123;</span></span><br><span class="line"><span class="code"> pjax_ispeak()</span></span><br><span class="line"><span class="code"> &#125;</span></span><br><span class="line"><span class="code"> script.setAttribute(&#x27;src&#x27;, src)</span></span><br><span class="line"><span class="code"> HEAD.appendChild(script)</span></span><br><span class="line"><span class="code"> &#125;, 1);</span></span><br><span class="line"><span class="code"> &#125;;</span></span><br><span class="line"><span class="code"> function pjax_ispeak() &#123;</span></span><br><span class="line"><span class="code"> if(!document.querySelectorAll(&quot;#ispeak&quot;)[0])return;</span></span><br><span class="line"><span class="code"> ispeak</span></span><br><span class="line"><span class="code"> .init(&#123;</span></span><br><span class="line"><span class="code"> el: &#x27;#ispeak&#x27;,//不用改</span></span><br><span class="line"><span class="code"> api: &#x27;&#x27;, //填写你kkapi地址（不是kkadmin后台地址！）</span></span><br><span class="line"><span class="code"> author: &#x27;&#x27;,//填写个人ID</span></span><br><span class="line"><span class="code"> pageSize: 10,//每页speak显示的条数（建议保持默认，除非你要魔改css）</span></span><br><span class="line"><span class="code"> loading_img: &#x27;https://bu.dusays.com/2021/03/04/d2d5e983e2961.gif&#x27;,//加载动画</span></span><br><span class="line"><span class="code"> comment: function (speak) &#123;</span></span><br><span class="line"><span class="code"> const &#123; _id, title, content &#125; = speak</span></span><br><span class="line"><span class="code"> const contentSub = content.substring(0, 30)</span></span><br><span class="line"><span class="code"> new Artalk(&#123;</span></span><br><span class="line"><span class="code"> el: &#x27;.ispeak-comment&#x27;, // 不用改</span></span><br><span class="line"><span class="code"> pageKey: &#x27;/speak/info.html?q=&#x27; + _id, //不用改，除非你将上面的speak改为别的文件夹昵称</span></span><br><span class="line"><span class="code"> pageTitle: title || contentSub, // 不用改</span></span><br><span class="line"><span class="code"> server: &#x27;&#x27;, //填写你的Artalk服务端地址</span></span><br><span class="line"><span class="code"> site: &#x27;&#x27; // 填写你的站点名</span></span><br><span class="line"><span class="code"> &#125;)</span></span><br><span class="line"><span class="code"> &#125;</span></span><br><span class="line"><span class="code"> &#125;);</span></span><br><span class="line"><span class="code"> &#125;</span></span><br><span class="line"><span class="code"> load_ispeak();</span></span><br><span class="line"><span class="code"> document.addEventListener(&#x27;pjax:complete&#x27;, function () &#123;</span></span><br><span class="line"><span class="code"> pjax_ispeak();</span></span><br><span class="line"><span class="code"> &#125;);</span></span><br><span class="line"><span class="code">&lt;/script&gt;</span></span><br><span class="line"><span class="code">&lt;!--建议标注末尾链接--&gt;</span></span><br><span class="line"><span class="code">&lt;p style=&quot;width: 100%;text-align: end;font-size: .75em;color: #999;margin-top: 1em;&quot;&gt;Powered by &lt;a href=&quot;https://www.antmoe.com/speak/&quot;&gt;&lt;strong&gt;iSpeak&lt;/strong&gt;&lt;/a&gt; | Comment by &lt;a href=&quot;https://artalk.js.org/&quot;&gt;&lt;strong&gt;Artalk&lt;/strong&gt;&lt;/a&gt;&lt;/p&gt; </span></span><br><span class="line"><span class="code">&#123;% endraw %&#125;</span></span><br></pre></td></tr></table></figure></li><li>在[blogroot]\source\speaks\下新建info.md，内容为下：<figure class="highlight markdown"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br><span class="line">5</span><br><span class="line">6</span><br><span class="line">7</span><br><span class="line">8</span><br><span class="line">9</span><br><span class="line">10</span><br><span class="line">11</span><br><span class="line">12</span><br><span class="line">13</span><br><span class="line">14</span><br><span class="line">15</span><br><span class="line">16</span><br><span class="line">17</span><br><span class="line">18</span><br><span class="line">19</span><br><span class="line">20</span><br><span class="line">21</span><br><span class="line">22</span><br><span class="line">23</span><br><span class="line">24</span><br><span class="line">25</span><br><span class="line">26</span><br><span class="line">27</span><br><span class="line">28</span><br><span class="line">29</span><br><span class="line">30</span><br><span class="line">31</span><br><span class="line">32</span><br><span class="line">33</span><br><span class="line">34</span><br><span class="line">35</span><br><span class="line">36</span><br><span class="line">37</span><br><span class="line">38</span><br><span class="line">39</span><br><span class="line">40</span><br><span class="line">41</span><br><span class="line">42</span><br><span class="line">43</span><br><span class="line">44</span><br><span class="line">45</span><br><span class="line">46</span><br><span class="line">47</span><br><span class="line">48</span><br><span class="line">49</span><br><span class="line">50</span><br><span class="line">51</span><br><span class="line">52</span><br><span class="line">53</span><br><span class="line">54</span><br><span class="line">55</span><br><span class="line">56</span><br><span class="line">57</span><br><span class="line">58</span><br><span class="line">59</span><br><span class="line">60</span><br><span class="line">61</span><br><span class="line">62</span><br><span class="line">63</span><br><span class="line">64</span><br><span class="line">65</span><br><span class="line">66</span><br><span class="line">67</span><br><span class="line">68</span><br><span class="line">69</span><br><span class="line">70</span><br><span class="line">71</span><br><span class="line">72</span><br><span class="line">73</span><br><span class="line">74</span><br></pre></td><td class="code"><pre><span class="line">---</span><br><span class="line">title: Speak</span><br><span class="line">aside: false</span><br><span class="line">comments: false</span><br><span class="line"><span class="section">description: 欢迎来到SinzMise的日记，快来看看SinzMise分享了什么！ # speak介绍</span></span><br><span class="line"><span class="section">---</span></span><br><span class="line">&lt;!-- CSS --&gt;</span><br><span class="line"><span class="language-xml"><span class="tag">&lt;<span class="name">link</span> <span class="attr">href</span>=<span class="string">&quot;https://unpkg.com/artalk@2.3.4/dist/Artalk.css&quot;</span> <span class="attr">rel</span>=<span class="string">&quot;stylesheet&quot;</span> /&gt;</span></span></span><br><span class="line"><span class="language-xml"><span class="tag">&lt;<span class="name">link</span> <span class="attr">rel</span>=<span class="string">&quot;stylesheet&quot;</span> <span class="attr">href</span>=<span class="string">&quot;https://cdn.staticfile.org/highlight.js/10.6.0/styles/atom-one-dark.min.css&quot;</span> /&gt;</span></span></span><br><span class="line"><span class="language-xml"><span class="tag">&lt;<span class="name">div</span> <span class="attr">class</span>=<span class="string">&#x27;content&#x27;</span>&gt;</span></span></span><br><span class="line"> <span class="language-xml"><span class="tag">&lt;<span class="name">img</span> <span class="attr">src</span>=<span class="string">&#x27;https://bu.dusays.com/2022/05/01/626e88f349943.gif&#x27;</span>&gt;</span></span></span><br><span class="line"><span class="language-xml"><span class="tag">&lt;/<span class="name">div</span>&gt;</span></span></span><br><span class="line">&#123;% btn &#x27;/speaks/&#x27;,查看全部,far fa-hand-point-right,block center blue larger %&#125;</span><br><span class="line"><span class="language-xml"><span class="tag">&lt;<span class="name">hr</span> /&gt;</span></span></span><br><span class="line"><span class="language-xml"><span class="tag">&lt;<span class="name">div</span> <span class="attr">class</span>=<span class="string">&#x27;ispeak-comment&#x27;</span>&gt;</span></span><span class="language-xml"><span class="tag">&lt;/<span class="name">div</span>&gt;</span></span></span><br><span class="line">&lt;!-- JS --&gt;</span><br><span class="line"><span class="language-xml"><span class="tag">&lt;<span class="name">script</span> <span class="attr">src</span>=<span class="string">&quot;https://unpkg.com/artalk@2.3.4/dist/Artalk.js&quot;</span>&gt;</span></span><span class="language-xml"><span class="tag">&lt;/<span class="name">script</span>&gt;</span></span></span><br><span class="line"><span class="language-xml"><span class="tag">&lt;<span class="name">script</span> <span class="attr">src</span>=<span class="string">&quot;https://unpkg.com/marked@4.0.18/marked.min.js&quot;</span>&gt;</span></span><span class="language-xml"><span class="tag">&lt;/<span class="name">script</span>&gt;</span></span></span><br><span class="line"><span class="language-xml"><span class="tag">&lt;<span class="name">script</span> <span class="attr">src</span>=<span class="string">&quot;https://cdn.staticfile.org/highlight.js/10.6.0/highlight.min.js&quot;</span>&gt;</span></span><span class="language-xml"><span class="tag">&lt;/<span class="name">script</span>&gt;</span></span></span><br><span class="line"><span class="language-xml"><span class="tag">&lt;<span class="name">script</span>&gt;</span></span></span><br><span class="line"> const searchParams = new URLSearchParams(window.location.search);</span><br><span class="line"> const speakId = searchParams.get(&#x27;q&#x27;);</span><br><span class="line"> const path = window.location.pathname;</span><br><span class="line"> const apiURL = &#x27;https://（你的api地址）/api/ispeak&#x27;;</span><br><span class="line"> const markedRender = (body, loading<span class="emphasis">_img=&#x27;https://bu.dusays.com/2022/05/01/626e88f349943.gif&#x27;) =&gt; &#123;</span></span><br><span class="line"><span class="emphasis"> const renderer = &#123;</span></span><br><span class="line"><span class="emphasis"> image(href, title, text) &#123;</span></span><br><span class="line"><span class="emphasis"> return `<span class="language-xml"><span class="language-javascript">&lt;a href=<span class="string">&quot;$&#123;href&#125;&quot;</span> target=<span class="string">&quot;_blank&quot;</span> data-fancybox=<span class="string">&quot;group&quot;</span> <span class="keyword">class</span>=<span class="string">&quot;fancybox&quot;</span>&gt;</span></span></span></span><br><span class="line"><span class="emphasis"> <span class="language-xml"><span class="language-handlebars"><span class="language-xml"><span class="tag">&lt;<span class="name">img</span> <span class="attr">speak-src</span>=<span class="string">&quot;$&#123;href&#125;&quot;</span> <span class="attr">src</span>=<span class="string">$&#123;loading_img&#125;</span> <span class="attr">alt</span>=<span class="string">&#x27;$&#123;text&#125;&#x27;</span>&gt;</span></span></span></span></span></span><br><span class="line"><span class="emphasis"> <span class="language-xml"><span class="language-handlebars"><span class="language-xml"><span class="tag">&lt;/<span class="name">a</span>&gt;</span></span></span></span>`</span></span><br><span class="line"><span class="emphasis"> &#125;</span></span><br><span class="line"><span class="emphasis"> &#125;</span></span><br><span class="line"><span class="emphasis"> marked.setOptions(&#123;</span></span><br><span class="line"><span class="emphasis"> renderer: new marked.Renderer(),</span></span><br><span class="line"><span class="emphasis"> highlight: function (code) &#123;</span></span><br><span class="line"><span class="emphasis"> if (hljs) &#123;</span></span><br><span class="line"><span class="emphasis"> return hljs.highlightAuto(code).value</span></span><br><span class="line"><span class="emphasis"> &#125; else &#123;</span></span><br><span class="line"><span class="emphasis"> return code</span></span><br><span class="line"><span class="emphasis"> &#125;</span></span><br><span class="line"><span class="emphasis"> &#125;,</span></span><br><span class="line"><span class="emphasis"> pedantic: false,</span></span><br><span class="line"><span class="emphasis"> gfm: true,</span></span><br><span class="line"><span class="emphasis"> tables: true,</span></span><br><span class="line"><span class="emphasis"> breaks: true,</span></span><br><span class="line"><span class="emphasis"> sanitize: false,</span></span><br><span class="line"><span class="emphasis"> smartLists: true,</span></span><br><span class="line"><span class="emphasis"> smartypants: false,</span></span><br><span class="line"><span class="emphasis"> xhtml: false</span></span><br><span class="line"><span class="emphasis"> &#125;)</span></span><br><span class="line"><span class="emphasis"> marked.use(&#123; renderer &#125;)</span></span><br><span class="line"><span class="emphasis"> return marked.parse(body)</span></span><br><span class="line"><span class="emphasis"> &#125;</span></span><br><span class="line"><span class="emphasis"> fetch(`$&#123;apiURL&#125;/get/$&#123;speakId&#125;`)</span></span><br><span class="line"><span class="emphasis"> .then(response =&gt; response.json())</span></span><br><span class="line"><span class="emphasis"> .then(res =&gt; &#123;</span></span><br><span class="line"><span class="emphasis"> const data = res.data;</span></span><br><span class="line"><span class="emphasis"> if(data)&#123;</span></span><br><span class="line"><span class="emphasis"> const &#123;title,content&#125; = data;</span></span><br><span class="line"><span class="emphasis"> const contentSub = content.substring(0, 30);</span></span><br><span class="line"><span class="emphasis"> document.querySelector(&#x27;.content&#x27;).innerHTML = markedRender(content);</span></span><br><span class="line"><span class="emphasis"> if(title)&#123;</span></span><br><span class="line"><span class="emphasis"> document.title = title;</span></span><br><span class="line"><span class="emphasis"> &#125;</span></span><br><span class="line"><span class="emphasis"> new Artalk(&#123;</span></span><br><span class="line"><span class="emphasis"> el: &#x27;.ispeak-comment&#x27;, // 不用改</span></span><br><span class="line"><span class="emphasis"> pageKey: path + &#x27;?q=&#x27; + speakId, // 不用改</span></span><br><span class="line"><span class="emphasis"> pageTitle: title || contentSub, // 不用改</span></span><br><span class="line"><span class="emphasis"> server: &#x27;&#x27;, //填写你的Artalk服务端地址</span></span><br><span class="line"><span class="emphasis"> site: &#x27;&#x27; // 填写你的站点名</span></span><br><span class="line"><span class="emphasis"> &#125;)</span></span><br><span class="line"><span class="emphasis"> &#125;</span></span><br><span class="line"><span class="emphasis"> &#125;);</span></span><br><span class="line"><span class="emphasis"><span class="language-xml"><span class="tag">&lt;/<span class="name">script</span>&gt;</span></span></span></span><br></pre></td></tr></table></figure></li></ul></div></div></div></div><div class="footer"></div><div class="article-meta" id="bottom"><div class="new-meta-box"><div class="new-meta-item date" itemprop="dateModified"><a class="notlink"><i class="fa-solid fa-edit fa-fw" aria-hidden="true"></i><p>更新于：<time class="dataToShow dt-updated" datetime="2024-11-08T11:09:52+00:00" title="2024年11月8日">2024年11月8日</time></p></a></div><div class="new-meta-item meta-tags"><a class="tag" href="/tags/%E7%AB%99%E7%82%B9%E6%8A%98%E8%85%BE/" rel="nofollow"><i class="fa-solid fa-hashtag fa-fw" aria-hidden="true"></i><p>站点折腾</p></a></div><div class="new-meta-item meta-tags"><a class="tag" href="/tags/%E9%A1%B5%E9%9D%A2%E9%AD%94%E6%94%B9/" rel="nofollow"><i class="fa-solid fa-hashtag fa-fw" aria-hidden="true"></i><p>页面魔改</p></a></div> <span hidden itemprop="keywords">站点折腾 页面魔改</span><div class="new-meta-item share -mob-share-list"><div class="-mob-share-list share-body"> <a class="-mob-share-qq" title="" rel="external nofollow noopener noreferrer noopener" target="_blank" href="http://connect.qq.com/widget/shareqq/index.html?url=https://blog.sinzmise.top/posts/38964/&title=小康大佬的说说方案 ———— ispeak搭建教程 - 汐塔魔法屋&summary=搞ispeak时发现ispeak更新，能自定义评论了，也就是说我之前写的ispeak教程失效了没办法我只能重新写了这篇教程"><img src="https://jsd.cdn.storisinz.site/npm/volantis-static@0.0.1660614606622/media/org.volantis/logo/128/qq.png" class="lazyload" data-srcset="https://jsd.cdn.storisinz.site/npm/volantis-static@0.0.1660614606622/media/org.volantis/logo/128/qq.png" srcset="data:image/gif;base64,R0lGODlhAQABAIAAAP///////yH5BAEKAAEALAAAAAABAAEAAAICTAEAOw=="></a> <a class="-mob-share-qzone" title="" rel="external nofollow noopener noreferrer noopener" target="_blank" href="https://sns.qzone.qq.com/cgi-bin/qzshare/cgi_qzshare_onekey?url=https://blog.sinzmise.top/posts/38964/&title=小康大佬的说说方案 ———— ispeak搭建教程 - 汐塔魔法屋&summary=搞ispeak时发现ispeak更新，能自定义评论了，也就是说我之前写的ispeak教程失效了没办法我只能重新写了这篇教程"><img src="https://jsd.cdn.storisinz.site/npm/volantis-static@0.0.1660614606622/media/org.volantis/logo/128/qzone.png" class="lazyload" data-srcset="https://jsd.cdn.storisinz.site/npm/volantis-static@0.0.1660614606622/media/org.volantis/logo/128/qzone.png" srcset="data:image/gif;base64,R0lGODlhAQABAIAAAP///////yH5BAEKAAEALAAAAAABAAEAAAICTAEAOw=="></a> <a class="-mob-share-weibo" title="" rel="external nofollow noopener noreferrer noopener" target="_blank" href="http://service.weibo.com/share/share.php?url=https://blog.sinzmise.top/posts/38964/&title=小康大佬的说说方案 ———— ispeak搭建教程 - 汐塔魔法屋&summary=搞ispeak时发现ispeak更新，能自定义评论了，也就是说我之前写的ispeak教程失效了没办法我只能重新写了这篇教程"><img src="https://jsd.cdn.storisinz.site/npm/volantis-static@0.0.1660614606622/media/org.volantis/logo/128/weibo.png" class="lazyload" data-srcset="https://jsd.cdn.storisinz.site/npm/volantis-static@0.0.1660614606622/media/org.volantis/logo/128/weibo.png" srcset="data:image/gif;base64,R0lGODlhAQABAIAAAP///////yH5BAEKAAEALAAAAAABAAEAAAICTAEAOw=="></a></div></div></div></div><div class="prev-next"><a class="prev" href="/posts/61417/"><p class="title"><i class="fa-solid fa-angle-double-left" aria-hidden="true"></i>自建Meting服务</p><p class="content">听人说Meting官方API证书过期了，也就是说MetingAPI得自建了然后很快啊，有人就搞出了自建MetingAPI的Vercel版本 教程后端部署Vercel部署（推荐）服务器部署点击下方...</p></a><a class="next" href="/posts/22945/"><p class="title">butterfly主题添加音乐页面（适配手机）<i class="fa-solid fa-angle-double-right" aria-hidden="true"></i></p><p class="content">本博客已经更换主题 没有音乐页面怎么行，花里胡哨的都安排上，本来想摆烂直接上aplayer，但考虑到我不会写样式（虽然我可以自学） 所以我音乐页面用的是Chuckle的方案（等会为啥开头这么像这...</p></a></div></article><article class="post white-box shadow floatable blur" id="comments"><span hidden><meta itemprop="discussionUrl" content="/posts/38964/#comments"></span><p ct><i class="fa-solid fa-comments"></i> 评论</p><div id="layoutHelper-comments"></div></article></div><aside id="l_side" class="not-select default-cursor" itemscope itemtype="http://schema.org/WPSideBar"><section class="widget nextsite desktop pjax"><div class="site-brand-wrapper"><div class="site-meta"> <a href="/" class="brand" rel="start"><span class="site-title">汐塔魔法屋</span></a><p class="site-subtitle" itemprop="description">Ceta Magical House</p></div><div class="site-nav-toggle"> <button aria-label="切换导航栏"><span class="btn-bar"></span><span class="btn-bar"></span><span class="btn-bar"></span></button></div></div><nav class="site-nav"><ul class="next-main"><li class="next-main-item"><a href="/categories/" title="分类" active-action="action-categories"><i class="menu-item-icon fa-solid fa-folder-open fa-fw"></i> 分类</a></li><li class="next-main-item"><a href="/tags/" title="标签" active-action="action-tags"><i class="menu-item-icon fa-solid fa-tags fa-fw"></i> 标签</a></li><li class="next-main-item"><a href="/archives/" title="归档" active-action="action-archives"><i class="menu-item-icon fa-solid fa-archive fa-fw"></i> 归档</a></li><li class="next-main-item"><a href="/link/" title="友链" active-action="action-link"><i class="menu-item-icon fa-solid fa-link fa-fw"></i> 友链</a></li><li class="next-main-item"><a target="_blank" rel="noopener" href="https://www.travellings.cn/go.html" title="开往" active-action="action-https:wwwtravellingscngohtml"><i class="menu-item-icon fa-solid fa-subway fa-fw"></i> 开往</a></li><li class="next-main-item"><a target="_blank" rel="noopener" href="https://en.blog.sinzmise.top/" title="English" active-action="action-https:enblogsinzmisetop"><i class="menu-item-icon fa fa-language fa-fw fa-fw"></i> English</a></li><li class="next-main-item"><a href="javascript:void(0)" title="搜索" active-action="action-javascript:void(0)" onclick="OpenSearch()"><i class="menu-item-icon fa-solid fa-search fa-fw"></i> 搜索</a></li></ul></nav></section><section class="widget nextblogger desktop pjax h-card"><div class="content"> <a class="avatar u-url flat-box" href="https://blog.sinzmise.top/"><img no-lazy class="site-author-image u-photo" itemprop="image" src="/img/avatar.png" alt="王九弦SZ·Ninty"></a><div class="site-author-box"><p class="site-author-name p-name" itemprop="name">王九弦SZ·Ninty</p><p class="site-author-description" itemprop="description">种下故事的种子，随着风和光生根发芽</p></div><div class="links-of-author"><span class="links-of-author-item"><a href="/atom.xml" title="RSS" alt="汐塔魔法屋" rel="me"><i class="fa-solid fa-rss fa-fw"></i></a></span><span class="links-of-author-item"><a href="mailto:email@sinzmise.top" title="Email" alt="汐塔魔法屋" class="u-email" rel="me"><i class="fa-solid fa-envelope fa-fw"></i></a></span><span class="links-of-author-item"><a target="_blank" href="https://github.com/SinzMise/" title="Github" alt="汐塔魔法屋" rel="me noopener"><i class="fab fa-github fa-fw"></i></a></span></div></div></section><section class="widget category desktop pjax"><header><a href="/categories/"><span class="icon"><i class="fa-solid fa-folder-open fa-fw" aria-hidden="true"></i></span> <span class="name">文章分类</span></a></header><div class="content"><ul class="entry navigation"><li><a class="flat-box" title="/categories/%E4%B8%AA%E4%BA%BA%E5%B0%8F%E8%AE%B0/" href="/categories/%E4%B8%AA%E4%BA%BA%E5%B0%8F%E8%AE%B0/" active-action="action-categoriesE4B8AAE4BABAE5B08FE8AEB0"><div class="name">个人小记</div><div class="badge">(19)</div></a></li><li><a class="flat-box" title="/categories/%E6%AD%8C%E6%9B%B2%E6%94%B6%E9%9B%86/" href="/categories/%E6%AD%8C%E6%9B%B2%E6%94%B6%E9%9B%86/" active-action="action-categoriesE6AD8CE69BB2E694B6E99B86"><div class="name">歌曲收集</div><div class="badge">(1)</div></a></li><li><a class="flat-box" title="/categories/%E6%B8%B8%E6%88%8F%E7%9B%B8%E5%85%B3/" href="/categories/%E6%B8%B8%E6%88%8F%E7%9B%B8%E5%85%B3/" active-action="action-categoriesE6B8B8E6888FE79BB8E585B3"><div class="name">游戏相关</div><div class="badge">(4)</div></a></li><li><a class="flat-box" title="/categories/%E7%AB%99%E7%82%B9%E6%8A%98%E8%85%BE/" href="/categories/%E7%AB%99%E7%82%B9%E6%8A%98%E8%85%BE/" active-action="action-categoriesE7AB99E782B9E68A98E885BE"><div class="name">站点折腾</div><div class="badge">(14)</div></a></li><li><a class="flat-box" title="/categories/%E9%A1%B9%E7%9B%AE%E6%8A%98%E8%85%BE/" href="/categories/%E9%A1%B9%E7%9B%AE%E6%8A%98%E8%85%BE/" active-action="action-categoriesE9A1B9E79BAEE68A98E885BE"><div class="name">项目折腾</div><div class="badge">(3)</div></a></li></ul></div></section><section class="widget tagcloud desktop pjax"><header><a href="/tags/"><span class="icon"><i class="fa-solid fa-tags fa-fw" aria-hidden="true"></i></span> <span class="name">热门标签</span></a></header><div class="content"> <a href="/tags/Flash%E7%9B%B8%E5%85%B3/" style="font-size:14px;color:#999">Flash相关</a> <a href="/tags/Steam%E6%B8%B8%E6%88%8F/" style="font-size:14px;color:#999">Steam游戏</a> <a href="/tags/Windows%E8%BD%AF%E4%BB%B6/" style="font-size:15.67px;color:#8e8e8e">Windows软件</a> <a href="/tags/%E4%B8%AA%E4%BA%BA%E5%B0%8F%E8%AE%B0/" style="font-size:24px;color:#555">个人小记</a> <a href="/tags/%E5%85%B6%E5%AE%83%E6%B8%B8%E6%88%8F/" style="font-size:17.33px;color:#828282">其它游戏</a> <a href="/tags/%E5%8A%A0%E8%BD%BD%E5%8A%A8%E7%94%BB/" style="font-size:14px;color:#999">加载动画</a> <a href="/tags/%E6%82%AC%E6%B5%AE%E5%AE%A0%E7%89%A9-%E7%9C%8B%E6%9D%BF%E5%A8%98/" style="font-size:14px;color:#999">悬浮宠物/看板娘</a> <a href="/tags/%E6%AD%8C%E6%9B%B2%E6%94%B6%E9%9B%86/" style="font-size:14px;color:#999">歌曲收集</a> <a href="/tags/%E6%B8%B8%E6%88%8F%E7%9B%B8%E5%85%B3/" style="font-size:19px;color:#777">游戏相关</a> <a href="/tags/%E7%AB%99%E7%82%B9%E5%BA%95%E9%83%A8%E9%AD%94%E6%94%B9/" style="font-size:14px;color:#999">站点底部魔改</a> <a href="/tags/%E7%AB%99%E7%82%B9%E6%8A%98%E8%85%BE/" style="font-size:22.33px;color:#606060">站点折腾</a> <a href="/tags/%E8%87%AA%E5%BB%BA%E9%83%A8%E7%BD%B2/" style="font-size:20.67px;color:#6c6c6c">自建部署</a> <a href="/tags/%E9%A1%B5%E9%9D%A2%E9%AD%94%E6%94%B9/" style="font-size:17.33px;color:#828282">页面魔改</a> <a href="/tags/%E9%A1%B9%E7%9B%AE%E6%8A%98%E8%85%BE/" style="font-size:17.33px;color:#828282">项目折腾</a></div></section><div class="widget-sticky pjax"><section class="widget desktop"><header><span class="icon"><i class="fa-solid fa-award fa-fw" aria-hidden="true"></i></span> <span class="name">站点信息</span></header><div class="content"><div class="webinfo"><div class="webinfo-item"><div>文章数目：</div><div>41 篇</div></div><div class="webinfo-item"><div>本站访客数：</div><div><span id="busuanzi_value_site_uv"><i class="fa-solid fa-fan fa-spin fa-fw" aria-hidden="true"></i></span> 人</div></div><div class="webinfo-item"><div>本站总访问量：</div><div><span id="busuanzi_value_site_pv"><i class="fa-solid fa-fan fa-spin fa-fw" aria-hidden="true"></i></span> 次</div></div><div class="webinfo-item"><div>最后活动时间：</div><div id="last-update-show">2024-11-08 日</div></div></div></div></section></div><div class="pjax"></div><div class="pjax"></div><div class="pjax"></div><div class="pjax"></div><div class="pjax"></div><div class="pjax"></div><div class="pjax"></div></aside><pjax><script>window.pdata={ispage:!0,commentPath:"",commentPlaceholder:"",commentConfig:{}},document.getElementById("l_header")&&document.getElementById("l_header").classList.add("show")</script></pjax></div><footer class="footer clearfix" itemscope itemtype="http://schema.org/WPFooter"><br><br><br><div class="social-wrapper" itemprop="about" itemscope itemtype="http://schema.org/Thing"> <a href="https://www.travellings.cn/go.html" class="social flat-btn" target="_blank" rel="external nofollow noopener noreferrer" itemprop="url" alt="开往-友链接力"><img src="https://www.travellings.cn/assets/logo.gif" class="lazyload" data-srcset="https://www.travellings.cn/assets/logo.gif" srcset="data:image/gif;base64,R0lGODlhAQABAIAAAP///////yH5BAEKAAEALAAAAAABAAEAAAICTAEAOw=="></a> <a href="https://boringbay.com" class="social flat-btn" target="_blank" rel="external nofollow noopener noreferrer" itemprop="url" alt="无聊湾 🥱 The Boring Bay"><img src="https://boringbay.com/api/badge/blog.sinzmise.top" class="lazyload" data-srcset="https://boringbay.com/api/badge/blog.sinzmise.top" srcset="data:image/gif;base64,R0lGODlhAQABAIAAAP///////yH5BAEKAAEALAAAAAABAAEAAAICTAEAOw=="></a> <a href="https://blogscn.fun/" class="social flat-btn" target="_blank" rel="external nofollow noopener noreferrer" itemprop="url" alt="本站已加入BLOGS·CN"><img src="https://photo.xiangming.site/img/blogscn.png" class="lazyload" data-srcset="https://photo.xiangming.site/img/blogscn.png" srcset="data:image/gif;base64,R0lGODlhAQABAIAAAP///////yH5BAEKAAEALAAAAAABAAEAAAICTAEAOw=="></a> <a href="https://blogscn.fun/random.html" class="social flat-btn" target="_blank" rel="external nofollow noopener noreferrer" itemprop="url" alt="BLOGS·CN随机访问"><img src="https://photo.xiangming.site/img/footer.gif" class="lazyload" data-srcset="https://photo.xiangming.site/img/footer.gif" srcset="data:image/gif;base64,R0lGODlhAQABAIAAAP///////yH5BAEKAAEALAAAAAABAAEAAAICTAEAOw=="></a></div><div><p>博客内容遵循 <a target="_blank" rel="noopener" href="https://creativecommons.org/licenses/by-nc-sa/4.0/deed.zh">署名-非商业性使用-相同方式共享 4.0 国际 (CC BY-NC-SA 4.0) 协议</a></p></div> 由 <a href="https://hexo.io" target="_blank" rel="noopener">Hexo</a> 驱动 | 主题 <a href="https://github.com/volantis-x/hexo-theme-volantis/#6.0.0-alpha.0" target="_blank" class="codename">Volantis</a><div class="copyright"><p><a target="_blank" rel="noopener" href="https://xn--sr8hvo.ws/previous">←</a> An <a target="_blank" rel="noopener" href="https://xn--sr8hvo.ws">IndieWeb Webring</a> 🕸💍 <a target="_blank" rel="noopener" href="https://xn--sr8hvo.ws/next">→</a><br>©2021 · <a href="/">中弦局·汐塔魔法屋</a><br><a target="_blank" rel="noopener" href="https://icp.gov.moe/?keyword=20231033">萌ICP备20231033号</a> | <a target="_blank" rel="noopener" href="https://icp.gov.moe/?keyword=20231033">MIIT备20240818号</a> | <a target="_blank" rel="noopener" href="https://guan.ma/hao/2024000155/">官码2024000155号</a><br>我加入的：<a target="_blank" rel="noopener" href="https://zhblogs.ohyee.cc/">中文博客列表</a> | <a target="_blank" rel="noopener" href="https://storeweb.cn/member/o/1585">个站商店</a> | <a target="_blank" rel="noopener" href="https://bf.zzxworld.com/s/995">BlogFinder</a> | <a target="_blank" rel="noopener" href="https://sites.applinzi.com/site-info?siteType=life&amp;siteId=64cb373190e35300a8eec654">站点聚合平台</a> | <a target="_blank" rel="noopener" href="https://boke.lu/">博客录</a> | <a target="_blank" rel="noopener" href="https://rssblog.cn/member/d711afd659d65c2ba2d3b18697818cf7/">RssBlog</a> | <a target="_blank" rel="noopener" href="https://blogscn.fun/">笔墨迹</a> | <a target="_blank" rel="noopener" href="https://daohang.lusongsong.com/">博客大全</a></p></div></footer><a id="s-top" class="fa-solid fa-arrow-up fa-fw" title="top"></a></div></div><div><script>volantis.dom.bodyAnchor=volantis.dom.$(document.getElementById("safearea")),volantis.dom.topBtn=volantis.dom.$(document.getElementById("s-top")),volantis.dom.wrapper=volantis.dom.$(document.getElementById("wrapper")),volantis.dom.coverAnchor=volantis.dom.$(document.querySelector("#l_cover .cover-wrapper")),volantis.dom.switcher=volantis.dom.$(document.querySelector("#l_header .switcher .s-search")),volantis.dom.header=volantis.dom.$(document.getElementById("l_header")),volantis.dom.search=volantis.dom.$(document.querySelector("#l_header .m_search")),volantis.dom.mPhoneList=volantis.dom.$(document.querySelectorAll("#l_header .m-phone .list-v")),top.location!=self.location&&(top.location=self.location),volantis.css("https://jsd.cdn.storisinz.site/npm/@fortawesome/fontawesome-free@6.1.1/css/all.min.css")</script><script src="/js/app.js"></script><script>function loadIssuesJS(){null!=document.getElementById("sites-api")&&"undefined"==typeof SitesJS&&volantis.js("/js/plugins/tags/sites.js");null!=document.getElementById("friends-api")&&"undefined"==typeof FriendsJS&&volantis.js("/js/plugins/tags/friends.js");null!=document.getElementById("contributors-api")&&"undefined"==typeof ContributorsJS&&volantis.js("/js/plugins/tags/contributors.js")}loadIssuesJS(),volantis.pjax.push((()=>{loadIssuesJS()}))</script><script defer="defer" src="https://jsd.cdn.storisinz.site/npm/vanilla-lazyload@17.1.0/dist/lazyload.min.js"></script><script>window.lazyLoadOptions={elements_selector:".lazyload",threshold:0},window.addEventListener("LazyLoad::Initialized",(function(n){window.lazyLoadInstance=n.detail.instance}),!1),document.addEventListener("DOMContentLoaded",(function(){lazyLoadInstance.update()})),document.addEventListener("pjax:complete",(function(){lazyLoadInstance.update()}))</script><script>window.FPConfig={delay:0,ignoreKeywords:["#"],maxRPS:6,hoverDelay:0}</script><script defer="defer" src="https://jsd.cdn.storisinz.site/npm/volantis-static@0.0.1660614606622/libs/flying-pages/flying-pages.min.js"></script><script>function load_twikoo(){document.querySelectorAll("#twikoo_container")[0]&&volantis.js("https://jsd.cdn.storisinz.site/npm/twikoo@1.6.39/dist/twikoo.min.js",pjax_twikoo)}function pjax_twikoo(){if(!document.querySelectorAll("#twikoo_container")[0])return;let o=pdata.commentPath,t=pdata.commentPlaceholder||"";if(0==o.length){o=""||decodeURI(window.location.pathname)}twikoo.init(Object.assign(Object.assign({path:null,envId:"https://tk.pl.blog.sinzmise.top/",placeholder:null,visitor:!1},{el:"#twikoo_container",path:o,placeholder:t,onCommentLoaded:function(){if("undefined"==typeof VolantisFancyBox){const o=setInterval((()=>{"undefined"!=typeof VolantisFancyBox&&(clearInterval(o),VolantisFancyBox.groupBind('.tk-content img:not([class*="emo"])',"Comments"))}))}else VolantisFancyBox.groupBind('.tk-content img:not([class*="emo"])',"Comments")}}),pdata.commentConfig))}volantis.layoutHelper("comments",'<div id="twikoo_container"><i class="fa-solid fa-cog fa-spin fa-fw fa-2x"></i></div>'),load_twikoo(),volantis.pjax.push((()=>{"undefined"==typeof twikoo?load_twikoo():pjax_twikoo()}),"twikoo")</script><script defer="defer" src="https://jsd.cdn.storisinz.site/npm/penndu@1.0.0/bsz.js" data-pjax></script><script>async function loadSearchScript(){return await volantis.js("https://jsd.cdn.storisinz.site/npm/algoliasearch@4.14.2/dist/algoliasearch-lite.umd.js"),await volantis.js("https://jsd.cdn.storisinz.site/npm/instantsearch.js@4.44.0/dist/instantsearch.production.min.js"),volantis.js("/js/search/algolia.js")}function loadSearchService(){document.querySelectorAll(".input.u-search-input").forEach((e=>{e.removeEventListener("focus",loadSearchService,!1)})),document.querySelectorAll(".u-search-form").forEach((e=>{e.addEventListener("submit",(e=>{e.preventDefault()}),!1)}))}function OpenSearch(e=""){"undefined"==typeof SearchService?loadSearchScript().then((()=>{SearchService.setQueryText(e),SearchService.search()})):(SearchService.setQueryText(e),SearchService.search())}if(loadSearchScript(),window.location.search&&/^\?s=/g.test(window.location.search)){OpenSearch(decodeURI(window.location.search).replace(/\ /g,"-").replace(/^\?s=/g,""))}document.querySelectorAll(".input.u-search-input").forEach((e=>{e.addEventListener("focus",loadSearchService,!1)}))</script><script>function pjax_highlightjs_copyCode(){(document.querySelector(".highlight .code pre")||document.querySelector(".article pre code"))&&VolantisApp.utilCopyCode(".highlight .code pre, .article pre code")}volantis.requestAnimationFrame(pjax_highlightjs_copyCode),volantis.pjax.push(pjax_highlightjs_copyCode)</script><script>function load_swiper(){document.querySelectorAll(".swiper-container")[0]&&(volantis.css("https://jsd.cdn.storisinz.site/npm/swiper@8.3.2/swiper-bundle.min.css"),volantis.js("https://jsd.cdn.storisinz.site/npm/swiper@8.3.2/swiper-bundle.min.js").then((()=>{pjax_swiper()})))}function pjax_swiper(){volantis.swiper=new Swiper(".swiper-container",{slidesPerView:"auto",spaceBetween:8,centeredSlides:!0,loop:!0,pagination:{el:".swiper-pagination",clickable:!0},navigation:{nextEl:".swiper-button-next",prevEl:".swiper-button-prev"}})}load_swiper(),volantis.pjax.push((()=>{document.querySelectorAll(".swiper-container")[0]&&(void 0===volantis.swiper?load_swiper():pjax_swiper())}))</script><pjax></pjax><script>function listenSidebarTOC(){const t=document.querySelectorAll(".toc li");if(!t.length)return;const e=[];Array.from(t).forEach((t=>{const n=t.querySelector(".toc-link"),i=document.getElementById(n.getAttribute("href")?decodeURI(n.getAttribute("href")).replace("#",""):n.getAttribute("toc-action").split("toc-")[1]);return e.push(i),n.getAttribute("href")&&(n.setAttribute("toc-action","toc-"+decodeURI(n.getAttribute("href")).replace("#","")),n.removeAttribute("href")),i&&i.id&&n.addEventListener("click",(t=>{t.preventDefault(),volantis.scroll.to(i,{addTop:5,observer:!0}),history.pushState(null,document.title,"#"+i.id)})),i}));function n(t){if(t.classList.contains("active-current"))return;document.querySelectorAll(".toc .active").forEach((t=>{t.classList.remove("active","active-current")})),t.classList.add("active","active-current");let e=t.parentNode;for(;!e.matches(".toc");)e.matches("li")&&e.classList.add("active"),e=e.parentNode}volantis.activateNavIndex=0,n(t[volantis.activateNavIndex]),e[0]&&volantis.scroll.push((()=>{if(e[0].getBoundingClientRect().top>=0)volantis.activateNavIndex=0;else if(e[e.length-1].getBoundingClientRect().top<0)volantis.activateNavIndex=e.length-1;else for(let t=0;t<e.length;t++){const n=e[t],i=e[(t+1)%e.length];if(n.getBoundingClientRect().top<0&&i.getBoundingClientRect().top>=0){volantis.activateNavIndex=t;break}}n(t[volantis.activateNavIndex])}))}document.addEventListener("DOMContentLoaded",(()=>{volantis.requestAnimationFrame(listenSidebarTOC)})),volantis.pjax.push(listenSidebarTOC)</script><script>document.onreadystatechange=function(){if("complete"==document.readyState){const{saveData:e,effectiveType:t}=navigator.connection||navigator.mozConnection||navigator.webkitConnection||{};("none"==getComputedStyle(document.querySelector("#safearea"),null).display||e||/2g/.test(t))&&(document.querySelectorAll(".reveal").forEach((function(e){e.style.opacity="1"})),document.querySelector("#safearea").style.display="block")}}</script><script type="application/ld+json">[{"@context":"http://schema.org","@type":"Organization","name":"汐塔魔法屋","url":"https://blog.sinzmise.top/","logo":{"@type":"ImageObject","url":"https://blog.sinzmise.top/images/siteicon/web-app-manifest-192x192.png","width":192,"height":192}},{"@context":"http://schema.org","@type":"Person","name":"王九弦SZ·Ninty","image":{"@type":"ImageObject","url":"https://blog.sinzmise.top/images/siteicon/web-app-manifest-192x192.png"},"url":"https://blog.sinzmise.top/","sameAs":["https://github.com/SinzMise"],"description":"The Story,The Dream."},{"@context":"http://schema.org","@type":"BreadcrumbList","itemListElement":[{"@type":"ListItem","position":1,"item":{"@id":"https://blog.sinzmise.top/","name":"汐塔魔法屋"}},{"@type":"ListItem","position":2,"item":{"@id":"https://blog.sinzmise.top/categories/站点折腾/","name":"站点折腾"}},{"@type":"ListItem","position":3,"item":{"@id":"https://blog.sinzmise.top/posts/38964/","name":"小康大佬的说说方案 ———— ispeak搭建教程"}}]},{"@context":"http://schema.org","@type":"WebSite","name":"汐塔魔法屋","url":"https://blog.sinzmise.top/","keywords":null,"description":"The Story,The Dream.","author":{"@type":"Person","name":"王九弦SZ·Ninty","image":{"@type":"ImageObject","url":"https://blog.sinzmise.top/images/siteicon/web-app-manifest-192x192.png"},"url":"https://blog.sinzmise.top/","description":"The Story,The Dream."},"publisher":{"@type":"Organization","name":"汐塔魔法屋","url":"https://blog.sinzmise.top/","logo":{"@type":"ImageObject","url":"https://blog.sinzmise.top/images/siteicon/web-app-manifest-192x192.png","width":192,"height":192}},"potentialAction":{"@type":"SearchAction","name":"Site Search","target":{"@type":"EntryPoint","urlTemplate":"https://blog.sinzmise.top?s={search_term_string}"},"query-input":"required name=search_term_string"}},{"@context":"http://schema.org","@type":"BlogPosting","headline":"小康大佬的说说方案 ———— ispeak搭建教程","description":"这篇文章是我之前写过的教程的重写","inLanguage":"zh-CN","mainEntityOfPage":{"@type":"WebPage","@id":"https://blog.sinzmise.top/posts/38964/"},"author":{"@type":"Person","name":"王九弦SZ·Ninty","image":{"@type":"ImageObject","url":"https://blog.sinzmise.top/images/siteicon/web-app-manifest-192x192.png"},"url":"https://blog.sinzmise.top/"},"publisher":{"@type":"Organization","name":"汐塔魔法屋","logo":{"@type":"ImageObject","url":"https://blog.sinzmise.top/images/siteicon/web-app-manifest-192x192.png","width":192,"height":192}},"url":"https://blog.sinzmise.top/posts/38964/","wordCount":61,"datePublished":"2023-01-13T21:01:37.000Z","dateModified":"2024-11-08T11:09:52.046Z","articleSection":"站点折腾","keywords":"站点折腾,页面魔改","image":{"@type":"ImageObject","url":"https://jsd.cdn.storisinz.site/gh/SinzMise/MYPictures@master/20230114/msedge_GVRhG42nuu.1g9uz8t24io0.webp","width":1024,"height":768}}]</script><script src="https://jsd.cdn.storisinz.site/npm/pjax@0.2.8/pjax.min.js"></script><script>var pjax;document.addEventListener("DOMContentLoaded",(function(){pjax=new Pjax({elements:'a[href]:not([href^="#"]):not([href="javascript:void(0)"]):not([pjax-fancybox]):not([onclick="return false;"]):not([onclick="return!1"]):not([target="_blank"]):not([target="view_window"]):not([href$=".xml"])',selectors:["head title","head meta[name=keywords]","head meta[name=description]","#l_cover","#l_main","#pjax-header-nav-list",".pjax","pjax"],cacheBust:!1,timeout:5e3})})),document.addEventListener("pjax:send",(function(e){try{var t=window.location.pathname,n=e.triggerElement.href,a=[""];""!=a[0]&&a.forEach((e=>{-1==t.indexOf(e)&&-1==n.indexOf(e)||(window.location.href=n)}))}catch(e){}volantis.pjax.method.send.start()})),document.addEventListener("pjax:complete",(function(){document.querySelectorAll("script[data-pjax], .pjax-reload script").forEach((e=>{const t=e.text||e.textContent||e.innerHTML||"",n=document.createElement("script");Object.keys(e.attributes).forEach((t=>{n.setAttribute(e.attributes[t].nodeName,e.attributes[t].nodeValue)})),t&&n.appendChild(document.createTextNode(t)),e.parentNode.replaceChild(n,e)})),volantis.pjax.method.complete.start()})),document.addEventListener("pjax:error",(function(e){"pjax"===volantis.debug?(console.error(e),console.log("pjax error: \n"+JSON.stringify(e))):(volantis.pjax.method.error.start(),window.location.href=e.triggerElement.href)}))</script></div><script data-pjax src="https://jsd.cdn.storisinz.site/npm/oh-my-live2d"></script><script>const oml2d=OML2D.loadOml2d({menus:{items:t=>[t[0],t[2],t[3]]},mobileDisplay:!1,models:[{path:"https://files.blog.sinzmise.top/live2d/dujiaoshou_6/dujiaoshou_6.model3.json",mobilePosition:[-10,23],mobileScale:.1,mobileStageStyle:{width:180,height:166},motionPreloadStrategy:"IDLE",position:[-120,-30],scale:.06,stageStyle:{width:250,height:400}},{path:"https://files.blog.sinzmise.top/live2d/dujiaoshou_4/dujiaoshou_4.model3.json",scale:.06,position:[-50,-25],stageStyle:{width:250,height:300},mobileScale:.08,mobilePosition:[0,0],mobileStageStyle:{width:180}}],parentElement:document.body,primaryColor:"var(--primary)",sayHello:!1,tips:{style:{width:230,height:120,left:"calc(50% + 6px)",top:"-100px"},mobileStyle:{width:180,height:80,left:"calc(50% - 30px)",top:"-100px"},idleTips:{interval:15e3,message:function(){return axios.get("https://v1.hitokoto.cn?c=i").then((function(t){return t.data.hitokoto})).catch((function(t){console.error(t)}))}}}})</script></body></html>