PhoneGap - JSONP 请求
PhoneGap - JSONP request
经过大量谷歌搜索试图找到解决此问题的方法后,我似乎遇到了,出于某种原因,大多数答案对我都不起作用,所以我想我应该问问这里的聪明人:)
我的问题是由于某种原因我的 jsonp post 到服务器不起作用:
HTML
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<meta name="format-detection" content="telephone=no" />
<meta name="viewport" content="user-scalable=no, initial-scale=1, maximum-scale=1, minimum-scale=1, width=device-width, height=device-height, target-densitydpi=device-dpi" />
<link rel="stylesheet" type="text/css" href="css/style.css" />
</head>
<body>
<p>
<button id="sendPost">Send POST</button>
</p>
<div id="results"></div>
<div id="response"></div>
<script type="text/javascript" src="cordova.js"></script>
<script type="text/javascript" src="js/jquery.min.js"></script>
<script type="text/javascript" src="js/app.js"></script>
</body>
</html>
JS
window.onerror = function(err, fileName, lineNumber) {
alert(fileName, 'Line:', lineNumber, 'Error:', e.message);
};
document.addEventListener("deviceready", init, false);
function init() {
document.querySelector("#sendPost").addEventListener("touchend", sendPost, false);
}
function sendPost() {
var myData = {
"name": "Mike"
};
jQuery.support.corps = true;
jQuery.ajax({
url: 'http://www.example.com/service.php',
dataType: 'jsonp',
data: myData,
success: function(data) {
console.log("Success: ", data);
},
error: function(e) {
$('#response').html('There was an error loading the data.' + JSON.stringify(e));
$('#response').append('Parse error:' + e.parsererror);
}
});
}
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.phonegap.example" versionCode="10" version="1.0.0">
<name>My Ajax App</name>
<description>
Do an ajax request
</description>
<access origin="*" />
<allow-intent href="*" />
<allow-navigation href="*" />
<platform name="android" />
<preference name="EnableViewportScale" value="true" />
</widget>
这就是我正在构建的应用程序所拥有的,它只需要 post 到一个服务,它在本地工作,但是在我在 phongap build 上构建它之后在移动设备上它不起作用:(
对于遇到相同问题的任何人,这就是我解决问题的方法:
HTML
我补充了:
<meta http-equiv="Content-Security-Policy" content="default-src *; style-src 'self' 'unsafe-inline'; script-src 'self' 'unsafe-inline' 'unsafe-eval'" />
Config.xml
<access origin="*" />
<allow-intent href="*" />
<allow-navigation href="*" />
<gap:plugin name="cordova-plugin-whitelist" source="npm" />
经过大量谷歌搜索试图找到解决此问题的方法后,我似乎遇到了,出于某种原因,大多数答案对我都不起作用,所以我想我应该问问这里的聪明人:)
我的问题是由于某种原因我的 jsonp post 到服务器不起作用:
HTML
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<meta name="format-detection" content="telephone=no" />
<meta name="viewport" content="user-scalable=no, initial-scale=1, maximum-scale=1, minimum-scale=1, width=device-width, height=device-height, target-densitydpi=device-dpi" />
<link rel="stylesheet" type="text/css" href="css/style.css" />
</head>
<body>
<p>
<button id="sendPost">Send POST</button>
</p>
<div id="results"></div>
<div id="response"></div>
<script type="text/javascript" src="cordova.js"></script>
<script type="text/javascript" src="js/jquery.min.js"></script>
<script type="text/javascript" src="js/app.js"></script>
</body>
</html>
JS
window.onerror = function(err, fileName, lineNumber) {
alert(fileName, 'Line:', lineNumber, 'Error:', e.message);
};
document.addEventListener("deviceready", init, false);
function init() {
document.querySelector("#sendPost").addEventListener("touchend", sendPost, false);
}
function sendPost() {
var myData = {
"name": "Mike"
};
jQuery.support.corps = true;
jQuery.ajax({
url: 'http://www.example.com/service.php',
dataType: 'jsonp',
data: myData,
success: function(data) {
console.log("Success: ", data);
},
error: function(e) {
$('#response').html('There was an error loading the data.' + JSON.stringify(e));
$('#response').append('Parse error:' + e.parsererror);
}
});
}
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.phonegap.example" versionCode="10" version="1.0.0">
<name>My Ajax App</name>
<description>
Do an ajax request
</description>
<access origin="*" />
<allow-intent href="*" />
<allow-navigation href="*" />
<platform name="android" />
<preference name="EnableViewportScale" value="true" />
</widget>
这就是我正在构建的应用程序所拥有的,它只需要 post 到一个服务,它在本地工作,但是在我在 phongap build 上构建它之后在移动设备上它不起作用:(
对于遇到相同问题的任何人,这就是我解决问题的方法:
HTML
我补充了:
<meta http-equiv="Content-Security-Policy" content="default-src *; style-src 'self' 'unsafe-inline'; script-src 'self' 'unsafe-inline' 'unsafe-eval'" />
Config.xml
<access origin="*" />
<allow-intent href="*" />
<allow-navigation href="*" />
<gap:plugin name="cordova-plugin-whitelist" source="npm" />