こんにちは、tosumaです。
今回はX(旧Twitter)の画像を「画像そのものを右クリックする」以外の操作で取得する方法についての記事です。
これまで私はX(旧Twitter)の画像を固定操作で取得する方法無いかな、と色々と検討してきました。
もう昨年のアレからずっとです。ずっとこんな事を考えて生きています笑。
え？
「右クリックしたらいいじゃん」って？
いやいや、何言ってるんですか～、ぶん殴りますよ(^-^)
使うPCの画面の大きさだったり、ポスト(旧ツイート)の文字数だったり、画像を何枚アップロードしてるのかだったりと、何やかんやでクリック位置も右クリックメニューの選択位置なんかが変動的になるんですよ。
で、幾つか方法を模索した中で私的に最も簡単かつ目的が達成できるものがコチラです。
GoogleChromeのデベロッパーツールです。
なんて身近にあった解決策。
上記図の赤い部分を選択していくと最終的に画像をリストアップできるんです。
具体的には以下の流れです。
① [F12]キーにてデベロッパーツール起動
②Networkツールを選択
③フィルターで[Img]を選択
④テキストボックスで[format]を指定
⑤X(旧Twitter)検索実行
これでアップロードされた画像のみ抽出できます。
え？
「素直に画像を右クリックするより手間じゃね」って？
いやいや、何言ってるんですか～、はり倒しますよ(^-^)
プログラム的思考において「手順を固定化」こそ至高です、手数では無いです。
ただ、これだと要素がたくさんあってどれがどのポストの画像かわかりませんね。
それだと意味無いですね、困りましたね。
ウィジェットはX(旧Twitter)社が用意してくれているブログとかに埋め込みするためのユーザーインターフェースですね。
もしユーザーインターフェースがわからない場合はおうちのお父さんに聞いてみようね！
きっと困った顔するよ(^-^)
ウィジェットを使うと特定のポストのみ表示可能です。
つまりウィジェットのみのページを作成し、先ほどのフィルターを使うとこうなります。
これでポストに対して紐づく画像のみ取得できます。
肝心のウィジェットの作り方ですが本来の手順はコチラにアクセスして、対象のポストのURLを入力するとプログラムが生成されコピペできます。
https://publish.twitter.com/#
で、まぁそれは今回の趣旨的に無駄が多いので必要な部分のみに削ぎ落したのがコチラです。
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd"> <html lang="ja"> <head> <meta charset="utf-8"> <title>widgets</title> </head> <body> <blockquote class="twitter-tweet"> <a href="https://twitter.com/Tay_Tosuma/status/1766617660052410702"></a> </blockquote> <script async src="https://platform.twitter.com/widgets.js" charset="utf-8"></script> </body> </html>
え？なんで削ぎ落すのかって？
いやほら、ポストだけ表示できればいいから。
hrefの中のURLを置き換える事で別のポストの表示も可能です。
なので、この部分をパラメータ化するなどすれば任意のポストが表示できます。
あとはこれをどう使うか、ですね。
ここから先はどう使うのかは自分の目で確かめてみよう！！
それでは皆さんも良いテクニカルライフを！！
お読み頂き有難うございました。
