Chrome 拡張機能内から、Facebook ログイン サンプル コードを使用してタブを開こうとしています。これまでのところ、この例ではまっすぐなチュートリアル コードを使用しています。
タブは適切に開きますが、クロスサイト セキュリティ ポリシーの問題により、Facebook の JavaScript の読み込みに失敗し、インライン スクリプト エラーも表示されます。メッセージ？）
この種のことを適切に行う方法をどこで学べますか?
エラー:
Refused to load script from 'https://connect.facebook.net/en_US/all.js' because of Content-Security-Policy.
Refused to execute inline script because of Content-Security-Policy.
background.js:
chrome.tabs.create({url: 'popup.html'})
popup.html: //Facebook API ドキュメントのサンプル ログイン コード
<head>
<title>Facebook Client-side Authentication Example</title>
<script type="text/javascript" src="popup.js"></script>
</head>
<body>
<div id="fb-root"></div>
<script>
</script>
<h1>Facebook Client-side Authentication Example</h1>
<div id="auth-status">
<div id="auth-loggedout">
<a href="#" id="auth-loginlink">Login</a>
</div>
<div id="auth-loggedin" style="display:none">
Hi, <span id="auth-displayname"></span>
(<a href="#" id="auth-logoutlink">logout</a>)
</div>
</div>
</body>
</html>
popup.js://facebook dev のサンプル コード
// Load the SDK Asynchronously
(function (d) {
var js, id = 'facebook-jssdk',
ref = d.getElementsByTagName('script')[0];
if (d.getElementById(id)) {
return;
}
js = d.createElement('script');
js.id = id;
js.async = true;
js.src = "https://connect.facebook.net/en_US/all.js";
ref.parentNode.insertBefore(js, ref);
}(document));
// Init the SDK upon load
window.fbAsyncInit = function () {
FB.init({
appId: '', // App ID
channelUrl: '//' + window.location.hostname + '/channel', // Path to your Channel File
status: true, // check login status
cookie: true, // enable cookies to allow the server to access the session
xfbml: true // parse XFBML
});
// listen for and handle auth.statusChange events
FB.Event.subscribe('auth.statusChange', function (response) {
if (response.authResponse) {
// user has auth'd your app and is logged into Facebook
FB.api('/me', function (me) {
if (me.name) {
document.getElementById('auth-displayname').innerHTML = me.name;
}
})
document.getElementById('auth-loggedout').style.display = 'none';
document.getElementById('auth-loggedin').style.display = 'block';
} else {
// user has not auth'd your app, or is not logged into Facebook
document.getElementById('auth-loggedout').style.display = 'block';
document.getElementById('auth-loggedin').style.display = 'none';
}
});
// respond to clicks on the login and logout links
document.getElementById('auth-loginlink').addEventListener('click', function () {
FB.login();
});
document.getElementById('auth-logoutlink').addEventListener('click', function () {
FB.logout();
});
}