Phonegap - 使用嵌入式 Web 应用程序推送通知（InAppBrowser 窗口）答案

【问题标题】：Phonegap - Push notification with embedded web app (InAppBrowser window)Phonegap - 使用嵌入式 Web 应用程序推送通知（InAppBrowser 窗口）
【发布时间】：2017-10-19 14:41:45
【问题描述】：

我将一个现有的 Web 应用程序 (Rails) 包装为一个 Web 视图中的 cordova app。我在 onDeviceReady 上打开主页。然后注册推送通知。

var ref = cordova.InAppBrowser.open(window.app_url, 
                            '_blank', 'location=no,clearsessioncache=no');
setupPushNotifications(window.app_url, ref);

我正在使用phonegap-plugin-push 进行推送通知。

push.on('registration', function(data) {
    saveRegistrationId(app_url, data);
});

我想将通知 registrationId 关联到 Web 应用中登录用户的上下文中。

在使用 phonegap 开发者应用程序时，这似乎很顺利。但是当我在我的设备上安装android-debug.apk 时，这不会调用rails 应用程序来保存registrationId。

config.xml的内容

<access origin="*" />
<allow-navigation href="http://192.168.1.3:8000" />
<allow-intent href="http://*/*" />
<allow-intent href="https://*/*" />
<allow-intent href="tel:*" />
<allow-intent href="sms:*" />
<allow-intent href="mailto:*" />
<allow-intent href="geo:*" />

我也试过_self，在同一个网页视图中打开。它不运行 setupPushNotifications。

注册令牌的代码

function saveRegistrationId(app_url, data) {
    // this is our payload for the POST request to server
    // data = {registrationId: 'XXXXX', registrationType: 'FCM'}
    const device_data = Object.assign(data, this.device);

    const url = app_url + "/mobile_devices";

    navigator.notification.alert(data.registrationId);

    navigator.notification.alert(url);

    var httpRequest = new XMLHttpRequest();

    httpRequest.open('POST', url);

    httpRequest.onreadystatechange = function() {
        navigator.notification.alert('readyState : ' + httpRequest.readyState);
        navigator.notification.alert('status : ' + httpRequest.status);
        if (httpRequest.readyState>3 && httpRequest.status==200) { console.log(httpRequest.responseText); }
    };

    httpRequest.setRequestHeader('X-Requested-With', 'XMLHttpRequest');
    httpRequest.setRequestHeader('Content-Type', 'application/json');
    httpRequest.send(JSON.stringify({device: device_data}));
}

【问题讨论】：

你配置你的cordova-plugin-whitelist了吗？在实际设备上运行时，还可以尝试使用 chrome 开发者工具检查应用程序是否存在 JS/网络错误。
我已经用 config.xml 文件中的设置更新了问题。
您是否在 Javascript 控制台中看到任何 JS 错误/网络错误？
我看到的问题是我无法发出 XHR 发布请求。用代码更新问题。请求的 readyState 和 status 分别为 4 & 0。
谢谢@wildabeast。我设法找出问题所在。

标签： android session push-notification phonegap inappbrowser

【解决方案1】：

问题在于 index.html 中的 content-security-policy。

<meta http-equiv="Content-Security-Policy" content="default-src 'self' data: gap: https://ssl.gstatic.com 'unsafe-eval'; style-src 'self' 'unsafe-inline'; media-src *; img-src 'self' data: content:; connect-src 'self' http://192.168.1.3:8000;">

关键是最后一节

connect-src 'self' http://192.168.1.3:8000;

这允许向网络应用发出 ajax 请求。

【讨论】：