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