phonegap 构建白名单不起作用

Posted 2023-03-07

【中文标题】phonegap 构建白名单不起作用

【英文标题】：phonegap build whitelisting not working

【发布时间】：2015-12-16 22:05:10

【问题描述】：

使用 phonegap 构建时，白名单似乎不起作用。当我从浏览器运行应用程序时，所有 ajax 调用都成功并且应用程序正常工作。我有以下 config.xml：

<?xml version="1.0" encoding="UTF-8"?>
<widget xmlns="http://www.w3.org/ns/widgets" xmlns:gap="http://phonegap.com/ns/1.0"
id="com.company.Demo" version="1.0.0">
<name>Demo</name>
<description>
    ...
</description>
<author email="myEmailAddress">
    Jeroen Claes
</author>
<content src="index.html" />
<preference name="phonegap-version" value="cli-5.2.0" />
<preference name="orientation"                value="default" />        <!-- all: default means both landscape and portrait are enabled -->
<preference name="target-device"              value="universal" />      <!-- all: possible values handset, tablet, or universal -->
<preference name="fullscreen"                 value="true" />           <!-- all: hides the status bar at the top of the screen -->
<preference name="webviewbounce"              value="true" />           <!-- ios: control whether the screen 'bounces' when scrolled beyond the top -->
<preference name="prerendered-icon"           value="true" />           <!-- ios: if icon is prerendered, iOS will not apply it's gloss to the app's icon on the user's home screen -->
<preference name="stay-in-webview"            value="false" />          <!-- ios: external links should open in the default browser, 'true' would use the webview the app lives in -->
<preference name="ios-statusbarstyle"         value="black-opaque" />   <!-- ios: black-translucent will appear black because the PhoneGap webview doesn't go beneath the status bar -->
<preference name="detect-data-types"          value="true" />           <!-- ios: controls whether data types (such as phone no. and dates) are automatically turned into links by the system -->
<preference name="exit-on-suspend"            value="false" />          <!-- ios: if set to true, app will terminate when home button is pressed -->
<preference name="show-splash-screen-spinner" value="true" />           <!-- ios: if set to false, the spinner won't appear on the splash screen during app loading -->
<preference name="auto-hide-splash-screen"    value="true" />           <!-- ios: if set to false, the splash screen must be hidden using a javascript API -->
<preference name="disable-cursor"             value="false" />          <!-- blackberry: prevents a mouse-icon/cursor from being displayed on the app -->
<preference name="android-installLocation"    value="auto" />           <!-- android: app install location. 'auto' will choose. 'internalOnly' is device memory. 'preferExternal' is SDCard. -->


<!-- Plugins -->

<!-- Core plugins -->
<gap:plugin name="org.apache.cordova.battery-status" />
<gap:plugin name="org.apache.cordova.camera" />
<gap:plugin name="org.apache.cordova.media-capture" />
<gap:plugin name="org.apache.cordova.console" />
<gap:plugin name="org.apache.cordova.contacts" />
<gap:plugin name="org.apache.cordova.device" />
<gap:plugin name="org.apache.cordova.device-motion" />
<gap:plugin name="org.apache.cordova.device-orientation" />
<gap:plugin name="org.apache.cordova.dialogs" />
<gap:plugin name="org.apache.cordova.file" />
<gap:plugin name="org.apache.cordova.file-transfer" />
<gap:plugin name="org.apache.cordova.geolocation" />
<gap:plugin name="org.apache.cordova.globalization" />
<gap:plugin name="org.apache.cordova.inappbrowser" />
<gap:plugin name="org.apache.cordova.media" />
<gap:plugin name="org.apache.cordova.network-information" />
<gap:plugin name="org.apache.cordova.splashscreen" />
<gap:plugin name="org.apache.cordova.vibration" />
<gap:plugin name="cordova-plugin-whitelist" source="npm"/>

<!-- Third party plugins -->
<!-- A list of available plugins are available at https://build.phonegap.com/plugins -->

