1
我有一個在Android平臺上運行得非常好的PhoneGap項目，但它不能在WP8上運行。跨域資源共享（CROS）在PhoneGap的Windows Phone 8上似乎不起作用
在加載index.html（創建項目時創建的默認頁面）後，我將頁面重定向到名爲_layout.html的新頁面。
這裏是index.js（這是PhoneGap的內置代碼，不是我的），它有我的代碼重定向到我的頁面。
var app = {
// Application Constructor
initialize: function() {
this.bindEvents();
},
// Bind Event Listeners
//
// Bind any events that are required on startup. Common events are:
// `load`, `deviceready`, `offline`, and `online`.
bindEvents: function() {
document.addEventListener('deviceready', this.onDeviceReady, false);
},
// deviceready Event Handler
//
// The scope of `this` is the event. In order to call the `receivedEvent`
// function, we must explicity call `app.receivedEvent(...);`
onDeviceReady: function() {
app.receivedEvent('deviceready');
// THIS IS THE ONLY CODE I WROTE IN THIS BUILT-IN JAVASCRIPT CODE
window.setInterval(function() {
window.location.href = '_layout.html';
}, 3000);
//---------------MY CODE ENDS--------------------------------------
},
// Update DOM on a Received Event
receivedEvent: function(id) {
var parentElement = document.getElementById(id);
var listeningElement = parentElement.querySelector('.listening');
var receivedElement = parentElement.querySelector('.received');
listeningElement.setAttribute('style', 'display:none;');
receivedElement.setAttribute('style', 'display:block;');
console.log('Received Event: ' + id);
}
};
這裏是_layout.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" />
<link rel="stylesheet" type="text/css" href="css/index.css" />
<title>MyApp</title>
</head>
<body onload="loadPage('_resultlist.html');">
<div class="panel">
<div class="row" id="Title" style="text-align: center; vertical-align: central; position: relative; left: -6%; top: 10%; margin-bottom: -30px; margin-top: -20px;">
<img src="img/logo.png" style="width: 150px; height: 100px; text-align: center; vertical-align: central;" />
</div>
<hr />
<div id="franva" style="height: 300px; display:inline-block; width: 300px;">
</div>
<hr />
<div id="search" style="text-align: center;">
<input type="button" class="searchbutton" title="Search" value="Search" />
</div>
</div>
<script type="text/javascript" src="js/jquery-2.0.3.js"></script>
<script type="text/javascript" src="cordova.js"></script>
<script type="text/javascript">
function loadPage(url, onleave, onenter) {
console.log("loadPage(" + url + ")");
// If onleave function specified
if (onleave) {
onleave();
}
var xmlhttp = new XMLHttpRequest();
// Callback function when XMLHttpRequest is ready
xmlhttp.onreadystatechange = function() {
if (xmlhttp.readyState === 4) {
if (xmlhttp.status === 200) {
console.log("Received content" + xmlhttp.responseText);
$("#franva").html(xmlhttp.responseText);
// If onenter function specified
if (onenter) {
onenter();
}
}
else {
$("#franva").html("Error loading page " + url);
}
}
};
xmlhttp.open("GET", url, true);
xmlhttp.send();
}
jQuery.isUnsafe = true;
function loadPageAjax(pageurl)
{
$.ajax({
url: pageurl,
context: document.body,
dataType: "html"
}).done(function (data) {
alert("Ajax data = " + data);
$("#franva").html(data);
});
}
</script>
</body>
</html>
代碼正如你可以看到這個頁面有一個div其稱爲「franva」，它加載另一個頁面，_resultlist.html，到這個div 。
這裏是_resultlist.html
<div id="result-list" style="width: 100%;">
<div class="result-row">
<div class="left">
<img src="img/tv1.jpg" />
</div>
<div class="right">
<p><strong>Samsung XT7290</strong></p>
<p>27 inch, AU$ 1777</p>
</div>
</div>
<div class="result-row">
<div class="left">
<img src="img/tv2.jpg" />
</div>
<div class="right">
<p><strong>Samsung XT7290</strong></p>
<p>27 inch, AU$ 1777</p>
</div>
</div>
<div class="result-row">
<div class="left">
<img src="img/tv3.jpg" />
</div>
<div class="right">
<p><strong>Samsung XT7290</strong></p>
<p>27 inch, AU$ 1777</p>
</div>
</div>
</div>
我只創建了這2頁，沒有什麼比他們更多的代碼。（哦，如果計數還包括jQuery的。）
我跑了雲構建在PhoneGap Build網站上生成Android應用程序，並在我的Android手機上運行。在線生成的Windows Phone應用程序無法安裝（它彈出錯誤消息：無法安裝此公司應用程序....）
因此，我在Visual Studio 2012中構建它。但div franva的內容無法加載。
我經歷了PhoneGap文檔，它說CORS在PhoneGap中不是問題，因爲它具有運行代碼的WebBrowser底層。這是一個真正的Android，但爲什麼不在Windows Phone 8上？
整個想法是有一個佈局頁面，所以我不需要一次又一次地寫出重複的佈局零件代碼。 _resultlist.html頁面用作div的內容，它可以被任何其他資源（如通過Ajax調用獲取的數據）替代。
此外，我已經做了一個關於IE8版本在WP8中使用的研究，答案是IE10。 關於IE10，有人說它支持CORS，其他人說不....我很困惑。 ...
我一直在這個問題上堅持了幾天。
真的很感謝，如果有人能爲我指出正確的道路。
在此先感謝。
ooooooops ...我們的專家在哪裏？ – Franva
第2天，你好~~~？ – Franva
你有沒有得到答案？ – Apqu