【メモ】Twitchのクリップが埋め込めない件が解決

📢 A reminder to update your Twitch embedded experiences.
Today is the day! The 'parent' parameter will soon be required to specify your domains where Twitch content is embedded. See the original announcement for more info, examples, and questions.https://t.co/Za4WgQ0UZB
— TwitchDev (@TwitchDev) June 10, 2020

先々週くらいにTwitchのクリップを埋め込む仕様が変わってブログで表示できなくなって、streamableにわざわざ再アップしてたんだけど、解決したので報告。

<iframe src="https://clips.twitch.tv/embed?clip=AgreeableSmoothFrogOneHand&amp;parent=www.example.com" width="620" height="378" frameborder="0" scrolling="no" allowfullscreen="allowfullscreen"></iframe>

クリップ埋め込みソースの説明どおり「www.example.com」をクリップを表示したいページのドメインに変更。このブログなら「www.example.com」→「d3watch.gg」。ここまでは分かるけど、自分の場合それでも表示できなかった。

どうも大事なのはブログのサーバー設定をSSLにすることで、設定は使ってるサーバーごとに違うからやり方は省くけど、これをやらないと表示されないらしい。

つまりブログにアクセスしたときのアドレスが「http://～」ではなく「https://～」にならないと駄目で、自分の場合はサーバーの設定をSSLにして.htaccessで「https://～」に転送²することで無事表示させることできました。

自分がよく見に行くいくつかの個人ブログもTwitchクリップ表示できないみたいでリンクやリアップロード版貼ってたけど、これで解決できるかも。

ちなみに上の埋め込みコードのクリップ。先週くらいにredditで話題になってたFissureのエルザコスプレ。

脚注：

RewriteEngine On
RewriteCond %{HTTPS} !on
RewriteRule ^(.*)$ https://%{HTTP_HOST}%{REQUEST_URI} [R=301,L]

RewriteEngine On
RewriteCond %{HTTPS} !on
RewriteRule ^(.*)$ https://%{HTTP_HOST}%{REQUEST_URI} [R=301,L]