「ヒートマップツールを契約したのに、データが1件も溜まらない」「編集画面を開いたら自社サイトが真っ白のまま」——その原因の多くは、ツール側ではなくサイトが返しているレスポンスヘッダーにあります。
CVR改善ツールは、①タグを設置してデータを集める部分と、②サイトを読み込んで画面上で編集する部分の2つでできています。この2つは止まる原因が別で、片方が動かなくてももう片方は動きます。ここを切り分けずに「使えないツールだった」と判断してしまうケースが少なくありません。
本記事では、X-Frame-Options と Content-Security-Policy（CSP）という2つのヘッダーに絞って、確認方法と依頼の仕方を解説します。
記事のポイント
- 計測が止まる原因と、編集画面が止まる原因は別
X-Frame-Options: DENYでも計測は動く- 自分で確認する3つの方法（コマンド・ブラウザ・オンラインツール）
- 変更できないときに、制作会社やカート会社へ送る依頼文面
- ECカートの決済画面だけは、ヘッダーを変えても対象外になる
目次
- CVR改善ツールは「計測」と「編集」の2階建て
- 症状から原因を切り分ける
- X-Frame-Options とは（編集画面が開かない原因）
- CSP とは（計測データが溜まらない原因）
- 自分のサイトのヘッダーを確認する3つの方法
- 変更を依頼するときの文面
- 決済画面だけはヘッダーを変えても対象外
- Dejamで改善を進める
- よくある質問
- まとめ
CVR改善ツールは「計測」と「編集」の2階建て
ヒートマップやABテストのツールは、機能としてはひとかたまりに見えますが、技術的にはまったく別の仕組みが2つ動いています。
| 階 | 何をしているか | 代表的な機能 |
|---|---|---|
| ① 計測 | サイトに設置したJavaScriptが、閲覧者の行動を集めてツール側へ送る | ヒートマップ、熟読・離脱の計測、アクセス解析 |
| ② 編集 | ツールの管理画面が、あなたのサイトをiframeで読み込んで画面上で編集させる | ABテストのビジュアルエディタ、LPO、ポップアップ作成 |
重要なのは、この2つが別々の条件で止まるという点です。
- ①が止まる → CSP が原因のことが多い
- ②が止まる → X-Frame-Options が原因のことが多い
つまり「編集画面が開かない」からといって、計測まで諦める必要はありません。逆に「データは取れているから設定は問題ない」と考えていると、編集機能が使えないまま契約を続けることになります。
症状から原因を切り分ける
まず、自分がどちらの問題に当たっているかを判定します。
| 症状 | 疑うべきヘッダー | 計測は動くか |
|---|---|---|
| 管理画面の編集モードで自社サイトが真っ白／読み込み中のまま | X-Frame-Options | 動く |
編集画面のコンソールに Refused to display ... in a frame | X-Frame-Options / CSP の frame-ancestors | 動く |
| タグを入れたのにヒートマップのデータが0件のまま | CSP（script-src / connect-src） | 止まっている |
コンソールに Refused to load the script / Refused to connect | CSP | 止まっている |
| カート・決済画面だけデータが取れない | ヘッダーではなくカート側の仕様 | その画面のみ止まる |
エラーメッセージはブラウザの開発者ツール（F12）のConsoleタブに出ます。 「動かない」とだけツールのサポートへ連絡する前に、ここを見ておくと切り分けが一度で終わります。
X-Frame-Options とは（編集画面が開かない原因）
X-Frame-Options は、自分のページを他サイトのiframe（枠）の中に表示させてよいかをブラウザに指示するレスポンスヘッダーです。クリックジャッキングという攻撃を防ぐために使われます。
値は主に2つです。
| 値 | 意味 |
|---|---|
DENY | どのサイトからもiframeで表示させない |
SAMEORIGIN | 同じドメインのページからのみ許可する |
CVR改善ツールのビジュアルエディタは、あなたのサイトをiframeで読み込んで、その上に編集UIを重ねる構造です。そのため DENY や SAMEORIGIN が返っていると、ツールの管理画面（別ドメイン）からは読み込めず、編集画面が真っ白になります。
計測は止まらない
ここが誤解されやすい点です。X-Frame-Options: DENY が設定されていても、タグによる計測は問題なく動きます。 このヘッダーが制御しているのは「iframeで表示してよいか」だけで、ページ内で動くJavaScriptには関係がないためです。
したがって取れる選択肢は2つあります。
- ヘッダーはそのままにして、まず計測だけ始める（ヒートマップで現状把握）
- ヘッダーを変更して、編集機能まで使う（ABテスト・LPO）
いきなり2を目指す必要はありません。 1で改善すべき箇所を特定してから2に進むほうが、社内の合意も取りやすくなります。
新しい書き方は frame-ancestors
X-Frame-Options は歴史のあるヘッダーで、現在は CSP の frame-ancestors ディレクティブが後継とされています。両方が設定されている場合、対応ブラウザでは frame-ancestors が優先されます。
全面的に解除するのではなく、使うツールのドメインだけを許可する書き方が安全です。
Content-Security-Policy: frame-ancestors 'self' https://example-tool.com;これなら、他の第三者サイトからのiframe表示は引き続きブロックされたまま、ツールの編集画面だけが動くようになります。セキュリティ担当者に説明するときも、この形なら承認が得やすいはずです。
CSP とは（計測データが溜まらない原因）
Content-Security-Policy（CSP）は、そのページがどこから何を読み込んでよいかを制限するヘッダーです。XSS（クロスサイトスクリプティング）対策として設定されます。
計測タグに関係するのは主に次の2つです。
| ディレクティブ | 制限する対象 | 引っかかると |
|---|---|---|
script-src | JavaScriptの読み込み元 | タグ自体が読み込まれない |
connect-src | 通信（fetch / XHR / ビーコン）の送信先 | タグは動くがデータが送れない |
やっかいなのは connect-src です。 タグは読み込まれてエラーも目立たないのに、計測データだけが届きません。「設置したのに0件」の典型がこれです。
対応としては、CSPにツールの配信ドメインと送信先ドメインを追加します。ドメインはツール側のマニュアルに記載されているので、そのまま情シスや制作会社へ渡してください。
Content-Security-Policy: script-src 'self' https://cdn.example-tool.com; connect-src 'self' https://api.example-tool.com;なお、CSPをそもそも設定していないサイトでは、この問題は起きません。 制限がないためタグはそのまま動きます。CSPは「入れているサイトだけが引っかかる」種類の設定です。
自分のサイトのヘッダーを確認する3つの方法
契約前に確認しておけば、導入初日につまずくことがなくなります。
方法1: コマンドで確認する（最短）
ターミナルで次を実行します。
curl -sI https://example.com | grep -i "x-frame-options\|content-security-policy"何も表示されなければ、どちらのヘッダーも設定されていない＝ツール側の制限は受けません。
方法2: ブラウザの開発者ツール（非エンジニア向け）
- 対象ページを開いて F12（Macは
Cmd + Option + I） - Network タブを開いてページを再読み込み
- 一覧の一番上の項目（ページ本体のHTML）をクリック
- Headers > Response Headers の中に
x-frame-optionsやcontent-security-policyがあるか見る
コマンドが使えなくても、この方法なら誰でも確認できます。
方法3: エラーメッセージから逆引きする
すでにツールを契約している場合は、編集画面を開いた状態で開発者ツールの Console タブを見ます。Refused to display なら X-Frame-Options、Refused to load / Refused to connect ならCSPです。
変更を依頼するときの文面
ヘッダーは、サイトの構成によって変更できる人が違います。
| サイトの作り | 変更する場所 | 依頼先 |
|---|---|---|
| 自社サーバー・自社構築 | Webサーバー（Nginx / Apache）またはCDNの設定 | 情シス・開発ベンダー |
| SaaS型のECカート | 管理画面に設定項目がないことが多い | カートのサポート窓口 |
| WordPress | プラグインまたはテーマの設定 | 制作会社 |
依頼するときは、目的と、必要最小限の変更であることを書くと話が早く進みます。以下をそのまま使えます。
お世話になっております。 CVR改善ツール（ヒートマップ・ABテスト）を導入するにあたり、下記2点のご対応が可能かご確認をお願いいたします。
1. iframe表示の許可 現在
X-Frame-Options: DENYが設定されているため、ツールの編集画面から自社サイトを読み込めません。 全面的な解除ではなく、CSPのframe-ancestorsでツールのドメインのみを許可する形での設定をご検討ください。 例:Content-Security-Policy: frame-ancestors 'self' https://（ツールのドメイン）;2. CSPへのドメイン追加 計測タグの読み込みと送信のため、
script-srcとconnect-srcに下記ドメインの追加をお願いします。 （ツールのマニュアルに記載されたドメインを列挙）なお、1が対応不可の場合でも計測機能は動作するため、まず2のみのご対応でも問題ありません。
最後の1文が重要です。 「全部できないなら意味がない」と受け取られると差し戻しになりますが、段階的に進められるとわかれば通りやすくなります。
決済画面だけはヘッダーを変えても対象外
ECサイトの場合、もう1つ知っておくべき制約があります。カート・決済画面では、ヘッダーを変更しても計測タグが動かないことがあります。
これはセキュリティ上の仕様で、ツール側の問題ではありません。とくにShopifyでは、チェックアウトページへの外部スクリプト設置が段階的に廃止され、Plusストアは2025年8月28日、それ以外のストアは2026年8月26日をもって利用できなくなりました（Shopify公式）。
したがって、**CVR改善ツールで見られる範囲は「商品ページ・LP・カート投入前まで」**と考えてください。
これは実務上、大きな問題にはなりません。カゴ落ちの原因の多くは、決済画面そのものより手前——商品ページで不安が解消されない、送料が最後まで見えない、フォームの入力項目が多い——にあるためです。手前の導線を直すことのほうが、改善余地は大きく残っています。
Dejamでヘッダー確認後の改善を進める
設定の確認が済んだら、実際の改善に進みます。Dejamでは以下の機能が使えます。
ヒートマップ
クリック・クリックイベント・熟読・滞在・離脱の5種類を計測できます。タグを設置するだけで動くため、X-Frame-Options の変更を待たずに現状把握を始められます。熟読は4秒以上の滞留、離脱・滞在は5%刻みの20バンドで計測するため、「どこで読むのをやめたか」が具体的に特定できます。データ保存期間は無制限です。
ABテスト
デザイン変更テスト・リダイレクトテスト・ポップアップテストの3種類に対応。ビジュアルエディタを使う機能のため、X-Frame-Options の解除が必要になります。AIが自然言語からテストコードを自動生成します。
EFO・フォーム最適化
決済画面が対象外になるECサイトでも、問い合わせ・会員登録・定期購入の申込フォームは改善対象にできます。入力途中の離脱がどの項目で起きているかを特定できます。
よくある質問
Q. X-Frame-Options を解除するとセキュリティ上のリスクはありますか？
A. 全面的に解除すれば、クリックジャッキングのリスクは上がります。ただし CSP の frame-ancestors でツールのドメインだけを許可すれば、他サイトからのiframe表示は引き続きブロックされます。全面解除ではなくホワイトリスト方式で依頼してください。
Q. ヘッダーを変更できないカートを使っています。何もできませんか？
A. 計測機能は使えます。 X-Frame-Options が制限しているのは編集画面だけなので、ヒートマップで現状を把握し、改善はカート側のテンプレート編集で行う、という進め方ができます。
Q. タグは入れたのにデータが0件です。どこを見ればいいですか？
A. 開発者ツールの Console タブを確認してください。Refused to load the script ならCSPの script-src、Refused to connect なら connect-src が原因です。どちらも表示されない場合は、タグの設置場所（head内に入っているか）を確認します。
Q. CSPを設定していないサイトでも確認は必要ですか？
A. 設定していなければ、CSPが原因で止まることはありません。ただし X-Frame-Options はCSPとは別のヘッダーなので、そちらは別途確認が必要です。
まとめ
CVR改善ツールが動かないとき、原因はツールではなくサイトのレスポンスヘッダーにあることが多くあります。
- 計測（ヒートマップ）と編集（ABテスト）は止まる原因が別
X-Frame-Options: DENYでも計測は動く。まず計測から始められる- データが0件なら CSP の
script-src/connect-srcを疑う - 確認は
curl -sIかブラウザの Network タブで完了する - 依頼するときは全面解除ではなくドメイン単位の許可でお願いする
- ECの決済画面は、ヘッダーを変えても対象外になることがある
契約前に3分確認しておくだけで、導入初日のつまずきはほぼ防げます。
CVR改善ならDejam！導入前の確認から改善の実行まで一気通貫で
Dejamは、LP制作・ヒートマップ分析・ABテスト・AI自動解析をオールインワンで提供するCVR改善特化ツールです。「ツールを入れたのに動かない」という段階から、本格的なPDCAを回して成果を最大化するまでを総合支援します。
Dejamが選ばれる理由
- 国内唯一のワンプロダクト: LP制作・ヒートマップ分析・ABテストをすべて単一ツールで完結
- 月額3万円〜利用可能: オプティマイズプラン月額3万円〜 / CMSプラン月額5万円〜 / オールインワン月額12万円〜
- ユーザー課金なし: 何名で使っても追加費用は発生しない
- ISMS認証取得: ISO/IEC 27001:2022 & JIS Q 27001:2023認証取得済み
- 毎週アップデート: 市場トレンドとユーザーリクエストに応じて機能を毎週拡充
Dejamの主要機能
- LP/記事LP制作: ノーコード・コードの切り替えに対応。AIで生成したコードを直接取り込み可能
- ヒートマップ: 5種類（クリック/クリックイベント/熟読/滞在/離脱）。データ保存期間無制限
- ABテスト: デザイン変更テスト・リダイレクトテスト・ポップアップテストの3種類
- 自動解析: どのコンテンツがCVRに貢献しているかAIが自動解析
- 独自ドメイン300件まで無料: LP専用ドメインを大量運用しても追加費用なし
タグ1行の設置から始められるため、ヘッダーの変更手続きと並行して計測をスタートできます。
