web-dev-qa-db-ja.com

ログインしていないときにFacebook Messengerカスタマーチャットプラグインが表示されない

私たちのウェブサイトの1つにFacebookカスタマープラグインを統合しました。開発者向けドキュメントの指示に従いました。アクティブなFacebookセッションがある場合は正常に機能しています。ただし、アクティブなfbセッションがない場合、プラグインはまったく表示されません。私は何かを見逃しているかもしれませんが、それが何であるかについての手がかりはありません。

10
roundhousekick

私にとっての解決策は、xfbml.customerchat.jsファイルの後に#xfbml = 1&version = v2.12&autoLogAppEvents = 1を追加することでした:

js.src = 'https://connect.facebook.net/en_US/sdk/xfbml.customerchat.js#xfbml=1&version=v2.12&autoLogAppEvents=1';
22
losted

ページ->設定->メッセンジャープラットフォーム->カスタマーチャットプラグインの手順は、今では2018年5月です。

プラスチェック国の制限

1
vanduc1102

このコードは、ページの設定で提供される顧客チャットコードにのみ追加しました。

    window.fbAsyncInit = function() {
    FB.init({
      appId            : '1175565702494581', // Trokis Philippines App ID; you may use your App ID but this App ID might work on you too.
      autoLogAppEvents : true,
      xfbml            : true,
      version          : 'v2.11'
    });
  };

元のコード:

    <script>
(function(d, s, id){
     var js, fjs = d.getElementsByTagName(s)[0];
     if (d.getElementById(id)) {return;}
     js = d.createElement(s); js.id = id;
     js.src = "https://connect.facebook.net/en_US/sdk/xfbml.customerchat.js";
     fjs.parentNode.insertBefore(js, fjs);
   }(document, 'script', 'facebook-jssdk'));
</script>

<!-- Your customer chat code -->
<div class="fb-customerchat"
  attribution=setup_tool
  page_id="{your-page-id}"
  theme_color="#BE59B9">
</div>

最終コード:

<script>
  window.fbAsyncInit = function() {
    FB.init({
      appId            : '1175565702494581',
      autoLogAppEvents : true,
      xfbml            : true,
      version          : 'v2.11'
    });
  };
(function(d, s, id){
     var js, fjs = d.getElementsByTagName(s)[0];
     if (d.getElementById(id)) {return;}
     js = d.createElement(s); js.id = id;
     js.src = "https://connect.facebook.net/en_US/sdk/xfbml.customerchat.js";
     fjs.parentNode.insertBefore(js, fjs);
   }(document, 'script', 'facebook-jssdk'));
</script>

<!-- Your customer chat code -->
<div class="fb-customerchat"
  attribution=setup_tool
  page_id="{your-page-id}"
  theme_color="#BE59B9">
</div>
1
Chester Alan

まあ、恥ずかしいことに、私が正しく動作しなかったのは「ホワイトリストドメイン」でした。
ドメインを挿入したら、[保存]をクリックしてください...

enter image description here

1
chenop

ソリューションを見つけました。誰かがこれに遭遇した場合は、FacebookページのCountry Restrictions(Settings-> General-> Country Restrictions)を確認してください。アクティブなセッションがない場合でもプラグインがレンダリングされるためには、どこでも利用可能でなければなりません

0
roundhousekick

このスクリプトを使用して問題を解決しました:

<div class="fb-customerchat"
 page_id="<ENTER-YOUR-FACEBOOK-ID-HERE>"
 minimized="true">
</div>
<script>
  window.fbAsyncInit = function() {
    FB.init({
      appId            : 'facebook-developer-app-id',
      autoLogAppEvents : true,
      xfbml            : true,
      version          : 'v2.11'
    });
  };
(function(d, s, id){
     var js, fjs = d.getElementsByTagName(s)[0];
     if (d.getElementById(id)) {return;}
     js = d.createElement(s); js.id = id;
     js.src = "https://connect.facebook.net/en_US/sdk/xfbml.customerchat.js";
     fjs.parentNode.insertBefore(js, fjs);
   }(document, 'script', 'facebook-jssdk'));
</script>

<!-- Your customer chat code -->
<div class="fb-customerchat"
  attribution=setup_tool
  page_id="your-page-id"
  theme_color="#BE59B9">
</div>
0

2019年1月8日以降、Facebookはユーザーが次のURLを使用してカスタマーチャットプラグインをリクエストすることを停止しました: https://connect.facebook.net/en_US/sdk.js

https://connect.facebook.net/en_US/sdk/xfbml.customerchat.jsの代わりにjs.src引数としてhttps://connect.facebook.net/en_US/sdk/sdk.jsを使用する必要があります。後者を使用すると、カスタマーチャットプラグインはすぐにWebサイトにロードされなくなります。

Facebook Javascript SDKが既にWebサイトに含まれている場合は、js.srcを https://connect.facebook.net/en_US/sdk/xfbmlに設定するだけです。以下のコードスニペットに示すように、.customerchat.js

(function(d, s, id) {
  var js, fjs = d.getElementsByTagName(s)[0];
  if (d.getElementById(id)) return;
  js = d.createElement(s); js.id = id;
  js.src = "https://connect.facebook.net/en_US/sdk/xfbml.customerchat.js";
  fjs.parentNode.insertBefore(js, fjs);
}(document, 'script', 'facebook-jssdk'));

ソース: https://www.chatbotino.com/2019/02/06/facebook-customer-chat-plugin-not-working-try-this/

0
Jide

最初は、Facebook Customer Chat Pluginウィザードで生成されたコードを試してみました-運はありません。有効にするには、有効な開発者を提供するFB.initセクションを追加する必要がありましたappId

  <script>
    window.fbAsyncInit = function() {
        FB.init({
            appId            : 'YOUR-APP-ID-HERE',
            autoLogAppEvents : true,
            xfbml            : true,
            version          : 'v2.11'
        });
    };
    (function(d, s, id) {
    var js, fjs = d.getElementsByTagName(s)[0];
    if (d.getElementById(id)) return;
    js = d.createElement(s); js.id = id;
    js.src = 'https://connect.facebook.net/pl_PL/sdk/xfbml.customerchat.js';
    fjs.parentNode.insertBefore(js, fjs);
  }(document, 'script', 'facebook-jssdk'));</script>

  <!-- Your customer chat code -->
  <div class="fb-customerchat"
    attribution=setup_tool
    page_id="YOUR-PAGE-ID-HERE"
    theme_color="#ed1d24"
    logged_in_greeting="Hello, how can we help you?">
  </div>

Facebookカスタマーチャットプラグインはこちら で詳細を確認できます。

0
Picard

私にとって問題は、非wwwドメインをホワイトリストに登録していたが、wwwでそれを開いたことでした。両方のケースをホワイトリストのケースとして追加する必要があります。

0
Andris