cordova 应用程序的 facebook 登录

facebook login for cordova applications

我正在尝试将 facebook 登录与 cordova 应用程序集成。我收到以下错误。我用了 https://github.com/Wizcorp/phonegap-facebook-plugin.

我居然关注了这个link 解决这个问题没有帮助。

错误:

  1. cordova oauth 拒绝执行内联脚本,因为它违反了以下内容安全策略指令:default-src self data: gap: https://ssl.gstatic.com unsafe-eval。需要不安全内联关键字、散列 (sha256-HNED5JYugsSN2fW8J37cauBfrz4h1d04l7WiLk8vriA=) 或随机数 (nonce-...) 才能启用内联执行。另请注意,script-src 未明确设置,因此 default-src 用作备用`

  2. 未捕获类型错误:无法读取 属性 'querySelector' of null

这是代码

Index.js

var app = {
initialize: function() {
    this.bindEvents();
},

bindEvents: function() {
    document.addEventListener('deviceready', this.onDeviceReady, false);
},

onDeviceReady: function() {
    app.receivedEvent('deviceready');
},
receivedEvent: function(id) {
    var parentElement = document.getElementById(id);
    var listeningElement = parentElement.querySelector('.listening');
    var receivedElement = parentElement.querySelector('.received');
    listeningElement.setAttribute('style', 'display:none;');
    receivedElement.setAttribute('style', 'display:block;');
    if (window.cordova.platformId == "browser") {
        facebookConnectPlugin.browserInit("xxxxxxxxxxxxxxxxx");
      }
    console.log('Received Event: ' + id);
}
};

还有其他人遇到同样的问题吗?有人有示例工作项目吗?

您需要在 index.html 中设置 Content-Security-Policy <meta> 标签。

参见cordova-plugin-whitelist docs

<!-- Good default declaration:
    * gap: is required only on iOS (when using UIWebView) and is needed for JS->native communication
    * https://ssl.gstatic.com is required only on Android and is needed for TalkBack to function properly
    * Disables use of eval() and inline scripts in order to mitigate risk of XSS vulnerabilities. To change this:
        * Enable inline JS: add 'unsafe-inline' to default-src
        * Enable eval(): add 'unsafe-eval' to default-src
-->
<meta http-equiv="Content-Security-Policy" content="default-src 'self' data: gap: https://ssl.gstatic.com; style-src 'self' 'unsafe-inline'; media-src *">

<!-- Allow requests to foo.com -->
<meta http-equiv="Content-Security-Policy" content="default-src 'self' foo.com">

<!-- Enable all requests, inline styles, and eval() -->
<meta http-equiv="Content-Security-Policy" content="default-src *; style-src 'self' 'unsafe-inline'; script-src 'self' 'unsafe-inline' 'unsafe-eval'">

<!-- Allow XHRs via https only -->
<meta http-equiv="Content-Security-Policy" content="default-src 'self' https:">

<!-- Allow iframe to https://cordova.apache.org/ -->
<meta http-equiv="Content-Security-Policy" content="default-src 'self'; frame-src 'self' https://cordova.apache.org">