Facebook Messenger复选框插件未呈现答案

【问题标题】：Facebook messenger checkbox plugin not renderingFacebook Messenger复选框插件未呈现
【发布时间】：2017-06-13 11:41:01
【问题描述】：

我正在尝试在我的 aspx 页面中实现新的 Facebook Checkbox 插件，但我无法在屏幕上显示它。此错误发生在客户端，但 Frame 已隐藏。

错误：

拒绝在框架中显示“https://www.facebook.com/v2.9/plugins/messenger_checkbox.php?allow_login=true&app_id=*******....”，因为祖先违反了以下内容安全策略指令：“frame-ancestors https://www.facebook.com”

到目前为止我做了什么：

 <script>
        window.fbAsyncInit = function () {
            FB.init({
                appId: '---MSGAPPID---',
                xfbml: true,
                version: 'v2.9'
            });

        };

        (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 = "//connect.facebook.net/en_US/sdk.js";
            fjs.parentNode.insertBefore(js, fjs);
        }(document, 'script', 'facebook-jssdk')
        );
    </script>

 <div class="fb-messenger-checkbox"
        origin="---Orgin url ------"
        page_id="--Pagelivefacebookid--"
        messenger_app_id="--Mssgappid--"
        user_ref="randomnumber"
        prechecked="true"
        allow_login="true"
        size="large">
    </div>

此外，我还将该域列入白名单，但遗憾的是无法在我的页面上看到它。建议摆脱此错误的最佳答案

https://developers.facebook.com/docs/messenger-platform/messenger-profile/domain-whitelisting

【问题讨论】：

我也有 CSP 问题。但这是因为我没有将我的域列入白名单。

标签： javascript facebook facebook-graph-api checkbox

【解决方案1】：

我为使其正常工作而修复的错误：

确保在“Messenger 设置”下的“应用设置”下订阅了页面
确保“origin”是您尝试呈现此内容的页面的 URL，而不是粉丝页面的 URL。我觉得有点笨，但我确实犯了这个错误。
将您的域列入白名单，以确保您没有覆盖它。并获取当前白名单域的列表，以确保其拼写正确并且没有缺少“www”。

【讨论】：

它对我有用，我的错误是缺少“www”的第三点。谢谢！

【解决方案2】：

您必须在 Messenger 平台的 fb 页面设置中提供白名单域

【讨论】：