码迷,mamicode.com
首页 > Web开发 > 详细

JS跨域请求

时间:2016-09-26 11:01:58      阅读:158      评论:0      收藏:0      [点我收藏+]

标签:

一.跨域请求方式:

1.跨域请求方式一:angularjs之$http.jsonp

举例:

 1 $http.jsonp( "http://xxx.xxx.com?action=getResource&userID=" + userId + "&resourceCode=" + code + "&callback=JSON_CALLBACK")
 2 .success(function (data) {
 3 var json = eval(data);
 4 if (json.Success == ‘True‘) {
 5 window.location.href = json.Site;
 6 } 
 7 else if (json.Success == ‘False‘) {
 8 alert(json.Site);
 9 }
10 
11 })
12 .error(function () {
13 
14 //process
15 });

 

2.跨域请求方式二:jquery之$.ajax(或者$.getJSON)

同样举例:

 1 var url = "http://xxx.xxx.com/xxx.svc/Jsonp/QueryTemplates?systemCode=_Ferry_";//此处请求WCF服务
 2 //var mydata = { action: "getResource", userID: 428, resourceCode: 5507 };
 3 
 4 
 5 $.ajax({
 6 url: url,
 7 type: ‘GET‘,
 8 dataType: ‘jsonp‘,//必须
 9 data: "{}",
10 jsonp: ‘callback‘,//必须
11 success: function (result) {//此处即为服务端返回的可执行js代码的默认执行函数(注:服务端一般返回 callback(jsondata) )
12  
13 for (var i in result) {
14 alert(i + ":" + result[i]);//循环输出a:1,b:2,etc. 
15 }
16 },
17 error: function (XMLHttpRequest, textStatus, errorThrown) {
18 console.log(XMLHttpRequest);
19 console.log(textStatus);
20 console.log(errorThrown);
21 },
22 timeout: 3000
23 });

 

二.注意事项:

1.jsonp跨域只能GET,不能POST
2.服务端相应要做处理,如:

C# Code:

 1 [WebMethod]
 2 public void JQueryJsonp(string callback)
 3 
 4 {
 5 
 6 System.Web.HttpContext.Current.Response.Write(callback+"({username:‘showbo‘})");
 7 
 8 System.Web.HttpContext.Current.Response.End();
 9 
10 }

 

Javascript Code:

1 $.ajax({
2 url: "test.asmx/JQueryJsonp?callback=?",
3 dataType: "jsonp",
4 success: function (json) { alert("Success:" + json.username); },
5 error: function (x, e) { alert("Error:" + x.responseText); }, 
6 complete: function (x) { alert("Complete:" + x.responseText); }
7 });

先记着,后续再补充完善。

JS跨域请求

标签:

原文地址:http://www.cnblogs.com/zhanghua545588089/p/5908205.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!