无法跨域问题
源码下下来仍然无法跨域,老师有解决方法吗
源码下下来仍然无法跨域,老师有解决方法吗
2015-10-26
从外界获取的代理很容易失效,为解决跨域问题,可以自行创建一个代理,此处使用php创建一个代理,保存在php_proxy_simple.php中,在客户端调用web服务时,向代理服务器提交一个URL地址,代理服务器使用CURL方法向实际的web服务发送请求,并将返回的XML数据发送给客户端。客户端对收到的XML数据再行解析。
index.html文件中的script代码如下所示:主要修改了代理服务器地址,以及$.get方法中的参数,index.html和php_proxy_simple.php文件都在train文件夹中,train文件夹在apache服务器的webapps
\projects文件夹中。可根据实际部署的位置自行调整urlProxy中的URL地址。
<script>
var urlProxy = "http://localhost:8080/projects/train/php_proxy_simple.php?ws_path="; //跨域中转
var url1 = "http://www.webxml.com.cn/WebServices/TrainTimeWebService.asmx/getStationAndTimeByStationName?UserID=";
var url2 = "http://www.webxml.com.cn/WebServices/TrainTimeWebService.asmx/getStationAndTimeDataSetByLikeTrainCode?UserID=";
var url3 = "http://www.webxml.com.cn/WebServices/TrainTimeWebService.asmx/getDetailInfoByTrainCode?UserID=";
var isbind = 0;
//获取车次列表
var getTrainList = function () {
//数据校验
if ($("#search-no").val() || ($("#search-begin").val() && $("#search-end").val())) {
var searchButton = $(this);
searchButton.button("option", "disabled", true);
$.mobile.loading("show");
//var _data = {};
var _url = url1;
if (!$("#search-no").val()) {
//_data.StartStation = $("#search-begin").val();
//_data.ArriveStation = $("#search-end").val();
_url +="&StartStation=" + $("#search-begin").val()+"&ArriveStation=" + $("#search-end").val();
} else {
//_data.TrainCode = $("#search-no").val();
_url = url2;
_url += "&TrainCode=" + $("#search-no").val();
}
$.get(urlProxy + encodeURIComponent(_url),
function (data) {
$("#list").html("");
var list = $("#list");
var timeTables = $(data).find("TimeTable");
var _arr = [];
timeTables.each(function (index, obj) {
var i = index;
if (i > 10) return false; //只载入前10条
var that = $(this);
if (that.find("FirstStation").text() == "数据没有被发现") {
alert("数据没有被发现!");
return false;
}
_arr.push('<li><a href="#" data-no="' + that.find("TrainCode").text() + '">' +
'<h2>' + that.find("TrainCode").text() + '次</h2>' +
'<p>' + that.find("FirstStation").text() + ' - ' + that.find("LastStation").text() + '</p>' +
'<p>用时:' + that.find("UseDate").text() + '</p>' +
'<p class="ui-li-aside">' + that.find("StartTime").text() + ' 开</p>' +
'</a></li>');
});
if (_arr.length > 0) {
list.html(_arr.join(""));
list.listview("refresh");
}
$.mobile.loading("hide");
searchButton.button("option", "disabled", false);
});
} else {
alert("请输入发车站和终点站或输入车次!");
}
};
var isAjax=false
//获取详情
var getInfoByTrainCode = function () {
$.mobile.loading("show");
var trainCode = $(this).attr("data-no");
var _url=url3;
if(isAjax) return;
isAjax=true
_url += "&TrainCode=" + trainCode;
$.get(urlProxy + encodeURIComponent(_url),
function (data) {
isAjax=false
$("#detail").find(".ui-content h2").html(trainCode + "次");
var tbody = $("#detail").find(".ui-content tbody");
tbody.html("");
$(data).find("TrainDetailInfo").each(function (index, obj) {
var tr = $("<tr></tr>");
var that = $(this);
tr.html('<td>' + that.find("TrainStation").text() + '</td>' +
'<td>' + that.find("ArriveTime").text() + '</td>' +
'<td>' + that.find("StartTime").text() + '</td>');
tbody.append(tr);
});
$.mobile.loading("hide");
$.mobile.changePage("#detail");
});
};
//绑定事件
var bindEvent = function () {
$("#search-submit").on("click", getTrainList);
$("#list").on("click", "a", getInfoByTrainCode);
};
$(document).on("pageshow", "#index", function () {
if (isbind) return
isbind = 1;
bindEvent();
});
</script>php_proxy_simple.php文件中的内容如下所示:
<?php
// PHP Proxy example for Web services.
// Responds to both HTTP GET and POST requests
// Get the REST call path from the AJAX application
// Is it a POST or a GET?
$url = ($_POST['ws_path']) ? $_POST['ws_path'] : $_GET['ws_path'];
// Open the Curl session
$session = curl_init();
curl_setopt($session, CURLOPT_URL, $url);
//echo $session;
// If it's a POST, put the POST data in the body
if ($_POST['yws_path']) {
$postvars = '';
while ($element = current($_POST)) {
$postvars .= urlencode(key($_POST)).'='.urlencode($element).'&';
next($_POST);
}
curl_setopt ($session, CURLOPT_POST, true);
curl_setopt ($session, CURLOPT_POSTFIELDS, $postvars);
}
// Don't return HTTP headers. Do return the contents of the call
curl_setopt($session, CURLOPT_HEADER, false);
curl_setopt($session, CURLOPT_RETURNTRANSFER, true);
// Make the call
$xml = curl_exec($session);
echo $xml;
curl_close($session);
?>举报