phoneGap アプリケーションを開発しています。ブラウザでアプリケーションをテストしても問題はありません。すべてがうまく機能します。しかし、リップルで試してみると、JavaScriptが機能しません。詳細: ユーザーはシステムにログインでき、別のページ (jquery モバイルを使用) に正常にリダイレクトされると、Chrome、Internet Explorer、および firefox で正常に動作します。しかし、リップルでは機能しません。私のコードを以下に示します。
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="initial-scale=1.0, user-scalable=no">
<meta name="apple-mobile-web-app-capable" content="yes">
<meta name="apple-mobile-web-app-status-bar-style" content="black">
<title></title>
<link rel="stylesheet" href="css/jquery.mobile-1.3.2.css">
<script src="js/jquery-1.10.2.js"></script>
<script src="js/jquery.mobile-1.3.2.js"></script>
<script src="js/jquery.base64.js"></script>
<script src="js/cordova.js"></script>
<script type="text/javascript">
$(function() {
var credentials = 'admin:adminabc';
var authType = "Basic " + credentials;
$('#loginForm').submit(function() {
$.ajax({
type : "GET",
url : 'http://localhost:30673/api/user/Get',
data : 'json',
beforeSend : function(xhr) {
xhr.setRequestHeader("Authorization", authType);
},
success : function(data, textStatus) {
$.mobile.changePage("#menu", {
transition : "slideup"
});
}
});
});
$("#aboutUs").click(function() {
$.ajax({
type : "GET",
url : 'http://localhost:30673/api/AboutMeWA/',
data : 'json',
beforeSend : function(xhr) {
xhr.setRequestHeader("Authorization", authType);
},
success : function(data, textStatus) {
$('#aboutMeTitle').val(data);
}
});
});
});
function onBodyLoad() {
document.addEventListener("deviceready", onDeviceReady, false);
function onDeviceReady() {
document.addEventListener("pause", onPause, false);
document.addEventListener("resume", onResume, false);
}
function onPause() {
alert("paused");
}
function onResume() {
alert("resume");
}
}
</script>
</head>
<body onload="onBodyLoad()">
<div data-role="page" id="mainPage">
<div data-role="header" data-theme="a" >
<h4> Ziro </h4>
</div>
<div data-role="content">
<form id="loginForm">
<div data-role="fieldcontain">
<label for="textinput1"> Kullanıcı Adı: </label>
<input name="" id="userName" placeholder="username" value="" type="text">
</div>
<div data-role="fieldcontain">
<label for="textinput2"> Password</label>
<input name="" id="password" placeholder="password" value="" type="password">
</div>
<input type="submit" data-theme="a" data- icon="arrow-r" data-iconpos="left"
value="Login">
</form>
<a href="#menu" class="ui-link" data- transition="flip">Menü</a>
</div>
<div data-role="footer" data-theme="a" data-position="fixed">
<h3> FF Yazılım </h3>
</div>
</div>
<div data-role="page" id="menu" data-add-back-btn="true" data-back-btn-text="Geri">
<div data-role="header" data-theme="a" >
<h4> Ziro Mobilya </h4>
</div>
<div data-role="content">
<ul data-role="listview" data-divider-theme="a" data- inset="true">
<li data-role="list-divider" role="heading">
Panel
</li>
<li data-theme="c">
<a href="#about" data-transition="flip" id="aboutUs"> Hakkımızda </a>
</li>
<li data-theme="c">
<a href="#page1" data-transition="slide"> Referans Resimleri </a>
</li>
<li data-theme="c">
<a href="#page1" data-transition="slide"> Servis Resimleri </a>
</li>
<li data-theme="c">
<a href="#page1" data-transition="slide"> Slogan </a>
</li>
<li data-theme="c">
<a href="#page1" data-transition="slide"> İstatistikler </a>
</li>
<li data-theme="c">
<a href="#page1" data-transition="slide"> Button </a>
</li>
</ul>
</div>
<div data-role="footer" data-theme="a" data-position="fixed">
<h3> FF Yazılım </h3>
</div>
</div>
<div data-role="page" id="about" data-add-back-btn="true" data-back-btn-text="Geri">
<div data-theme="a" data-role="header">
<h3> Hakkımızda </h3>
</div>
<div data-role="content">
<div style="">
<img style="width: 288px; height: 100px" src="http://aknera.com/temp/default/images/background3.jpg">
</div>
<a data-role="button" data-theme="a" href="#page1" data-icon="arrow-l"
data-iconpos="left"> Galeriden Resim Seç </a>
<div data-role="fieldcontain">
<label for="textinput2"> Başlık: </label>
<input name="" id="aboutMeTitle" placeholder="" value="" type="text" data-mini="true">
</div>
<div data-role="fieldcontain">
<label for="textarea2"> Açıklama </label>
<textarea name="" id="textarea2" placeholder="" data-mini="true"></textarea>
</div>
<a data-role="button" data-theme="a" href="#page1" data-icon="alert" data-iconpos="left"> Kaydet </a>
</div>
<div data-role="footer" data-theme="a" data-position="fixed">
<h3> FF Yazılım </h3>
</div>
</div>
</body>
</html>
私のアプリケーション構造を以下に示します。
エラー コードは次のとおりです:xhr_proxy?tinyhippos_apikey=ABC&tinyhippos_rurl=http%3A//localhost%3A30673/ap i/user/Get%3Fjson rippleapi.herokuapp.com ステータス コード:500 内部サーバー エラー ローカルホストの投稿アドレスからデータを取得しています:localhost:30673/api/user/Get'; ブラウザでうまく動作しています。localhost:30673/api/user/Get からデータを取得します。しかし、リップルではそこからデータを取得しようとします: xhr_proxy?tinyhippos_apikey=ABC&tinyhippos_rurl=http%3A//localhost%3A30673/api/u ser/Get%3Fjson rippleapi.herokuapp.com
アドバイスが必要です。