<!-- Define app icon for each platform. -->
<icon src="icon.png" />
<icon src="res/icon/android/icon-36-ldpi.png"   gap:platform="android"    gap:qualifier="ldpi" />
<icon src="res/icon/android/icon-48-mdpi.png"   gap:platform="android"    gap:qualifier="mdpi" />
<icon src="res/icon/android/icon-72-hdpi.png"   gap:platform="android"    gap:qualifier="hdpi" />
<icon src="res/icon/android/icon-96-xhdpi.png"  gap:platform="android"    gap:qualifier="xhdpi" />
<icon src="res/icon/blackberry/icon-80.png"     gap:platform="blackberry" />
<icon src="res/icon/blackberry/icon-80.png"     gap:platform="blackberry" gap:state="hover"/>
<icon src="res/icon/ios/icon-57.png"            gap:platform="ios"          />
<icon src="res/icon/ios/icon-72.png"            gap:platform="ios"          />
<icon src="res/icon/ios/icon-57-2x.png"         gap:platform="ios"          />
<icon src="res/icon/ios/icon-72-2x.png"         gap:platform="ios"          />
<icon src="res/icon/webos/icon-64.png"          gap:platform="webos" />
<icon src="res/icon/windows-phone/icon-48.png"  gap:platform="winphone" />
<icon src="res/icon/windows-phone/icon-173.png" gap:platform="winphone"   gap:role="background" />

<!-- Define app splash screen for each platform. -->
<gap:splash src="res/screen/android/screen-ldpi-portrait.png"       gap:platform="android" gap:qualifier="port-ldpi" />
<gap:splash src="res/screen/android/screen-mdpi-portrait.png"       gap:platform="android" gap:qualifier="port-mdpi" />
<gap:splash src="res/screen/android/screen-hdpi-portrait.png"       gap:platform="android" gap:qualifier="port-hdpi" />
<gap:splash src="res/screen/android/screen-xhdpi-portrait.png"      gap:platform="android" gap:qualifier="port-xhdpi" />
<gap:splash src="res/screen/blackberry/screen-225.png"              gap:platform="blackberry" />
<gap:splash src="res/screen/ios/screen-iphone-portrait.png"         gap:platform="ios"       />
<gap:splash src="res/screen/ios/screen-iphone-portrait-2x.png"      gap:platform="ios"       />
<gap:splash src="res/screen/ios/screen-iphone-portrait-568h-2x.png" gap:platform="ios"       />
<gap:splash src="res/screen/ios/screen-ipad-portrait.png"           gap:platform="ios"       />
<gap:splash src="res/screen/ios/screen-ipad-landscape.png"          gap:platform="ios"       />
<gap:splash src="res/screen/windows-phone/screen-portrait.jpg"      gap:platform="winphone" />

<access origin="*" />
<allow-intent href="*" />
<allow-navigation href="*" />
<!-- Added the following intents to support the removal of whitelist code from base cordova to a plugin -->
<!-- Whitelist configuration. Refer to https://cordova.apache.org/docs/en/edge/guide_appdev_whitelist_index.md.html -->
<!--     <allow-intent href="http://*/*" /> -->
<!--     <allow-intent href="https://*/*" /> -->
<!--     <allow-intent href="tel:*" /> -->
<!--     <allow-intent href="sms:*" /> -->
<!--     <allow-intent href="mailto:*" /> -->
<!--     <allow-intent href="geo:*" /> -->
<!--     <allow-intent href="*" /> -->
<platform name="android">
    <allow-intent href="market:*" />
</platform>
<platform name="ios">
    <allow-intent href="itms:*" />
    <allow-intent href="itms-apps:*" />
</platform>
<platform name="winphone">
</platform>

</widget>

我还在 index.html 中添加了以下内容：

<meta http-equiv="Content-Security-Policy" content="default-src *; style-src 'self' 'unsafe-inline'; script-src 'self' 'unsafe-inline' 'unsafe-eval'">

在将我的 jquery 帖子发送到服务器之前，我什至使用了以下参数：

$.support.cors = true;
$.mobile.allowCrossDomainPages = true;

每次我发送 ajax 请求时都会收到 403 错误：禁止 这是我发送的 ajax 请求：

