🐛
Zenn の @[tweet] の挙動調査
Zenn の独自記法 @[tweet]
Zenn では独自記法を使うことでツイートを埋め込むことができます。
@[tweet](ツイートページのURL)
なぜかツイートが埋込されないケースが発生
ローカルのプレビュー環境ではちゃんと表示されているが本番環境では表示されない症状に遭遇しました。
記事はこちら「Zenn に投稿したらツイートする RPA レシピ | Zenn」
ローカル
本番
問題の文章
## 結果
:::message
この記事公開後、ツイートされるはずなので、その結果を載せます。
:::
https://twitter.com/srz_zumix/status/1311583381721944065
@[tweet](https://twitter.com/srz_zumix/status/1311583381721944065)
:::message
10時頃記事公開、11時にトリガー設定してましたが、Integromat 側で新規フィード認識がされなかったので、
2時間おきのインターバルに設定し、17時に認識されました。
もしかしたら公開してすぐは認識できないかもしれません。なにかわかったら追記します。
:::
以下テスト
埋め込みたいツイートに含まれる URL が自分自身の記事の URL なのが良くないのかな？という予測を立てつつ、テストしてみます。
Zenn 公式のツイート
問題の記事でも表示されていたので問題ないはず。
同じのを２つ。
筆者アカウントのツイート
問題のツイート以外の適当なツイートの埋め込みテスト。
画像つきツイート
問題のツイート
表示されなかった記事に埋め込んだツイート。
この記事のリンクを含んだツイート
デバッグ
コンソール出力。
あやしいログ。
Issues detected. The new Issues tab displays information about deprecations, breaking changes and other potential problems.
Indicate whether to send a cookie in a cross-site request by specifying its SameSite attribute
Because a cookie's SameSite attribute was not set or is invalid, it defaults to SameSite=Lax, which prevents the cookie from being sent in a cross-site request. This behavior protects user data from accidentally leaking to third parties and cross-site request forgery.
Resolve this issue by updating the attributes of the cookie:
Specify SameSite=None and Secure if the cookie should be sent in cross-site requests. This enables third-party use.
Specify SameSite=Strict or SameSite=Lax if the cookie should not be sent in cross-site requests
10 cookies
Learn more: SameSite cookies explained
結果
Discussion に書く。
どうやら自分のブラウザ環境が原因なことは確定。
キャッシュとクッキー削除でツイートが表示されるようになりましたmm
Discussion
１つしかでない？
自分のブラウザの問題のようでした。
別のソフトなら見れました。（何が原因だろう？）
アドブロックを使用していたりしますか？
埋め込み部分は基本的にツイートの埋め込みの仕様に則って、
https://platform.twitter.com/widgets.jsを読み込む形で実現しています。考えられる原因としては、
①そのスクリプトの読み込みが弾かれている（その場合ブラウザのコンソールにエラーメッセージが出ている気がします）
②アドブロックにより広告だとみなされてしまっている
あたりかなと思っています。
②の場合だとどう対応したら良いんだろう・・・
サポートありがとうございます。
アドブロックは利用してないですね。（たぶん
ありがとうございます。たしかにその情報を見ると、キャッシュが怪しそうな感じはありますね…。表示されないChromeで右クリック→「検証」→「console」タブを開いたときにエラーメッセージのようなものって表示されていますか？
コンソールログには以下が出ていました。
Issues detected. The new Issues tab displays information about deprecations, breaking changes and other potential problems.
そして、キャッシュとクッキー削除したら直りましたmm
詳細は記事の方にスクリーンショットと一緒に載せました。
ツイートが表示されるようにはなりましたが、コンソールのログ・issue は出たままでした。
詳しくありがとうございます！キャッシュとクッキー削除で直ったんですね。
なぜだろう…。また、何か分かりましたらこちらに書こうと思います。
Zenn を開いたままクッキー削除したときは直らなかったのですが、Zenn を開いてたタブを全部閉じてからクッキー削除したら直りました。
いろいろサポートしていただきありがとうございました。
こちらでも再発したり、何かわかったりした場合は追記したいと思いますmm