見出し画像

X(旧Twitter)とthreadsとblueskyに同時投稿するツールを考える③

みつにし

前回のあらすじ
blueskyは公式で便利なPythonモジュールを用意してくれているけどHTMLでは使えないのだった。
javascriptは面倒い

前回貼り付けた記事。

で、これを織り込んだHTMLが以下。

<!DOCTYPE html>
<html lang="ja">
<head>
  <meta charset="UTF-8">
  <link rel="stylesheet" href="https://pyscript.net/latest/pyscript.css" />
  <script defer src="https://pyscript.net/latest/pyscript.js"></script>
  <style type="text/css">
    input[type="text"] {
      width: 500px;
      height: 100px;
    }
    </style>
</head>
  <body>
    <py-config>
      packages = ["requests"]
    </py-config>
    <table>
      <tr>
        <th>SNS</th>
        <th>post</th>
        <th>ID</th>
        <th>Password</th>
      </tr>
      <tr>
        <th>Bluesky</th>
        <th><Input type='checkbox' id='-bsky-'><label></label></th>
        <th><Input type="Input" id="-bsky_id-" placeholder="ID(xxx.bsky.social)" autocomplete="on" size="15"></th>
        <th><Input type="Input" id="-bsky_pass-" placeholder="パスワード" autocomplete="on"></th>
      </tr>
    </table>
    Post
    </br>
    <textarea type="text" id="-post-" placeholder="ここに文章を入力" rows="5" cols="57"></textarea>
    </br>
    <button py-click="clicked()" id="-button-" style="border:2px solid #87a2c1; background-color:#cce3ff;">
      <font color="#333333">-Bsky Post-</button>
    </br>
    <div id="text_log">ここにはログが表示されます</div>
    <py-script>
      import requests
      import json
      from datetime import datetime, timezone
      import urllib.parse
      from js import document

      def clicked():
          # Blueskyの情報取得
          check_bsky = js.document.getElementById("-bsky-")
          # Element("text_log").write(check_bsky.checked)
          if check_bsky.checked == True:
              if Element("-bsky_id-").element.value != "":
                  bsky_id_no = Element("-bsky_id-").element.value
                  bsky_password = Element("-bsky_pass-").element.value
              else:
                  Element("text_log").write("BlueskyのIDを入力してください")
                  return

          # 時刻の取得
          utc_now = datetime.utcnow()
          now = utc_now.strftime("%Y-%m-%dT%H:%M:%SZ")

          # 投稿文の取得
          text = Element("-post-").element.value

          # 投稿フロー
          # bluesky
          if check_bsky.checked == True:
              # ログイン
              bsky_url = "https://bsky.social/xrpc/com.atproto.server.createSession"
              bsky_data = {
                  "identifier": bsky_id_no,
                  "password": bsky_password
              }
              bsky_headers = {
                  "Content-Type": "application/json; charset=UTF-8"
              }
              response = requests.post(bsky_url, data=json.dumps(bsky_data), headers=bsky_headers)

              accessJwt = response.json()["accessJwt"]
              did = response.json()["did"]

              # 投稿
              url_post = "https://bsky.social/xrpc/com.atproto.repo.createRecord"
              data_post = {
                  "repo": did,
                  "collection": "app.bsky.feed.post",
                  "record": {
                      "text": text,
                      "createdAt": now
                    }
                  }

              headers_post = {
                  "Authorization": f"Bearer {accessJwt}",
                  "Content-Type": "application/json; charset=UTF-8"
              }

              response_post = requests.post(url_post, json=data_post, headers=headers_post)
              responseJSON = response_post.json()

              # ステータスコードが200か判定
              if response_post.status_code == requests.codes.ok:
                  Element("text_log").write('blueskyにポスト完了')
              else:
                  Element("text_log").write('blueskyのポスト失敗')
          else:
              # Element("text_log").write('bluesky no check')
              pass

    </py-script>
  </body>
</html>

長い長い。
Noteってコードの折り畳みとか出来るん？埋め込み限定ならいいや。
取り敢えず出来たサイトが以下。（Googleサイトで作成）

パスワードとか入力するのアレかもしれないけど、
特にコードも隠していないので記録とかしてないのは見れると思う。
むしろコメント欄にスクリプト打たれたらどうなるとか逆に確認してない。
流石にAPI側で何とかしているのだろうか。
あとGoogleサイトで作成したせいか、スマホで見るとめっちゃ見難い。

でも出来たということで、
今度はTwitterの方を何とかしてみたいと思っている。