Rabbitflower
Rabbitflower RabbitLover.

noteで記事を書いたことをGitHub Pagesの自分のブログに記録したい3

noteで記事を書いたことをGitHub Pagesの自分のブログに記録したい3

2でMakeのToolsの設定を開きました

2はこちら


Toolsを設定する

Toolsの薄紫の丸の中心をクリックすると以下の画面が出てきます

Source Module: Google Sheets
Row separator: New row
Group by:空欄で良い

そしてまたその下にスクロールするとtextという入力項目がありますが、こちらは記事がマークダウン方式で描かれていたら必ず入っている、Githubブログの情報を入力します。

※ブログの情報はGitHubサイトからの記事を見るとトップにあるこういうもの↓

こちらは人によりGitHubのブログのデザインや表示方法で内容が違っていたりするので、各記事の内容を確認してください。私の場合はブログの項目が以下のものだったのでそのまま入れ、該当するものをGoogle Sheetと同じ用にオレンジ枠から選択しています。
こちらもGoogleSheetと同じく、ブログ全てで同じものを固定記載する場合は直接キーボードで入力しています。

入力が終わったら右下のSAVEを押してメニューを閉じます。


GitHubのAPI取得と設定

Makeのページは一旦そのままにし、新たにブラウザの新しいタブでGit Hubにアクセスします。

右上の自分のアイコンから設定(Settings)をクリック。

画面が変わったら左のメニューの一番下にあるDeveloper settingsをクリック。

画面が変わったら左メニューの Personal access tokens をクリックし、表示されるTokens(classic)をクリック。

画面が変わったら右上のGenerate new tokenをクリックし、トークン(API)を発行します。

表示されたトークンをコピーかメモしておきます。(他人に漏れないように管理に気をつけてください)

少し前に開いたGoogleSheetsの名前だけ変えて何も入力しなかったスプレッドシートを出します(消していたらGooleSheetsから該当のファイルを開いてください)

上部のメニューにある拡張機能をクリックし、Apps Script をクリックし、スクリプトページを出します

以下の画面が出ると思います


スクリプトの設定

ここからのコードは素人が色々組み合わせで作ったので、おかしな箇所があっても突っ込まないでいただければと思います。。

以下のコードが初期設定で出ているを思いますが、全て消します。

1
2
3
function myFunction() {
  
}

何もなくなったら以下のコードを貼り付けます

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
function doPost(e) {
  try {
    var json = JSON.parse(e.postData.contents);
   
    // 1. 【確認】以下はGithubの「ユーザー名/ユーザー名.github.io」をいれる
    var repo = "ユーザー名/ユーザー名.github.io ";
   
    // 2. 【確認】以下はGitHubトークンをいれる
    var token = "GitHubトークン ";
   
    var path = "_posts/" + json.date + "-note.md";
    var url = "https://api.github.com/repos/" + repo + "/contents/" + path;
   
    var payload = {
      "message": "Add new note post via Make",
      "content": Utilities.base64Encode(json.content, Utilities.Charset.UTF_8)
    };
   
    var options = {
      "method": "put",
      "headers": {
        "Authorization": "token " + token,
        "Accept": "application/vnd.github.v3+json",
        "User-Agent": "Mozilla/5.0"
      },
      "payload": JSON.stringify(payload),
      "muteHttpExceptions": false // エラーを隠さないように変更
    };
   
    var response = UrlFetchApp.fetch(url, options);
    return ContentService.createTextOutput(JSON.stringify({status: "success", detail: response.getContentText()}));

  } catch(error) {
    // エラーが発生したら、その内容をそのまま返却する
    return ContentService.createTextOutput(JSON.stringify({status: "error", message: error.toString()})).setMimeType(ContentService.MimeType.JSON);
  }
}

 // 1. 【確認】以下はGithubの「ユーザー名/ユーザー名.github.io」をいれる
 var repo = “ユーザー名/ユーザー名.
github.io ”;ここはGithubのブログのレポジトリを開いたときに左上に表示されるものを入れます

**// 2. 【確認】以下はGitHubトークンをいれる
var token = “GitHubトークン “;
**ここは先程取得してコピー(メモ)したGithubのトークン(API)を入れます

上記にある保存(フロッピーマーク)を押して保存します

保存ができない場合は上記のコードがズレていたり謎のスペースが入ってしまっていないかなど確認してください。

4につづく

元記事はこちら