PhoneGap AJAX呼叫不起作用-2015年12月
[英]PhoneGap AJAX Calls NOT Working - December 2015
問題描述
交叉發布在這里： http : //community.phonegap.com/nitobi/topics/jquery-ajax-calls-all-of-the-sudden-do-not-work
過去一兩個星期，這是一個全新的錯誤。 基本上，我在PhoneGap的index.html文件的頭中有一個ajax調用，錯誤狀態代碼為0。此日期從該日期（2015年12月30日）到大約2周前有效不工作。 我還確認了所有AJAX調用均無法正常工作。
我嘗試了很多解決方案，但沒有任何效果。
我努力了：
meta http-equiv =“ Content-Security-Policy” content =“ default-src *; style-src *'self''unsafe-inline''unsafe-eval'; script-src *'self''unsafe-inline' '不安全的評估';“>
添加了$ .support.cors = true;
在服務器上的htaccess文件中添加了標頭集Access-Control-Allow-Origin“ *”
嘗試了不同版本的白名單插件。
嘗試了不同形式的訪問源設置。
嘗試將內聯JS從index.html移到單獨的JS文件中。
驗證代碼行可在localhost中運行，也可通過Chrome在其他Web服務器上運行。
請幫忙。
這是我的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 = "xxxxxx"
version = "1.0.0" >
<name>Test</name>
<description>xxxx</description>
<author href="xxxx" email="xxxx">xxxx</author>
<!-- basic config -->
<preference name='phonegap-version' value='cli-5.2.0' />
<preference name="android-build-tool" value="ant" />
<preference name="orientation" value="portrait" />
<!-- all: default means both landscape and portrait are enabled -->
<preference name="fullscreen" value="false" />
<!-- all: hides the status bar at the top of the screen -->
<preference name="target-device" value="universal" />
<!-- ios: possible values handset, tablet, or universal -->
<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="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 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 -->
<!-- START Splash Screen Config -->
<!--<preference name="auto-hide-splash-screen" value="false" />
<preference name="SplashScreenDelay" value="500000" />-->
<gap:splash src="splash.png" />
<!-- iPhone and iPod touch -->
<gap:splash src="img/splash/Default.png" gap:platform="ios" width="320" height="480" />
<gap:splash src="img/splash/Default@2x.png" gap:platform="ios" width="640" height="960" />
<!-- iPhone 5 / iPod Touch (5th Generation) -->
<gap:splash src="img/splash/Default-568h@2x.png" gap:platform="ios" width="640" height="1136" />
<!-- iPhone 6 -->
<gap:splash src="img/splash/Default-667h@2x.png" gap:platform="ios" width="750" height="1334" />
<gap:splash src="img/splash/Default-Portrait-736h@3x.png" gap:platform="ios" width="1242" height="2208" />
<gap:splash src="img/splash/Default-Landscape-736h@3x.png" gap:platform="ios" width="2208" height="1242" />
<!-- iPad -->
<gap:splash src="img/splash/Default-Portrait.png" gap:platform="ios" width="768" height="1024" />
<gap:splash src="img/splash/Default-Landscape.png" gap:platform="ios" width="1024" height="768" />
<!-- Retina iPad -->
<gap:splash src="img/splash/Default-Portrait@2x.png" gap:platform="ios" width="1536" height="2048" />
<gap:splash src="img/splash/Default-Landscape@2x.png" gap:platform="ios" width="2048" height="1536" />
<!-- Android -->
<gap:splash src="img/splash/port-ldpi.png" gap:platform="android" gap:qualifier="port-ldpi" />
<gap:splash src="img/splash/land-ldpi.png" gap:platform="android" gap:qualifier="land-ldpi" />
<gap:splash src="img/splash/port-mdpi.png" gap:platform="android" gap:qualifier="port-mdpi" />
<gap:splash src="img/splash/land-mdpi.png" gap:platform="android" gap:qualifier="land-mdpi" />
<gap:splash src="img/splash/port-hdpi.png" gap:platform="android" gap:qualifier="port-hdpi" />
<gap:splash src="img/splash/land-hdpi.png" gap:platform="android" gap:qualifier="land-hdpi" />
<gap:splash src="img/splash/port-xhdpi.png" gap:platform="android" gap:qualifier="port-xhdpi" />
<gap:splash src="img/splash/land-xhdpi.png" gap:platform="android" gap:qualifier="land-xhdpi" />
<!-- END Splash Screen Config -->
<!-- allow background music play iOS -->
<gap:config-file platform="ios" parent="UIBackgroundModes" overwrite="true">
<array>
<string>audio</string>
</array>
</gap:config-file>
<!-- enable permissions -->
<preference name="permissions" value="none"/>
<feature name="http://api.phonegap.com/1.0/file"/>
<feature name="http://api.phonegap.com/1.0/geolocation"/>
<feature name="http://api.phonegap.com/1.0/media"/>
<feature name="http://api.phonegap.com/1.0/network"/>
<feature name="http://api.phonegap.com/1.0/notification"/>
<!-- Plugins -->
<!--<plugin name="InAppBrowser" value="CDVInAppBrowser" />
<feature name="InAppBrowser">
<param name="ios-package" value="CDVInAppBrowser" />
</feature>-->
<!-- 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-motion" />
<gap:plugin name="org.apache.cordova.device-orientation" />
<gap:plugin name="org.apache.cordova.dialogs" />
<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.network-information" />
<gap:plugin name="org.apache.cordova.vibration" />-->
<gap:plugin name="cordova-plugin-device" source="npm"/>
<gap:plugin name="cordova-plugin-file" source="npm"/>
<gap:plugin name="cordova-plugin-media" source="npm"/>
<gap:plugin name="cordova-plugin-splashscreen" source="npm"/>
<gap:plugin name="cordova-plugin-whitelist" source="npm"/>
<gap:plugin name="cordova-plugin-x-socialsharing" source="npm"/>
<gap:plugin name="cordova-plugin-admobpro" source="npm" spec="2.9.6"/>
<!--<gap:plugin name="de.appplant.cordova.plugin.local-notification"/>-->
<!-- Third party plugins -->
<!-- A list of available plugins are available at https://build.phonegap.com/plugins -->
<!--
<gap:plugin name="com.phonegap.plugins.barcodescanner" />
-->
<!-- Define app icon for each platform. -->
<!--<icon src="icon.png" />
<icon src="res/icon/android/icon-36-ldpi.png" gap:platform="android" gap:density="ldpi" />
<icon src="res/icon/android/icon-48-mdpi.png" gap:platform="android" gap:density="mdpi" />
<icon src="res/icon/android/icon-72-hdpi.png" gap:platform="android" gap:density="hdpi" />
<icon src="res/icon/android/icon-96-xhdpi.png" gap:platform="android" gap:density="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" width="57" height="57" />
<icon src="res/icon/ios/icon-72.png" gap:platform="ios" width="72" height="72" />
<icon src="res/icon/ios/icon-57-2x.png" gap:platform="ios" width="114" height="114" />
<icon src="res/icon/ios/icon-72-2x.png" gap:platform="ios" width="144" height="144" />
<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" />-->
<icon src="img/icons/apple-touch-icon.png" />
<icon src="img/icons/apple-touch-icon-57x57-precomposed.png" gap:platform="ios" width="57" height="57"/>
<icon src="img/icons/apple-touch-icon-72x72-precomposed.png" gap:platform="ios" width="72" height="72"/>
<icon src="img/icons/apple-touch-icon-114x114-precomposed.png" gap:platform="ios" width="114" height="114"/>
<icon src="img/icons/apple-touch-icon-144x144-precomposed.png" gap:platform="ios" width="144" height="144"/>
<icon src="img/icons/apple-touch-icon-120x120-precomposed.png" gap:platform="ios" width="120" height="120"/>
<icon src="img/icons/apple-touch-icon-76x76-precomposed.png" gap:platform="ios" width="76" height="76"/>
<icon src="img/icons/apple-touch-icon-152x152-precomposed.png" gap:platform="ios" width="152" height="152"/>
<!-- Define app splash screen for each platform. -->
<!-- <gap:splash src="res/screen/android/screen-ldpi-portrait.png" gap:platform="android" gap:density="ldpi" />
<gap:splash src="res/screen/android/screen-mdpi-portrait.png" gap:platform="android" gap:density="mdpi" />
<gap:splash src="res/screen/android/screen-hdpi-portrait.png" gap:platform="android" gap:density="hdpi" />
<gap:splash src="res/screen/android/screen-xhdpi-portrait.png" gap:platform="android" gap:density="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" width="320" height="480" />
<gap:splash src="res/screen/ios/screen-iphone-portrait-2x.png" gap:platform="ios" width="640" height="960" />
<gap:splash src="res/screen/ios/screen-ipad-portrait.png" gap:platform="ios" width="768" height="1024" />
<gap:splash src="res/screen/ios/screen-ipad-landscape.png" gap:platform="ios" width="1024" height="768" />
<gap:splash src="res/screen/windows-phone/screen-portrait.jpg" gap:platform="winphone" />-->
<!--
Define access to external domains.
<access /> - a blank access tag denies access to all external resources.
<access origin="*" /> - a wildcard access tag allows access to all external resource.
Otherwise, you can specify specific domains:
-->
<allow-navigation href="*"/>
<allow-intent href="*"/>
<access origin="*"/>
<access origin="http://*.xxxxxxx/"/>
<access origin="http://xxxxxx/"/>
<!-- allow local pages -->
<!--
<access origin="http://phonegap.com" /> - allow any secure requests to http://phonegap.com/
<access origin="http://phonegap.com" subdomains="true" /> - same as above, but including subdomains, such as http://build.phonegap.com/
-->
</widget>
這是通過AJAX抓取頁面的腳本：
<script>
var dev_mode = true;
if (dev_mode) {
alert('Development Mode Active - You will see popups used for debugging purposes.');
var scripts_url = 'http://dev.xxxxxxx/app/scripts';
} else {
var scripts_url = 'http://xxxxxxxxx/app/scripts';
}
jQuery.ajax({
type : "POST",
url : scripts_url,
success: function(html) {
jQuery('head').append(html);
},
error: function(xhr, status, err) {
if (dev_mode) {
alert('error getting scripts: ' + status);
alert('error getting scripts: ' + err);
alert('error getting scripts: ' + xhr.responseText);
alert('error getting scripts: ' + xhr.status);
alert('error getting scripts: ' + xhr.statusText);
alert('error getting scripts: ' + JSON.stringify(xhr));
}
}
});
</script>
AJAX調用錯誤，狀態為0。
答案：
這是您的第一個應用程序嗎？
不是我的第一個PhoneGap應用程序，而是我的第一個非常復雜的應用程序。
您的目標平台和目標版本是什么？
定位除Blackberry以外的所有平台（已在此AJAX錯誤之前測試過可在iOS，Android和WP上運行）
您使用的是CLI，SDK還是Build？
建立
2 個解決方案
解決方案1
0 2016-01-02 23:01:30
不確定是否對您的問題有幫助，但是對於其他有類似問題的人，這可能會有所幫助：
幾周前我遇到了完全相同的問題。 我的解決方案是將以下內容添加到我的服務器中：
"Access-Control-Allow-Origin", "*";
"Access-Control-Allow-Headers", "X-Requested-With"
"Access-Control-Allow-Credentials", "X-Requested-With"
當我使用Express（NODE）服務器時，我通過添加cors NPM軟件包來完成。 然后，在服務器啟動之前添加以下內容：
app.use(cors({credentials: true, origin: true}));
解決方案2
0 已采納 2016-01-03 11:53:18
所有人注意：此應用使用不受限制的白名單過濾器，僅用於開發。
此應用程序示例不安全。 保護您的應用程序完全取決於您。
此外，您的應用可能會被Google和Apple拒絕。
謝謝大家的幫助，我很高興地宣布我已解決此問題。 由於嘗試了多種解決方案，因此我不確定100％解決了該問題，我懷疑這只是所有問題的一部分。 但是，我第一次注意到該代碼真正起作用了，是在刪除config.xml中的權限行時。
總之，為解決此問題，我添加了：
- CSP
<meta http-equiv="Content-Security-Policy" content="default-src *; style-src * 'unsafe-inline'; script-src * 'unsafe-inline' 'unsafe-eval'"> - 從config.xml中刪除了權限和功能。 （下面的新配置）
- 在觸發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 = "abc"
version = "1.0.0" >
<name>abc</name>
<description>abc</description>
<author href="abc" email="abc">abc</author>
<!-- basic config -->
<preference name='phonegap-version' value='cli-5.2.0' />
<preference name="android-build-tool" value="ant" />
<preference name="orientation" value="portrait" />
<!-- all: default means both landscape and portrait are enabled -->
<preference name="fullscreen" value="false" />
<!-- all: hides the status bar at the top of the screen -->
<preference name="target-device" value="universal" />
<!-- ios: possible values handset, tablet, or universal -->
<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="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 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 -->
<!-- START Splash Screen Config -->
<!--<preference name="auto-hide-splash-screen" value="false" />
<preference name="SplashScreenDelay" value="500000" />-->
<gap:splash src="splash.png" />
<!-- iPhone and iPod touch -->
<gap:splash src="img/splash/Default.png" gap:platform="ios" width="320" height="480" />
<gap:splash src="img/splash/Default@2x.png" gap:platform="ios" width="640" height="960" />
<!-- iPhone 5 / iPod Touch (5th Generation) -->
<gap:splash src="img/splash/Default-568h@2x.png" gap:platform="ios" width="640" height="1136" />
<!-- iPhone 6 -->
<gap:splash src="img/splash/Default-667h@2x.png" gap:platform="ios" width="750" height="1334" />
<gap:splash src="img/splash/Default-Portrait-736h@3x.png" gap:platform="ios" width="1242" height="2208" />
<gap:splash src="img/splash/Default-Landscape-736h@3x.png" gap:platform="ios" width="2208" height="1242" />
<!-- iPad -->
<gap:splash src="img/splash/Default-Portrait.png" gap:platform="ios" width="768" height="1024" />
<gap:splash src="img/splash/Default-Landscape.png" gap:platform="ios" width="1024" height="768" />
<!-- Retina iPad -->
<gap:splash src="img/splash/Default-Portrait@2x.png" gap:platform="ios" width="1536" height="2048" />
<gap:splash src="img/splash/Default-Landscape@2x.png" gap:platform="ios" width="2048" height="1536" />
<!-- Android -->
<gap:splash src="img/splash/port-ldpi.png" gap:platform="android" gap:qualifier="port-ldpi" />
<gap:splash src="img/splash/land-ldpi.png" gap:platform="android" gap:qualifier="land-ldpi" />
<gap:splash src="img/splash/port-mdpi.png" gap:platform="android" gap:qualifier="port-mdpi" />
<gap:splash src="img/splash/land-mdpi.png" gap:platform="android" gap:qualifier="land-mdpi" />
<gap:splash src="img/splash/port-hdpi.png" gap:platform="android" gap:qualifier="port-hdpi" />
<gap:splash src="img/splash/land-hdpi.png" gap:platform="android" gap:qualifier="land-hdpi" />
<gap:splash src="img/splash/port-xhdpi.png" gap:platform="android" gap:qualifier="port-xhdpi" />
<gap:splash src="img/splash/land-xhdpi.png" gap:platform="android" gap:qualifier="land-xhdpi" />
<!-- END Splash Screen Config -->
<!-- allow background music play iOS -->
<gap:config-file platform="ios" parent="UIBackgroundModes" overwrite="true">
<array>
<string>audio</string>
</array>
</gap:config-file>
<icon src="img/icons/apple-touch-icon.png" />
<icon src="img/icons/apple-touch-icon-57x57-precomposed.png" gap:platform="ios" width="57" height="57"/>
<icon src="img/icons/apple-touch-icon-72x72-precomposed.png" gap:platform="ios" width="72" height="72"/>
<icon src="img/icons/apple-touch-icon-114x114-precomposed.png" gap:platform="ios" width="114" height="114"/>
<icon src="img/icons/apple-touch-icon-144x144-precomposed.png" gap:platform="ios" width="144" height="144"/>
<icon src="img/icons/apple-touch-icon-120x120-precomposed.png" gap:platform="ios" width="120" height="120"/>
<icon src="img/icons/apple-touch-icon-76x76-precomposed.png" gap:platform="ios" width="76" height="76"/>
<icon src="img/icons/apple-touch-icon-152x152-precomposed.png" gap:platform="ios" width="152" height="152"/>
<gap:plugin name="cordova-plugin-device" source="npm"/>
<gap:plugin name="cordova-plugin-file" source="npm"/>
<gap:plugin name="cordova-plugin-media" source="npm"/>
<gap:plugin name="cordova-plugin-splashscreen" source="npm"/>
<gap:plugin name="cordova-plugin-whitelist" source="npm"/>
<gap:plugin name="cordova-plugin-x-socialsharing" source="npm"/>
<gap:plugin name="cordova-plugin-admobpro" source="npm" spec="2.9.6"/>
<allow-navigation href="*"/>
<allow-intent href="*"/>
<access origin="*"/>
</widget>
新的JS AJAX調用：
document.addEventListener("deviceready", on_device_ready, false);
function on_device_ready() {
jQuery.ajax({
type : "GET",
url : scripts_url,
success: function(html) {
jQuery('head').append(html);
},
error: function(xhr, status, err) {
if (dev_mode) {
alert('error getting scripts: ' + status);
alert('error getting scripts: ' + err);
alert('error getting scripts: ' + xhr.responseText);
alert('error getting scripts: ' + xhr.status);
alert('error getting scripts: ' + xhr.statusText);
alert('error getting scripts: ' + JSON.stringify(xhr));
}
}
});
}
再次感謝大家。
Phonegap android ajax調用在瀏覽器中工作，而不是在移動設備上
[英]Phonegap android ajax calls working in browser, not on mobile
聲明:本站的技術帖子網頁，遵循CC BY-SA 4.0協議，如果您需要轉載，請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.