Instagram 埋め込みコードの構造を解析してみた - Qiita

はじめに Instagramのサイトでこ任意の写真を表示してる段階でコメント欄の下の方にあるボタン（赤枠で囲った所）をクリックすると、埋め込みコードを取得できる画面が表示されるかと思います この埋め込みコードですが、一見するととても複雑なのですがちょっと調べてみたら実は不要な情報がたくさんあることがわかりました。 以下に、埋め込みコードの中から最低限必要な情報が何なのか解析した一連の流れをまとめました 検証した環境 Mac上でRailsのThin web server (v1.6.3 codename Protein Powder)を使って確認しただけです。 作業にあたって 自分がフォローしてるアカウントでBrewDogというアカウントのこの写真を例にしてます。 ※どうでもいいけどPunkIPAは昔のボトルデザインの方が好みだったなぁ・・ オリジナルの埋め込みコード 埋め込みコードをコピー

[akiryotae]

“<blockquote class="instagram-media" data-instgrm-captioned data-instgrm-version="5" style=" background:#FFF; border:0; border-radius:3px; box-shadow:0 0 1px 0 rgba(0,0,0,0.5),0 1px 10px 0 rgba(0,0,0,0.15); margin: 1px; max-width:658px; padding:0; width:99.375%; width:-webkit-calc(100% - 2px); wid

[sakamotz]

“<blockquote class="instagram-media" data-instgrm-captioned data-instgrm-version="5" style=" background:#FFF; border:0; border-radius:3px; box-shadow:0 0 1px 0 rgba(0,0,0,0.5),0 1px 10px 0 rgba(0,0,0,0.15); margin: 1px; max-width:658px; padding:0; width:99.375%; width:-webkit-calc(100% - 2px); wid

[h5y1m141]

実用的かどうかわからないけど、仕事で必要に迫られて調べたのでまとめた