エディターが読み込まれない
Last updated
Last updated
エディターが適切に読み込まれない、開くにはどうしたらいいか
エディターが読み込まれない場合は、下記いずれかの理由が原因として考えられます。
エディターが読み込まれない場合は、。この拡張機能は、エディターを適用する前にページを強制的に完全にロードします。これにより、エディターのロード時に発生する一般的な問題の多くが解決されます。アドオンは Chrome ウェブストアで入手できます。ダウンロードできます。
Chromeアドオンを使用するには、次の手順に従います。
エディターでロードしたいURLに移動します。
ABTasty Chrome アドオンを開きます
キャンペーンを選択してください
「Reset JS behaviors（JS動作をリセット）」オプションがチェックされていることを確認します
エディターをクリックします
ABTastyタグにはサードパーティCookieは必要ありませんが、エディターを読み込むとサードパーティ Cookieが必要になります。読み込みに問題がある場合は、サードパーティCookieがブロックされていることが原因である可能性があります。
ChromeのURL バーにアドレス chrome://settings/cookies を貼り付け、ブラウザが Cookie を受け入れるか、少なくともHTTPS://[*.]app2.abtasty.com:443が許可されていることを確認してください。
ABTastyを設定するときは、タグが設置されている必要があります。
タグが存在しない場合は、タグ設置後に再度エディターを開いてみてください。
いくつかのChrome拡張機能により、エディターの読み込みが妨げられる場合があります。Ghostery 、Insider 、VPNまたはプロキシ、または広告ブロッカーの使用は避けてください。
ChromeのURLバーにアドレスchrome://extensions/を貼り付け、上記のChrome拡張機能を無効にするか削除します。
登録や注文などのコンバージョンステップ（ファネル）ページ、商品追加されたカートページ、またはパーソナライズされたダッシュボードを読み込むには、ソースコードの適用が必要です。
また、この方法は認証 （クライアント アカウントなど） やセッション情報を必要とするページ (カート ページに表示される商品など) によって引き起こされるエディターの読み込みの問題を修正する方法でもあります。
正しいソース コードを適用するには 2 つの方法があります。
<html> タグ (ソース コードの 1 行目) のCopy externalHTMLコマンドを使用して、エディターをロードしようとしているWebページのソース コードをコピーします。
※OuterHTML：要素とそのすべての子要素を含むHTMLコード全体を指します。
このソース コードをABTasty のMain information（メイン情報）ステップの専用入力に貼り付けます。
エディターをロードしようとしたときにコンソールにCSPエラーが表示された場合は、サーバー構成がこれらの問題の原因となっています。サーバーのセキュリティ設定が高すぎる可能性があります。
デフォルトでは、多くのクライアントは、Webサイト上のすべてをブロックするコンテンツセキュリティポリシーを使用しています。これは、すべての外部リクエストをサーバー構成のホワイトリストに登録する必要があることを意味します。
次の種類のエラーが表示される場合は、CSPエラーが原因です。
システム管理者または開発者に次のドメインを許可リストに登録するよう依頼してください。
Content-Security-Policy=
default-src 'none'
frame-src 'self'
script-src 'self' 'unsafe-eval' blob: *.abtasty.com *.googleapis.com
connect-src 'self' *.abtasty.com
img-src 'self' blob: *.abtasty.com *.amazonaws.com
style-src 'self' unsafe-inline: *.abtasty.com *.gstatic.com *.googleapis.com
font-src 'self' blob: data: *.abtasty.com *.gstatic.com *.googleapis.com
Default-srcは、オーバーライドする属性以外のすべての属性について、厳格なセキュリティをデフォルトとして保持することを可能にします。
Frame-srcは、ABTastyがあなたのウェブアプリをエディタでiframe化することを許可します。
Script-srcは、エディターでiframe化した後、ABTastyがWebアプリに<script>要素を挿入できます。
Connect-srcは、ABTastyがXMLHttpRequestもしくはWebsocket fetchを介してAPIと接続することを可能にします - （XMLHttpRequestを介して）Symfony REST APIと通信するために必要です。
Img-srcは、ABTastyがドメインもしくは AWS CDN からホストされた画像 URL を呼び出すことを可能にします。
Style-srcは、ABTastyがインラインスタイルもしくは<script>要素を挿入することを許可します。
font-srcは、フォントが当社ドメインからのものであっても、Google Fonts APIからのものであっても、フォントを挿入できます。
エディターをブロックする他のエラーがコンソールで見つかる場合があります。例えば、次のようなX-Frame Optionsに関連するエラーに気付いた場合:
問題が解決できない場合は、お手数ですが担当までご連絡ください。
タグがインストールされているかどうかを確認するには、ブラウザ コンソールを開き、[要素（Elements）]タブに移動してtry.abtasty.comを検索します。詳細については、次の記事を参照してください:
[コンソール（Console）]にwindow.ABTastyを打ち込み応答内容で確認することもできます。詳細はをご確認ください。
ソース コードを適用する方法の詳細については、。
アドオンを使用できます。この拡張機能によりCSPエラーがブロックされ、エディターを再度ロードできるようになります。
バックエンド開発者に、それに応じてサーバー構成を変更するよう依頼してください。また、拡張機能を一時的に使用して、このタイプのエラーを回避することもできます。
※本ページはを翻訳・加筆修正しています。