var sr = "<?xml version='1.0' encoding='UTF-8'?>";
sr += "<soap:Envelope xmlns:soap=\"http://schemas.xmlsoap.org/soap/envelope/\" >";
    sr += "<soap:Body>";
sr += "<wsse:Username>" + username + "</wsse:Username>";
sr += "<wsse:Password>" + password + "</wsse:Password>";
sr += "<\/soap:Body>";
sr += "<\/soap:Envelope>";

$.ajax(
    headers:   'SOAPAction': "\"Login\""
                ,
    url:"https://host:port/demo/Login",
    type: "POST",
    contentType: "text/xml; charset=utf-8",
    accepts:"application/xml; text/xml; \*/\*",
    dataType: "json",
    crossDomain: true,
    data: sr,
    processData: false,
    success: function(resp)...,
    fail: function(err)...);

【问题讨论】：

你是否在服务器端定义了“Access-Control-Allow-Origin”？

不确定，但消息似乎没有到达服务器。同样，当从浏览器或 SOAPUI 发布相同的消息时，调用也会成功。

您是否从 CDN 或其他外部来源加载任何脚本？

另外，“来自浏览器”不能传达足够的信息。浏览器是否正在查看 ajax 请求所访问的同一域上的页面？如果是这样，那么它不会遇到 CORS 问题，但您的 PhoneGap 应用程序会遇到。请阅读“Access-Control-Allow-Origin”并在服务器端启用它。

我只是用浏览器打开html页面（右键单击，打开方式），而客户端连接到与手机相同的网络。服务器位于单独的网络上，并通过互联网访问。

【参考方案1】：

@Jeroen、CORS 或“Access-Control-Allow-Origin”不是必需的。这是对 Phonegap 的常见误解。 'CORS' 是一个 webbrowser 安全协议。它不是移动应用安全协议。

需要明确的是，用于 Cordova/Phonega 的 webview 库呈现 HTML，但它不是 web 浏览器。 CORS 的 wikipedia explanation 有一半是坏的，但解释有效。 CORS 始终以支持 CORS 的网络浏览器开始。同样，CORS 在 Cordova/Phonegap 上不存在。

此常见问题解答也应该有所帮助。 Top Mistakes by Developers new to Cordova/Phonegap 见：#5

CSP 中的连接问题。这也是一个常见的错误，主要是因为所有示例都很糟糕 - 包括 Cordova 和 Phonegap 网站上的示例。

请注意，您的应用现在不安全。保护您的应用由您决定。 将以下内容添加到您的 index.html。请注意，您的文件中缺少星号 (*)。

<meta http-equiv="Content-Security-Policy" 
         content="default-src *; 
                  style-src * 'self' 'unsafe-inline' 'unsafe-eval'; 
                  script-src * 'self' 'unsafe-inline' 'unsafe-eval';">

您也可以从index.html 中删除所有 Javascript，它应该具有相同的效果。

此白名单工作表应该对其他部分有所帮助。HOW TO apply the Cordova/Phonegap the whitelist system

确保您还阅读了：whitelist matrix 和 Whitelist CSP Examples

祝你好运

【讨论】：

不幸的是，这仍然返回与以前相同的错误。

有什么方法可以测试这个吗？要么，要么让我看看你的代码。

我还测试了在同一台服务器上执行 GET 并成功，没有任何问题。只是 POST 给出 403 错误

好吧，我看了你的代码。它非常干净 - 这很好。但是，它过于复杂。这可能是您在 Jquery 中使用的一些技巧。这是我从“//结束样板代码”下面的代码中得到的。不幸的是，我不熟悉 xmlhttp 级别的 POST。我使用 GET 和 PATCH，因为我将它们与 firebase 一起使用。但是，鉴于您的代码正在使用 GET，我认为这是 POST 的配置错误或服务器错误。我倾向于第一个。抱歉，我帮不了你更多。

FWIW，您需要添加到您的原始帖子中，您需要 GET 才能工作并且您需要 POST。这将使人们在这个主题上更加熟悉 Jquery，并且无需查看您的 whitelist 过滤器，因为如果 GET 正在工作，这意味着您正在与服务器交谈，而不是 whitelist 或网络. --祝你好运