iPhone のスクショを写真app から「ショートカット」で WordPress へ簡単転送(めっちゃ失敗しました)

Tips

iPhoneアプリをレビューしようと思ったとき、面倒なのがスクリーンショットをどうやってWordPressに送るかなんですよね。

記事を書くのは基本的にPCなので、iPhoneで撮った画像をそちらで使えるようにしないといけません。Xの別アカウントへDMで送れば済む話ではあるんですが、できればこの手間を減らしたい。

AIに相談したところ、最終的には、写真アプリで画像を選んで、共有からWordPressのメディアへ直接送るショートカットが使えるようになりました。

これがめちゃくちゃ便利。

ただ、そこへたどり着くまでには、手作りで難航して、別の方法を探して、というやり取りがありました。

最初に言っておきたいのですが、自作は大失敗しました。最終的には海外のユーザーの作った配布版がとてもよい作りで、それを設定して使うことになりました。

Safariの管理画面は、もう試していた

最初は、PC へ画像を渡す方法と、WordPress へ直接送る方法が候補になりました。直接メディアへ入ってくれれば、PC へ取り込んでからアップロードする作業を減らせます。

そこでAIが提案したのは、iPhone の Safari で WordPress の管理画面を開き、メディアへ追加する方法でした。

@donpy
それはやりましたが、操作しづらすぎてダメでした

これやったことある方はわかると思いますが、かなり使い勝手悪いんですよね。

ChatGPT
なるほど、標準の管理画面は試したうえで使いづらかったんですね。それなら、写真アプリでスクショを選択→共有→「WordPressへ送る」というショートカットを作る方向が合いそうです。
最初に接続設定を済ませれば、毎回Safariで管理画面を操作せず、選んだ画像を直接メディアライブラリへ送る形にできます。PCでは届いた画像を記事に挿入するだけです。
これなら、どんぴさんが面倒に感じている部分をかなり省けそうです。

毎回あの管理画面を操作しなくていいなら、それはよさそうです。ショートカット機能自体も、一度試してみたかったんですよね。

@donpy
おお。それやってみましょう。iPhoneのショートカット機能は一度試してみたかった機能でもあります

ここから、AI に画面を見せながら、ひとつずつアクションを並べて作り始めました。

ショートカット初体験。でもうまくいかない・・・

今回使うのは、WordPress の REST API という、外部から WordPress へデータを送る仕組みです。

認証には、WordPress のプロフィール画面で発行するアプリケーションパスワードを使います。WordPress公式の認証説明にもある方法です。

ユーザー名とアプリケーションパスワードを組み合わせた文字列を Base64 でエンコードし、画像と一緒に送る。そのための処理をショートカットへ追加していきました。

ところが、実行すると400エラー。

設定を変えると401になったり、接続が切れたり。画像の渡し方だけでなく、認証情報が正しく届いているかも確認することになりました。

一度、WordPressに登録されている画像の一覧が返ってきた場面はありました。ただ、それだけでは認証に成功したとは言えません。認証が必要な自分のユーザー情報を取得する確認では、「現在ログインしていません」と返ってきました。

@donpy
idかパスワードが間違ってるんじゃないのかな?
ChatGPT
はい、IDかアプリケーションパスワードが違う可能性はあります。 まずそこを確認しましょう。今の401だけでは、原因の断定はできません。

ユーザー名、パスワード、区切りのコロン、変数の参照先。画面を見ながら確認を重ねますが、うまくいきません。

@donpy
お手上げですね。idもパスワードも合ってるのにダメですね

その後はWordPress側のサイトヘルスも確認しました。プロフィールを更新したらどうか、と試しても解消しません。設定をひとつずつ変えているのに、画像を送れるところまで進めない状態が続きました。

ちょっと方向性を変えてみた

IDもパスワードも合っているのに、認証が通らないってことは根本的に何かが間違っているんだろうと考え、やたら AI がこだわっていた少しずつ設定を変えていく方法に異議を唱えました。

ここで、少し方向を変えることに。

@donpy
これはちょっと難航しそうですね。この方法は難しいかもしれません。同じようにショートカットでWordPressに画像アップしようとしてる記事とかないか調べてみて下さい
ChatGPT
ありました。今と同じ「REST API+アプリケーションパスワード」で作った実例に、配布済みショートカットもあります。 先にこの実例を探すべきでした。

見つかったのは、主にふたつの実例です。

  • Chuck Grimmettさんの英語記事は、REST APIとアプリケーションパスワードを使う方法。ショートカットも配布されています。
  • ティーエム・ラボの日本語記事は、WordPressアプリの「WordPressに投稿」アクションを使う方法。写真を選んで共有するという使い方は近いですが、送信の仕組みが違います。

いま試している方法と近いのは、英語記事のほうでした。

ChatGPT
次に試すなら、①の配布版を別のショートカットとして追加して比較するのがよいと思います。今のものを何度も手直しするより、作者の完成した構成で同じ401になるかを切り分けられます。

そこで、手作りしたものとは別に、配布版を追加してみることにしました。同じように考えて、すでに形にしている人がいたんですね。そりゃそうです。私が思いつくようなこと、みんな考え付きますって。最初からこう指示すればよかったとちょっと後悔しました(笑)

配布版で、WordPressのメディアに入った!

