Warning: file_get_contents(/data/phpspider/zhask/data//catemap/9/javascript/435.json): failed to open stream: No such file or directory in /data/phpspider/zhask/libs/function.php on line 167

Warning: Invalid argument supplied for foreach() in /data/phpspider/zhask/libs/tag.function.php on line 1116

Notice: Undefined index: in /data/phpspider/zhask/libs/function.php on line 180

Warning: array_chunk() expects parameter 1 to be array, null given in /data/phpspider/zhask/libs/function.php on line 181
Javascript 就像按钮在Chrome扩展中不起作用一样_Javascript_Facebook_Google Chrome Extension - Fatal编程技术网

Javascript 就像按钮在Chrome扩展中不起作用一样

Javascript 就像按钮在Chrome扩展中不起作用一样,javascript,facebook,google-chrome-extension,Javascript,Facebook,Google Chrome Extension,我在扩展中实现了一个简单的Facebook“Like”按钮。然而,它似乎不起作用 我使用的只是因为我不需要任何额外的脚本 <iframe src="//www.facebook.com/plugins/like.php?href=[dummy_text]&amp;send=false&amp;layout=button_count&amp;width=100&amp;show_faces=false&amp;font&amp;blah..."

我在扩展中实现了一个简单的Facebook“Like”按钮。然而,它似乎不起作用

我使用的只是因为我不需要任何额外的脚本

<iframe src="//www.facebook.com/plugins/like.php?href=[dummy_text]&amp;send=false&amp;layout=button_count&amp;width=100&amp;show_faces=false&amp;font&amp;blah..." scrolling="no" frameborder="0" style="border:none; overflow:hidden; width:100px; height:21px;" allowTransparency="true"></iframe>

首先,按钮确实显示得很好且正确:

但是,单击后,它会以红色显示“错误”:

所以我想可能是因为?;因为如果我把它放在一个普通的网页上,它就会工作。(在我点击like按钮后,它会显示“确认”。)


你知道如何解决这个问题吗?

//www.facebook.com/…
是一个协议相关的URL。当您将这样一个URL嵌入到一个普通的http(s)站点时,URL解析为
http(s):///www.facebook.com/…
。然而,在Chrome扩展中,它解析为
Chrome-extension://www.facebook.com/...

要解决此问题,请在URL前面加上
https:
,即使用
https://www.facebook.com/...

执行此操作后,按钮仍不会显示,因为出现了错误。要获得所需的结果,您必须允许嵌入Facebook,方法是通过以下文件放松CSP:

(您也可以将http站点列入白名单,例如使用
脚本src'self';对象src'self';框架srchttp://www.facebook.com“或

脚本src'self';对象src'self';框架srchttp://www.facebook.com https://www.facebook.com“)

除了Rob W的建议之外-还有几点可以涵盖可能面临相同错误的其他人,但是使用(即,您已登录fb,在生成iframe代码的过程中,您会看到上面的“此脚本使用应用程序的应用程序ID:”以及选择fb应用程序的下拉列表):

头在html中
只要输入你的url,让facebook做建议:)

你的分机有权限访问facebook吗?@MostafaShahverdy因为它位于
iframe
中,我真的不需要添加任何权限,但尽管如此,我还是将facebook包括在权限列表中。对投票人说:在你声称这不起作用之前,请确保重新加载扩展以确保内容安全策略生效。这可以通过在
chrome://extensions/
,或者卸载然后重新安装扩展。
"content_security_policy": "script-src 'self'; object-src 'self'; frame-src https://www.facebook.com",
<head>
    <!-- for Facebook --> 
    <meta property='og:image' content="http://example.com/logo.jpg"/>
    <meta property='og:url' content="http://example.com"/>
    <meta property="og:title" content="Example"/>
    <meta property="og:description" content="Description"/>
    <meta property="fb:admins" content="<admin name>" />
    <meta property="fb:app_id" content="<app id>" /> 
    <meta property="og:type" content="article" /> 
</head>
https://developers.facebook.com/tools/debug