0
iOS用のCordova/Phonegapでアプリを構築しています。Cordova/Phonegap：iOSデバイスで動作しないAJAX呼び出し
私は自分のサーバー上のPHPスクリプトにusername + passwordを渡してAJAX呼び出しを介して動作するログインフォームを持っています。
私は自分のPC上でlocalhostを使ってこれを実行します（具体的には、Chrome）。これは絶対にうまく動作します。 AJAX呼び出しがPHPに渡され、PHPが実行され、応答が返されます。
PhoneGapテストアプリでiOSデバイスで同じインスタンスを実行すると、どのURL /フォームも送信されません。ウェブベースの作品は何もありません。 index.htmlページに外部ソースからの画像があり、これはiOSに読み込まれませんでした。
私は、これはアクセス許可の問題だろう考え出したので、私は次のようにヘッダを変更：
<meta http-equiv="Content-Security-Policy" content="default-src 'self' 'unsafe-eval' data: blob: filesystem: ws: gap: file: cdvfile: https://ssl.gstatic.com *; style-src * 'unsafe-inline'; script-src * 'unsafe-inline' 'unsafe-eval'; img-src * data: 'unsafe-inline'; connect-src * 'unsafe-inline'; child-src *; ">
私も私のconfig.xmlに以下を追加しました：
<allow-navigation href="*" />
<allow-intent href="*" />
<access origin="*"/>
アイデアがありますこれはすべてのトラフィックを通過させることになります（テスト目的のみ - これはセキュリティの観点からは良い考えではありません）。
以前にレンダリングされていなかったHTTPソースから取得されたindex.htmlの画像は、現在iOSデバイス上で動作しています。これは、権限の変更が助けになったことを意味するためです。 AJAXはまだ動作していません。ここで
は、私は私のIndex.htmlとして持っているものです。
function onLoad() {
document.addEventListener("deviceready", onDeviceReady, false);
}
function onDeviceReady() {
console.log(device.uuid);
}
function onDeviceReady() {
$('#loginForm').submit(function(){
var username = $("[name='username']").val();
var password = $("[name='password']").val();
var dataString = {username: username,password: password};
$.ajax({
type: "POST",
url: "http://LINK TO SERVER/login.php",
data: dataString,
dataType: 'json',
crossDomain: true,
cache: false,
success: function(responseBack){
if(response == "success"){alert("Successfully authenticated.");}
else{alert("Username/password incorrect.");}
}
});
});
}
私はトラブルシューティングを行うべきかについて私のための任意のヒントウェブを得るためにへの呼び出し：
<html>
<head>
<script type="text/javascript" src="cordova.js"></script>
<script type="text/javascript" src="scripts/scripts.js"></script>
<meta charset="utf-8" />
<meta name="format-detection" content="telephone=no" />
<meta name="msapplication-tap-highlight" content="no" />
<meta name="viewport" content="user-scalable=no, initial-scale=1, maximum-scale=1, minimum-scale=1, width=device-width" />
<meta http-equiv="Content-Security-Policy" content="default-src 'self' 'unsafe-eval' data: blob: filesystem: ws: gap: file: cdvfile: https://ssl.gstatic.com *; style-src * 'unsafe-inline'; script-src * 'unsafe-inline' 'unsafe-eval'; img-src * data: 'unsafe-inline'; connect-src * 'unsafe-inline'; child-src *; ">
<link rel="stylesheet" type="text/css" href="style/bootstrap.min.css">
<script type="text/javascript" src="//ajax.googleapis.com/ajax/libs/jquery/1.8.0/jquery.min.js"></script>
<link rel="stylesheet" type="text/css" href="style/leaf.css">
<title>App Name</title>
</head>
<body onload="onLoad()">
<img style="width:25%; padding-top:2em;" src="img/logo.png" /> <!-- Local image, which works fine on all devices -->
<img style="width:25%; padding-top:2em;" src="http://www.userlogos.org/files/logos/Karmody/alaTest_Iphone01a.png" /> <!-- external image which didn't work earlier but works now since I changed the header permissions -->
<form id="loginForm" onsubmit='return false;' action="http://LINK TO SERVER/login.php" role="form" method="post" >
<input type="text" name="username" id="username">
<input type="password" name="password" id="password">
<input type="submit" name="submit" value="Login">
</form>
<h3><a href='http://google.com'>Link to page (Works in browser but not in mobile)</a></h3>
</body>
</html>
そしてここでは、私のスクリプトファイルがあります作業？
ありがとうございました！