はてなブログとGitHub連携
やりたいこと
GitHub リポジトリで管理している日記を更新した時に自動的に紐づくはてなブログ記事を更新したい。
push をフックに同期するのと、手動でも同期できるようにしたい。
必要そうな技術要素
- GitHub Actions
- push あるいは手動で GitHub のブログとはてなブログの同期をとる
- はてなブログ API
- 同期をとるはてなブログ記事の更新を行う
以下、GPT3.5 に聞いた内容
はてなブログの記事を更新するには、はてなブログ AtomPub API を使用します。AtomPub は、Web 2.0 アプリケーションのためのプロトコルで、ウェブ上での更新、作成、削除を可能にするものです。
以下は、はてなブログ AtomPub API を使用して記事を更新する手順の概要です。
-
まず、はてなブログにログインします。
-
次に、はてなブログの設定ページに移動し、AtomPub を有効にします。AtomPub を有効にするには、「設定」→「詳細設定」→「AtomPub」を選択します。
-
AtomPub を有効にしたら、はてなブログ AtomPub API のエンドポイントを取得します。エンドポイントは以下の形式です。
https://blog.hatena.ne.jp/{ユーザー名}/{ブログID}/atom/entry
-
更新したい記事の ID を取得します。記事の ID は、記事の URL から取得できます。URL が「https://ユーザー名.hatenablog.com/entry/{記事のID}」の場合、記事の ID は「{記事のID}」になります。
-
更新したい記事のデータを作成します。AtomPub API では、更新する記事のデータを XML 形式で送信する必要があります。更新する記事のデータを以下のように作成します。
<?xml version="1.0" encoding="utf-8"?>
<entry xmlns="http://www.w3.org/2005/Atom">
<title type="text">更新する記事のタイトル</title>
<content type="text">{更新する記事の本文}</content>
</entry>
- 更新したい記事の URL を指定して、AtomPub API を呼び出します。以下は、Python での実装例です。
import requests
url = 'https://blog.hatena.ne.jp/{ユーザー名}/{ブログID}/atom/entry/{記事のID}'
username = 'はてなブログのユーザー名'
api_key = 'AtomPub を有効にしたときに表示された API キー'
entry_data = '''<?xml version="1.0" encoding="utf-8"?>
<entry xmlns="http://www.w3.org/2005/Atom">
<title type="text">更新する記事のタイトル</title>
<content type="text">{更新する記事の本文}</content>
</entry>
'''
response = requests.put(
url,
auth=(username, api_key),
data=entry_data,
headers={'Content-Type': 'application/xml'}
)
print(response.status_code)
以上が、はてなブログの記事を更新する API の使い方の概要になります。具体的には、はてなブログ AtomPub API の仕様を確認して、必要に応じて実装してください。
以下 GPT に聞いたエビデンス
はてなブログ AtomPub API の使用方法に関する情報源は以下の通りです。
- はてなブログ AtomPub API 公式ドキュメント: https://help.hatenablog.com/entry/atompub
公式ドキュメントには、AtomPub API のエンドポイント、XML データのフォーマット、API を使用するために必要なユーザー名と API キーの取得方法など、API の使い方に関する詳細な情報が記載されています。
- 「Python ではてなブログの AtomPub API を使って記事を更新する方法」: https://qiita.com/y_s_t_k/items/0d411ce8a7d0496c032f
Qiita の記事では、Python を使用してはてなブログ AtomPub API を使って記事を更新する方法が紹介されています。記事中では、requests モジュールを使用して AtomPub API を呼び出す方法が説明されています。
これらの情報源を参考にすることで、はてなブログの記事を更新する API の使い方を学ぶことができます。
API キーもはてなブログの詳細設定→ AtomPub から確認可能。
TypeScript のサンプル。by GPT
以下は、TypeScript を使用してはてなブログ AtomPub API を使って記事を更新する例です。この例では、axios ライブラリを使用して AtomPub API を呼び出しています。
import axios from 'axios';
const blogId = 'はてなブログのブログID';
const entryId = '更新する記事のID';
const apiUrl = `https://blog.hatena.ne.jp/{ユーザー名}/${blogId}/atom/entry/${entryId}`;
const username = 'はてなブログのユーザー名';
const apiKey = 'AtomPub を有効にしたときに表示された API キー';
const entryData = `<?xml version="1.0" encoding="utf-8"?>
<entry xmlns="http://www.w3.org/2005/Atom">
<title type="text">更新する記事のタイトル</title>
<content type="text">{更新する記事の本文}</content>
</entry>`;
axios.put(apiUrl, entryData, {
headers: {
'Content-Type': 'application/xml',
},
auth: {
username: username,
password: apiKey,
},
})
.then(response => {
console.log(`Status code: ${response.status}`);
})
.catch(error => {
console.error(error);
});
上記の例では、はてなブログの API エンドポイント、ユーザー名、API キーを変数に設定し、axios ライブラリの put メソッドを使用して AtomPub API を呼び出しています。また、XML データを文字列として変数に設定し、headers オプションを使用してリクエストの Content-Type を 'application/xml' に設定しています。
なお、この例を使用する前に、axios ライブラリをインストールする必要があります。以下のコマンドを実行してインストールしてください。
npm install axios
記事取得のサンプル
以下は、TypeScript を使用してはてなブログ AtomPub API を使って任意の記事の内容を取得する例です。この例では、axios ライブラリを使用して AtomPub API を呼び出しています。
import axios from 'axios';
const blogId = 'はてなブログのブログID';
const entryId = '取得する記事のID';
const apiUrl = `https://blog.hatena.ne.jp/{ユーザー名}/${blogId}/atom/entry/${entryId}`;
const username = 'はてなブログのユーザー名';
const apiKey = 'AtomPub を有効にしたときに表示された API キー';
axios.get(apiUrl, {
headers: {
'Content-Type': 'application/xml',
},
auth: {
username: username,
password: apiKey,
},
})
.then(response => {
const xmlString = response.data;
const parser = new DOMParser();
const xmlDoc = parser.parseFromString(xmlString, 'application/xml');
const title = xmlDoc.getElementsByTagName('title')[0].textContent;
const content = xmlDoc.getElementsByTagName('content')[0].textContent;
console.log(`Title: ${title}`);
console.log(`Content: ${content}`);
})
.catch(error => {
console.error(error);
});
上記の例では、はてなブログの API エンドポイント、ユーザー名、API キーを変数に設定し、axios ライブラリの get メソッドを使用して AtomPub API を呼び出しています。また、headers オプションを使用してリクエストの Content-Type を 'application/xml' に設定しています。
レスポンスデータは XML 形式で返されるため、DOMParser を使用して XML 文字列を XML ドキュメントオブジェクトに変換しています。XML ドキュメントオブジェクトから記事のタイトルと本文を取得しています。
なお、この例を使用する前に、axios ライブラリをインストールする必要があります。以下のコマンドを実行してインストールしてください。
npm install axios