今回は下記の記事で紹介したNoteの自動投稿Pythonライブラリの改善について考える。

元々NoteClientは自分のために開発したため、設計など一切せず開発が容易なSeleniumでnoteをスクレイピングして記事を投稿するという仕組みである。

このせいで拡張性が低く、処理が遅い。

今回はその問題の解決策をまとめる。

記事を作成する

Seleniumは我々ユーザーと全く同じ動作をプログラムとして実行しているだけなので処理が遅い。

なので、noteのAPIを使用することで処理を高速化できると考えた。

試しに記事を作成するときの通信を観てみましょう。

Chromeのデベロッパツールを使用して新しい記事を作成したときの通信を観ると、text_notesという項目の通信を発見した。

この通信は「https://note.com/api/v1/text_notes」にPOSTを送ると、このようなレスポンスが返ってきます。

レスポンスを見るとkeyという項目に記事のIDが入っていることが分かります。

もちろん、この通信にはユーザー情報が入ったcookieが必要になります。

Pythonでサンプルコードを作成してみるとこんな感じ。

import requests

cookies = {
    '_note_session_v5': 'xxxxxxxxxxxxxxxxxxxxxx',
    'XSRF-TOKEN': 'xxxxxxxxxxxxxxxxxxxxxx',
    '_gid': 'xxxxxxxxxxxxxxxxxxxxxx',
    'fp': 'xxxxxxxxxxxxxxxxxxxxxx',
    '_vid_v1': 'xxxxxxxxxxxxxxxxxxxxxx',
    '_vid_v1': 'xxxxxxxxxxxxxxxxxxxxxx',
    '_ga': 'xxxxxxxxxxxxxxxxxxxxxx',
    '_ga_J9CPC3WE56': 'xxxxxxxxxxxxxxxxxxxxxx',
}

headers = {
    'authority': 'note.com',
    'accept': '*/*',
    'accept-language': 'en-JP,en;q=0.9,ja-JP;q=0.8,ja;q=0.7,en-US;q=0.6',
    'content-type': 'application/json',
    'origin': 'https://editor.note.com',
    'referer': 'https://editor.note.com/',
    'sec-ch-ua': '"Chromium";v="122", "Not(A:Brand";v="24", "Google Chrome";v="122"',
    'sec-ch-ua-mobile': '?0',
    'sec-ch-ua-platform': '"Windows"',
    'sec-fetch-dest': 'empty',
    'sec-fetch-mode': 'cors',
    'sec-fetch-site': 'same-site',
    'user-agent': 'Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/122.0.0.0 Safari/537.36',
    'x-requested-with': 'XMLHttpRequest',
}

json_data = {
    'template_key': None,
}

response = requests.post('https://note.com/api/v1/text_notes', cookies=cookies, headers=headers, json=json_data)

article_key = response.json()['data']['key']
article_id = response.json()['data']['id']

このようにAPIを利用することで、Seleniumより断然高速に処理を行うことができる。

画像をアップロードする

次にアイキャッチ画像をアップロードする方法についても考える。

現状NoteClientではNoteが提供する画像の中からでしか選べないので、今回はローカル環境にある画像ファイルをアップロードできるようにすることを目標とする。

こちらも画像をアップロードする際の通信を調べてPythonのコードに起こしてみました。

import requests

cookies = {
    '_note_session_v5': 'xxxxxxxxxxxxxxxxxxxxxx',
    'XSRF-TOKEN': 'xxxxxxxxxxxxxxxxxxxxxx',
    '_gid': 'xxxxxxxxxxxxxxxxxxxxxx',
    'fp': 'xxxxxxxxxxxxxxxxxxxxxx',
    '_vid_v1': 'xxxxxxxxxxxxxxxxxxxxxx',
    '_vid_v1': 'xxxxxxxxxxxxxxxxxxxxxx',
    '_ga': 'xxxxxxxxxxxxxxxxxxxxxx',
    '_ga_J9CPC3WE56': 'xxxxxxxxxxxxxxxxxxxxxx',
}

headers = {
    'authority': 'note.com',
    'accept': '*/*',
    'accept-language': 'en-JP,en;q=0.9,ja-JP;q=0.8,ja;q=0.7,en-US;q=0.6',
    'content-type': 'multipart/form-data; boundary=----WebKitFormBoundary6BEoGh76AxbEBphg',
    'origin': 'https://editor.note.com',
    'referer': 'https://editor.note.com/',
    'sec-ch-ua': '"Chromium";v="122", "Not(A:Brand";v="24", "Google Chrome";v="122"',
    'sec-ch-ua-mobile': '?0',
    'sec-ch-ua-platform': '"Windows"',
    'sec-fetch-dest': 'empty',
    'sec-fetch-mode': 'cors',
    'sec-fetch-site': 'same-site',
    'user-agent': 'Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/122.0.0.0 Safari/537.36',
    'x-requested-with': 'XMLHttpRequest',
}

with open('path/to/your/image.jpg', 'rb') as image_file:
    image_data = image_file.read()

files = {
    # 先程のコードの最終行で取得したarticle_id
    'note_id': (None, article_id),
    'file': ('image.jpg', image_data, 'image/jpeg'),  # Update the filename and content-type as needed
    'width': (None, '1920'),
    'height': (None, '1005'),
}

response = requests.post('https://note.com/api/v1/image_upload/note_eyecatch', cookies=cookies, headers=headers, files=files)

このようにすることでプログラムを実行する環境内のファイルを読み込みnoteのサーバーにアップロードすることができます。

またresponseから画像のURLを取得することができます。

記事を投稿する

考え中🤔