配布版には、認証情報や送信先を設定する画面がありました。送信先は、自分のWordPressのメディア用URLです。わたしのサイトでは https://www.donpy.net/wp-json/wp/v2/media になります。

追加ボタンが反応しない場面もありましたが、設定をスキップする案内を受けて進めると、ショートカットは追加されていました。編集画面を見せると、送信先も入っていると確認してもらえました。

ChatGPT
はい、配布版が追加され、送信先URLも入っています。 画像を1枚ずつJPEGに変換して送る構成も見えています。
次は写真アプリで画像を 1枚だけ開き、共有から 「Upload Images to WordPress…」を選んで実行してください。
終了後、WordPressの 「メディア」→「ライブラリ」に、その画像が追加されたか確認しましょう。

写真アプリから1枚送ってみます。今度は、iPhoneのダイナミックアイランドにチェックマークが出ました。そして、WordPressのメディアを確認してみると、、

@donpy
iPhoneでの上のダイナミックアイランドでもチェックマークが出て、WordPressのメディアにちゃんとはいってます

ようやく届きました。同じ認証情報で配布版は動いたので、少なくともWordPress側で画像を受け入れられることはわかりました。

この検証中に共有したパスワードについては、新しいものを発行してショートカットの設定を変更。新しいパスワードでもアップロードできたところまで確認しています。共有した古いパスワードは、WordPress側で取り消す必要があります。

使うときは、写真を選んで共有するだけ

今回使った配布元は、Chuck Grimmettさんの記事です。記事冒頭の更新情報に、共有シートと初回設定に対応した更新版ショートカットへのリンクがあります。本文途中には旧版のリンクもあるので、冒頭の更新版を確認するとよいです。

導入時には、自分のWordPress用の認証情報と送信先を設定します。アプリケーションパスワードは、普段のログインパスワードとは別に発行するもの。WordPressのユーザー>プロフィールから設定できます。設定した認証情報は、他人に渡すショートカットや画面写真に含めないようにします。

設定後の使い方は、次の流れです。

  • iPhoneの写真アプリで、送るスクリーンショットや写真を選ぶ。
  • 共有から「Upload Images to WordPress…」を実行する。
  • WordPressのメディアライブラリに画像が追加されたか確認する。
  • PCで記事を書くときに、その画像をメディアライブラリから選ぶ。

共有ボタン押したら画面下にメニューがたくさん並んでいるんですが、その中に今回のショートカットが表示されています。「Upload Images to WordPress」というやつをポチるだけ。このスクショも iPhone から同様の操作で送られてきたものです(笑)

いやー素晴らしいショートカットですよね。画像をPCへ渡すためだけに別のアプリを経由しなくて済んじゃうんですから!

これで、記事を書き始める前の準備が、ひとつ楽になりました。

配布版には、受け取った画像を1枚ずつ処理する繰り返しも入っています。複数画像もいけそうだと思って複数枚も試しましたが、とりあえず全部成功しました。さらにこりゃ便利。

配布元のコメントには、実行しても画像が登録されないという報告もあります。わたしの環境では動きましたが、終了表示だけで済ませず、メディアに届いたところまで確認してみてください。

敗因分析

動いたあと、配布版の中も見てみました。認証用の文字列をいったん名前付きの変数に保存する処理があり、画像はJPEGに変換してから送っています。

手作り版とは、画像の送信方法にも違いがありました。手作り版はフォームの中の file へ画像を渡す構成。配布版は変換した画像を直接送り、画像の種類とファイル名も指定していました。

ただ、その違いを見つけたからといって、最初のエラーの原因までわかったわけではありません。

ChatGPT
画像を送らない /users/me でも認証に失敗していたので、ファイルの送信方法だけが原因だったとは言えません。変数への保存が必須だったとも言えません。
もっと早く実績のある配布版を試し、動く構成と比較するべきでした。今回、どんぴさんの入力ミスを疑い続ける方向は適切ではありませんでした。

一番の敗因は原因を絞れないまま、AI の言うまま、同じところで設定変更を続けていたことだと思います。確かに誰にも頼らず自作できたほうがかっこええやんという色気もありましたけどね(笑)

配布版が動いたことで、ようやく比較できるものができました。

けど、これ以上の深追いはしません(笑)

最後に

わたしが考えることなら、同じことを考えた人がほかにもいるはず。まず前例を探して、使えるものを試して、足りなければ手を入れる。それでもなければ手作りする(成功するとは限らないけど)、という順番はこれからもっと意識したいところです。

その一方で、今回見つかったのは英語圏の方のショートカットでした。AIが見つけてくれなければ、わからなかったと思います。こういうところはほんと私の手の届かないところではありましたので大助かりでした。

@donpy
いやーでもこれもめちゃくちゃ便利なツールが手に入りました。これは記事にしたいところです

設定ではだいぶ寄り道しましたが、手元に残ったのは、写真アプリからWordPressへ送れる便利な道具。iPhoneアプリの記事を書くときに、さっそく使えるものが増えました。

いやー毎日のように自分にとってのちょっとの便利を手にすることができてほんと楽しいです。

ではまた。

Tips

Posted by donpyxxx


ディスカッション

コメント一覧

まだ、コメントがありません

コメントをどうぞ

メールアドレスが公開されることはありません。※ が付いている欄は必須項目です

このサイトはスパムを低減するために Akismet を使っています。コメントデータの処理方法の詳細はこちらをご覧ください。