MoreBeerMorePower

Power Platform中心だけど、ノーコード/ローコード系を書いてます。

Bluesky に Power Automate/Logic Apps から画像やブログのURLを投稿してみよう!

普通の文章を投稿するのは前回やりました。今回紹介するのは↑こういう投稿をAPIで行うための手順です。

前提として、投稿する画像はOneDrive for Businessに保存されているものとしますが、他のどんな場所に保存されている画像でも基本的な手続きは同じです。

画像付きの投稿を行う

まずは画像付きの投稿から始めます。画像付き投稿の場合には、投稿の前にBlueskyに対して画像をアップロードしておく必要がある点に注意が必要です。

ここではAPI経由での画像アップロードと、その画像を投稿に乗せる方法を順に説明します。

1. 画像をアップロードする

投稿に乗せる画像をBlueskyにアップロードします。

そのための準備として、OneDrive for Businessから、画像ファイルのコンテンツを取得し、Blueskyのセッションを作成(トークンの取得)を行っておきます。

セッションの作成については前回の投稿を確認してください。

OneDrive for Businessから取得した画像コンテンツとBlueskyのトークンをもとに、画像をBlueskyにアップロードします。

HTTPアクションを追加して以下のように設定します。

  • URI: https://bsky.social/xrpc/com.atproto.repo.uploadBlob
  • Method: POST
  • Headers: Content-Type : */* , Authorization : Bearer <アクセストークン> , Accept : application/json
  • Body: OneDrive for Businessから取得した File content

いつもは Content-Typeがapplication/jsonですが、画像を送るのでここは */*になっていること、 Acceptを設定することに注意してください。

※Bodyの実体?としては{"$content-type": "image/png", "$content":"base64文字列"}なJSONになっています。

このアクションの結果、以下のようなJSONが返されます。

{
  "blob": {
    "$type": "blob",
    "ref": {
      "$link": "bafkreidxxxxxxxxxxxxxxxxxxxxxxmpf7rsc5liwe"
    },
    "mimeType": "image/png",
    "size": 151134
  }
}

このJSONは画像付きの投稿を行うとき "blob" の中をそのまんま使います。body('HTTP')?['blob'] の結果を作成アクションに入れておくのもよいでしょう。

2. 画像付き投稿を行う

公式のレファレンスだと以下の部分が該当しますが、APIにのせるBody部分が少し構造が違ったので、ここで紹介しておきます。

URIやヘッダーは前回紹介した、普通の投稿と同じです。

Creating a post | Bluesky

画像アップロードのアクションの次に、さらにHTTPアクションを追加して以下のように設定します。

  • URI: https://bsky.social/xrpc/com.atproto.repo.createRecord
  • Method: POST
  • Headers: Content-Type : application/json , Authorization : Bearer <アクセストークン>
  • Body:
{
  "repo": "ここにユーザーID",
  "collection": "app.bsky.feed.post",
  "record": {
    "text": "画像付きポストをAPI経由で実行するテスト",
    "createdAt": "2024-02-12T10:00:00:Z",
    "embed": {
      "$type": "app.bsky.embed.images",
      "images": [
        {
          "alt": "画像のALTテキスト",
          "image":  {
            "$type": "blob",
            "ref": {
              "$link": "bafkreidxxxxxxxxxxxxxxxxxxxxxxmpf7rsc5liwe"
            },
            "mimeType": "image/png",
            "size": 151134
          }
        }
      ]
    }
  }
}

"images"が配列になっているのは画像を最大で4枚投稿できるからです。

さらに注目は"images"のしたの"image"の構造です。これが見比べるとちょうど画像をアップロードしたときの応答データになっていることがわかります。

そのため、HTTPアクションとしては意外と簡単に、body('HTTP')?['blob'] を使って以下のように設定できるわけです。

これで画像付きの投稿が完了です。Bluesky側では以下のように表示されます。

ブログなどのURLを投稿する

ブログを自動投稿したい場合に使えそうな方法が、「リンクカード」の投稿です。

公式のレファレンスでは以下が該当部分です。

Creating a post | Bluesky

普通の投稿と基本は同じですが、HTTPアクションのBodyが少し変わります。

{
    "repo": "ここにユーザーID",
    "collection": "app.bsky.feed.post",
    "record": {
      "text": "投稿の本文",
      "createdAt": "2024-02-12T10:10:00Z",
      "embed": {
        "$type": "app.bsky.embed.external",
        "external": {
          "uri": "リンク先URL",
          "title": "カードに表示するタイトル",
          "description": "カードに表示する説明文.",
          "thumb": {
            "$type": "blob",
            "ref": {
              "$link": "bafkreiaxxxxxxxxxloaytdywcvb3r3zrzhu"
            },
            "mimeType": "image/png",
            "size": 23527
          }
        }
      }
    }
  }    

それぞれ実際の投稿とどのように対応するか見てみましょう。

サムネイル画像は、上で紹介した「画像付き投稿」の時と同じ方法で、先にBlueskyにアップロードしておく必要があります。

画像付き投稿と同様、"thumb"部分はアップロード結果の応答と同一なので body('HTTP')?['blob']を使って

このようにPower Automateのアクションとしては書けます。

画像のアップロードが少し手間ですが、これくらいの操作で画像もついたリンクカードの投稿ができます。

おわり

今回はBlueskyへの投稿を、より実践的な例とともにご紹介しました。

Blueskyではこのほかにもリッチテキストを使った装飾などにも対応しているようなので、また紹介していこうかと思います。