Googleタグマネージャーがプレビューできない！😭

状況

Google Tag Managerでプレビュー接続をしようとしたら、

繋がらない！！！！！ 😭😭😭😭

解決方法

拡張機能のuBlockOriginが悪さをしていました。

拡張機能の管理画面から、機能を一時的にOFFにしてしまいましょう！
その状態で、改めてリトライをすると、、、

やったぜ！🎉🎉🎉🎉🎉

原因＆根本解決

HTMLに埋め込んでいるGTMのタグが広告ブロックの対象となっており、正常に読み取りができなくなっていました。

<!-- Google Tag Manager -->
<script>(function(w,d,s,l,i){w[l]=w[l]||[];w[l].push({'gtm.start':
new Date().getTime(),event:'gtm.js'});var f=d.getElementsByTagName(s)[0],
j=d.createElement(s),dl=l!='dataLayer'?'&l='+l:'';j.async=true;j.src=
'https://www.googletagmanager.com/gtm.js?id='+i+dl;f.parentNode.insertBefore(j,f);
})(window,document,'script','dataLayer','GTM-HOGEHOGE');</script>
<!-- End Google Tag Manager -->

このコードの、www.googletagmanager.comの部分がブロックされてしまっているので、拡張機能のホワイトリスト（AdBlockの対象外のエンドポイント）に追加してあげましょう！

拡張機能の管理画面 > 詳細 > 拡張機能のオプション > 信頼するサイト

に以下のような形でGTMのURLを追加して、✅変更を適用を押せばOKです！

終わりに

Next.jsのパッケージを使ってGTMを導入していたのもあって、原因特定に時間がかかりました💦
調べてもあまり出てこなかったので、皆さん簡単に突破しているのでしょうか...？

参考資料