原文は公众号に掲載されています：音楽とビール
転載された画像が完全に表示されない場合がありますので、原文をご覧ください。
https://mp.weixin.qq.com/s?__biz=MzI1NTg2NzQyOA==&mid=2247489178&idx=1&sn=a41a6400af3703ace1df85d34acf42fa&chksm=ea2e39d1dd59b0c76a9f4e38e8ce1345416515c8691fce04bd6e4790a6ee102faebf584bee42&mpshare=1&scene=1&srcid=1222PiZqOCbXJzVXNvqxSogq&sharer_sharetime=1640131461472&sharer_shareid=b206f2fa812b6ca26b027c2ef010574f#rd
hexo+語雀+serverlessクラウド関数を利用して、ブログを自動公開する方法
数日間かけて、ネット上の関連資料をすべて調べ、最終的にこのようなチュートリアルをまとめました。これは自分自身の記録でもあります。このチュートリアルを通じて、あなたは記事をクラウドに保存し、クラウドでの執筆を実現できます（MAC システム、Windows システム、携帯の WeChat ミニプログラムに制限されません）。ローカルマシンの制約から解放されます。それに加えて、優れたシンプルなリッチテキストエディタは、あなたの執筆効率を大幅に向上させ、テキストの執筆により集中できるようにします。github action（github 自動デプロイ）、serverless クラウド関数（Tencent Cloud API、イベントのトリガーに使用）、語雀（ドキュメントの公開）、Hexo（ブログシステム）を組み合わせて、記事をブログに自動的に公開するプロセスを実現します。
使用前の準備
hexo× 語雀のデプロイをより良く、より便利に行うために、プロセス構築の操作を始める前に、ある程度の基礎が必要です。問題が発生した場合は、自分で百度で調べ、以下のステップに従って順を追って進めてください。
アカウントの申請と認証
語雀アカウント-- 申請
serverless プラン一（私が使用）：Tencent Cloudアカウントでログイン認証（ https://console.cloud.tencent.com/scf/）、クラウド関数の認証後にAPI認証を行う（ https://console.cloud.tencent.com/apigateway/index）これにより、クラウド関数機能を正常に使用できます。
serverless プラン二：百度クラウド認証（ https://console.bce.baidu.com/cfc/#/cfc/functions）、開通方法ガイド
プラン三：vercelで構築されたAPIを使用。
githubの秘密鍵を取得し、githubのトークン設定に移動（ https://github.com/settings/tokens）、生成ボタンをクリックし、鍵の名前を記入し、repoオプションにチェックを入れます。生成された鍵をデスクトップに新しく作成したtxtファイルに保存しておきます。
リポジトリの準備
hexo の自動デプロイを実現するために、ローカルのソースコードファイルを github にホスティングする必要があります。プライベートリポジトリを作成することをお勧めしますが、共有リポジトリを作成することもできます。まず、github でプライベートリポジトリを作成します。
ステップ 1：
語雀リポジトリを作成
語雀にログインし、知識庫をクリック 👉 新しい知識庫を作成します。知識庫の可視範囲を「インターネットに公開」に変更します。
古い記事のインポート、または新規作成（少なくとも 1 つの記事が必要）
知識庫の管理ボタンをクリックし、新規作成の下のインポートを選択し、ブログの_post 記事を一括インポートします。
テンプレートの作成（後で作成可能）
将来の文書作成を便利にするために、テンプレートを新規作成できます。画像リンクには’’を追加して、リンクとしてレンダリングされないようにします。
ステップ 2：語雀プラグインをインストールしてローカルデバッグを行う
クラウド上でブログが正常に生成されることを確認するために、まずローカルでデバッグを行います。
語雀プラグインのインストール
まず、ルートディレクトリでターミナルを開き、yuque-hexo をインストールします。
POWERSHELL
1
npm i -g yuque-hexo
package.json の修正
最初のオブジェクトコードブロックの後に”yuqueConfig” コードブロックを追加します。
JSON
{ "name": "hexo-site", "version": "0.0.0", "private": true, "scripts": { "build": "hexo generate", "clean": "hexo clean", "deploy": "hexo deploy", "server": "hexo server"}, "yuqueConfig": { "postPath": "source/_posts/yuque", "cachePath": "yuque.json", "mdNameFormat": "slug", "adapter": "markdown", "concurrency": 5, "baseUrl": "https://www.yuque.com/api/v2", "login": "あなたの語雀ユーザー名", "repo": "あなたの語雀知識庫名", "token": "******ここをあなたの語雀TOKENに変更*******", "onlyPublished": true, "onlyPublic": true },
ここで”login”、”repo”、”token” フィールドを修正する必要があります。
ブログの知識庫にアクセスし、ブラウザのアドレスバーにユーザー名とリポジトリ名をコピーして、それぞれ”login”、”repo”フィールドに貼り付けます。
語雀のtokenは右上のアバター -> アカウント設定 -> Tokenで追加され、権限は読み取りのみで大丈夫です。取得した”token”フィールドをコピーして貼り付けます。
“scripts” を修正し、”sync”: “yuque-hexo sync” と”clean”: “yuque-hexo clean” を追加します。
JSON
{ "name": "hexo-site", "version": "0.0.0", "private": true, "scripts": { "build": "hexo generate", "clean": "hexo clean", "deploy": "hexo deploy", "server": "hexo server", "sync": "yuque-hexo sync", "clean:yuque": "yuque-hexo clean" }, "yuqueConfig": { "postPath": "source/_posts", "cachePath": "yuque.json", "mdNameFormat": "slug", "adapter": "markdown", "concurrency": 5, "baseUrl": "https://www.yuque.com/api/v2", "login": "ユーザー名", "repo": "知識庫名", "token": "********TOKEN***************", "onlyPublished": true, "onlyPublic": true }, "hexo": { "version": "5.2.0" }, "dependencies": { "yuque-hexo": "^1.6.0", "gulp": "^4.0.2", "gulp-base64": "^0.1.3", "gulp-htmlmin": "^5.0.1", "gulp-tobase64": "^1.1.2", "hexo": "^5.0.0", "hexo-abbrlink": "^2.2.1", "hexo-deployer-git": "^2.1.0", "hexo-generator-archive": "^1.0.0", "hexo-generator-baidu-sitemap": "^0.1.9", "hexo-generator-category": "^1.0.0", "hexo-generator-feed": "^3.0.0", "hexo-generator-index-pin-top": "^0.2.2", "hexo-generator-sitemap": "^2.1.0", "hexo-generator-tag": "^1.0.0", "hexo-helper-live2d": "^3.1.1", "hexo-offline-popup": "^1.0.3", "hexo-renderer-ejs": "^1.0.0", "hexo-renderer-marked": "^3.0.0", "hexo-renderer-pug": "^1.0.0", "hexo-renderer-stylus": "^1.1.0", "hexo-server": "^1.0.0", "hexo-tag-aplayer": "^3.0.4", "hexo-wordcount": "^6.0.1", "live2d-widget-model-unitychan": "^1.0.5", "workbox-build": "^5.1.4" }, "devDependencies": { "@babel/core": "^7.12.3", "@babel/preset-env": "^7.12.1", "del": "^6.0.0", "gulp": "^4.0.2", "gulp-babel": "^8.0.0", "gulp-clean-css": "^4.3.0", "gulp-cli": "^2.3.0", "gulp-html-css-js-base64": "^0.0.4", "gulp-htmlclean": "^2.7.22", "gulp-htmlmin": "^5.0.1", "gulp-imagemin": "^7.1.0", "gulp-imgs-base64": "^1.0.2", "gulp-minify-inline-json": "^1.3.4", "gulp-uglify": "^3.0.2", "gulp-uglify-es": "^2.0.0" }}
ローカルデバッグを行う
完了したら保存し、コマンドを実行する前に、自分の_post フォルダをバックアップしてください。語雀のダウンロード操作は元の_post フォルダを上書きします。ターミナルに‘yuque-hexo sync’と入力すると、語雀の記事がダウンロードされます。その後、‘hexo g&hexo s’でデバッグを行います。ps：‘yuque-hexo clean’と入力すると、_post 内のすべての記事が削除されます。外部タグがある場合は、外部タグの書き方の規範を確保してください。さもなければ、エラーが発生しやすいです。
ステップ 3：github action の設定
テーマのバージョン管理ファイルを削除
リポジトリ内に別のリポジトリを置くことはできないため、内部のリポジトリを github にプッシュすることはできず、空のフォルダしか送信されず、後にブログが空白ページになってしまいます。git clone した hexo テーマの.git フォルダを削除する必要があります。
ここでは最も簡単な方法のみを示しますが、他にも自分のテーマを作成するためにフォークする方法がありますが、ここでは紹介しません。
-
hexo テーマファイルの meta を修正
butterfly テーマを例に、テーマファイルの /themes/butterfly/layout/includes/head.pug を開きます。meta (name=”theme-color” content=themeColor) の後に meta (name=”referrer” content=”no-referrer”) を追加します。このステップは、語雀の画像が正常に読み込まれることを保証します。
YAML1
meta(name="theme-color" content=themeColor)meta(name="referrer" content="no-referrer")
hexo の_config,yml を修正
ブログのルートディレクトリに移動し、hexo の_config,yml 内の develop に関する設定を修正します。
POWERSHELL
1
# Deployment## Docs: https://hexo.io/docs/deployment.htmldeploy: type: git repository: github: https://ユーザー名:txtに保存した秘密鍵@github.com/ユーザー名/リポジトリ名.git branch: masterこの落とし穴に注意してください。リポジトリ名は.Github.ioです。
ここでは簡単なプランの一つのみを示します。他のプランは時間があれば紹介します。
github action スクリプトを作成
ブログのルートディレクトリに新しい.github フォルダを作成します（これを見逃さないでください）、そのフォルダ内に workflows フォルダを新規作成します。
workflows フォルダ内に autodeploy.yml を新規作成し、以下のコードを入力します。「更新語雀のキャッシュと記事」と「デプロイ」の user.name と user.email の後の "" 情報を自分の情報に変更し、注意して整列させてください。
YAML
1
name: 自動デプロイ# 変更がプッシュされ、語雀が公開されると、Actionを開始on: [push, repository_dispatch]jobs: deploy: runs-on: ubuntu-latest steps: - name: ブランチを確認 uses: actions/checkout@v2 with: ref: master #2020年10月以降、githubで新しいリポジトリのデフォルトブランチがmainに変更されました。注意して変更してください。 #ただし、プライベートリポジトリは依然としてmasterのままのようです。 - name: Nodeをインストール uses: actions/setup-node@v1 with: node-version: "12.x" - name: Hexoをインストール run: | export TZ='Asia/Shanghai' npm install hexo-cli -g #npm install gulp-cli -g #gulpを使用している場合は、上の行を開いてください。 npm install yuque-hexo -g yuque-hexo clean yuque-hexo sync - name: 更新語雀のキャッシュと記事 #更新yuqueから取得した記事をGitHubリポジトリにアップデート run: | echo `date +"%Y-%m-%d %H:%M:%S"` begin > time.log git config --global user.email "￥@.com" git config --global user.name "￥￥￥" git add . git commit -m "Refresh yuque json" -a - name: 語雀のキャッシュと記事をプッシュ #変更されたyuque jsonをプッシュ uses: ad-m/github-push-action@master with: github_token: ${{ secrets.GITHUB_TOKEN }} - name: Hexoのキャッシュ uses: actions/cache@v1 id: cache with: path: node_modules key: ${{runner.OS}}-${{hashFiles('**/package-lock.json')}} - name: 依存関係をインストール if: steps.cache.outputs.cache-hit != 'true' run: | npm install --save - name: 静的ファイルを生成 run: | hexo clean hexo g #gulp #gulpを使用している場合は、上の行を開いてください。 - name: デプロイ run: | git config --global user.name "￥￥" git config --global user.email "￥￥￥@.com" hexo deploy
ブログソースコードをアップロード
ターミナルを開き、以下のコマンドを入力して、あなたのブログソースコードをプライベートソースコードリポジトリにアップロードします。
POWERSHELL
git initgit add .git commit -m "first commit"git remote add origin https://github.com/あなたのユーザー名/あなたのプライベートブログソースコードリポジトリ名.gitgit push -u origin master
クラウド上でデバッグを行う
アップロード後、github action が有効になります。数分待つと、チェックが入ればデプロイ成功を意味します。チェックが入らない場合は、エラーのステップを確認してください。
time.log ファイルは最近自動生成されないようで、action が成功しない場合は、手動でリポジトリに time.log を新規作成してください。
ステップ 4：クラウド関数の設定
vercel プラン（推奨）
皆さんが呼び出しやすいように、python で api を書きました。面倒なのは、リポジトリに github の秘密鍵を記入すると、github が自動的に秘密鍵を削除することです。何度も試しましたが成功しませんでした。そのため、api をパラメータ渡し型に設定し、皆さんが呼び出せるようにしました。api アドレス：https://yuque-vercel-webhook-api.vercel.app/api?。もちろん、プロジェクトをフォークして vercel で自分で構築することもできます。その場合は、‘ https://yuque-vercel-webhook-api.vercel.app’をあなたのアプリケーションリンクに置き換えてください。渡す必要があるパラメータは token、user、source です。
CODE
https://yuque-vercel-webhook-api.vercel.app/api?token='{あなたのgithub秘密鍵を記入}'&user='{あなたのgithubユーザー名を記入}'&source='{あなたのgithubリポジトリアドレスを記入}'例：https://yuque-vercel-webhook-api.vercel.app/api?token='8888888888'&user='Zfour'&source='my-blog-source-file'このURLパスをトリガーリンクとして、語雀で設定します。
トリガーリンクのパラメータ項を修正し、このリンクにアクセスします。「This’s OK!」と表示されれば、設定成功を意味します。URL パスをコピーしてトリガーリンクとして、語雀で設定します。
百度クラウドプラン（推奨）
新しいクラウド関数を作成
ログイン後、関数を作成をクリックします。
空白関数を選択し、タイムアウト設定を 10 秒、ランタイムを python2.7 に選択します。次へをクリックします。
HTTP トリガーを選択し、URL パスに’/’を記入し、HTTP メソッドに POST と GET を記入し、次に送信をクリックします。
関数をクリックし、関数リストを選択し、以下のコードを貼り付けて保存し、ユーザー名とリポジトリアドレスを自分の情報に変更します。保存した秘密鍵を **** に置き換え、token フィールドは保持する必要があります。テストコードが返され、「This’s OK!」と表示され、github action が開始されれば成功を意味します。
PYTHON
# -*- coding: utf8 -*-import requestsdef handler(event, context): r = requests.post("https://api.github.com/repos/ユーザー名/ソースコードリポジトリ/dispatches", json = {"event_type": "run-it"}, headers = {"User-Agent":'curl/7.52.1', 'Content-Type': 'application/json', 'Accept': 'application/vnd.github.everest-preview+json', 'Authorization': 'token ****GITHUBの*******'}) if r.status_code == 204: return "This's OK!" else: return r.status_code
URL パスをコピーしてトリガーリンクとして、語雀で設定します。
Tencent Cloud プラン（使用期限あり）
新しいクラウド関数を作成
Tencent Cloud プランは現在 1 年間の使用期限があります。現在、Aliyun プランと vercel プランを試しています。
ログイン後、新規作成ボタンをクリックします。このクラウド関数には 2 つあり、serverless と静的ホスティングのものがあります。静的ホスティングのものではありません。
基本情報を記入します。実行環境を python2.7 に選択し、空白方式で作成します。
以下のスクリプトを記入します。ユーザー名とリポジトリアドレスを自分の情報に変更します。保存した秘密鍵を **** に置き換え、token フィールドは保持する必要があります。
PYTHON
# -*- coding: utf8 -*-import requestsdef main_handler(event, context): r = requests.post("https://api.github.com/repos/%%/%%/dispatches", json = {"event_type": "run-it"}, headers = {"User-Agent":'curl/7.52.1', 'Content-Type': 'application/json', 'Accept': 'application/vnd.github.everest-preview+json', 'Authorization': 'token ******上の図を参照********'}) if r.status_code == 204: return "This's OK!" else: return r.status_code
保存してテストをクリックし、「This’s OK!」と表示され、github action が開始されれば成功を意味します。
新しいトリガー条件を作成
トリガー管理をクリックし、新しいトリガーを作成します。送信後、アクセスパスをコピーします。
このアクセスパスを記録します。
ステップ 5：語雀の webhook を設定
トリガールールを設定
知識庫で設定を選択します。
トリガールールを設定し、名前は自由に付けます。URL は上記で記録したクラウド関数のアドレスです。クラウド関数から取得したアクセスパス（Tencent Cloud）または URL リンク（百度クラウド）を貼り付けます。
設定が完了したら、記事を 1 つ公開してテストしてみてください。github action が実行されれば、設定成功を意味します。
現在、語雀を使って同期し、自動デプロイで記事を公開することが非常に便利ですが、全体のプロセスは本当に複雑で、面倒で、落とし穴が多すぎます。手を動かす能力が不足している方は、あまり試さない方が良いでしょう。素直にやりましょう。
内容は多くの先人の経験を参考にしましたが、まだ多くの不満な点があります。疑問があればここにコメントしてください。記事は公众号で編集されていないため、フォーマットに誤りがある場合は、私のウェブサイトの原文を確認してください。参考までに。