jsonp 跨域调用

最新推荐文章于 2022-11-10 08:40:57 发布
最新推荐文章于 2022-11-10 08:40:57 发布
阅读量853 收藏
点赞数
分类专栏： HTML5 Ajax JSON jQuery WebService Web
HTML5 同时被 3 个专栏收录
155 篇文章 0 订阅
订阅专栏
Web
102 篇文章 0 订阅
订阅专栏
jQuery
87 篇文章 0 订阅
订阅专栏
出处： http://bbs.csdn.net/topics/390858756
WebService是我们自己的项目，ajax是别人调用，但是我需要给别人写个例子。
WebService是带参数的，我现在用ajax调用后总是error报错，报错内容是空的。我贴下代码

这是WebService的代码 
C# code
?
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
using  System;
using  System.Collections.Generic;
using  System.Linq;
using  System.Web;
using  System.Web.Services;
using  System.Web.Script.Services;
using  System.Web.Script.Serialization;
 
namespace  MeierbeiWebDtService
{
     /// <summary>
     /// WebService 的摘要说明
     /// </summary>
     [WebService(Namespace =  "http://tempuri.org/" )]
     [WebServiceBinding(ConformsTo = WsiProfiles.BasicProfile1_1)]
     [System.ComponentModel.ToolboxItem( false )]
     // 若要允许使用 ASP.NET AJAX 从脚本中调用此 Web 服务，请取消对下行的注释。
     [System.Web.Script.Services.ScriptService]
     public  class  WebService : System.Web.Services.WebService
     {
         [WebMethod]
         [ScriptMethod(UseHttpGet =  true , ResponseFormat = ResponseFormat.Json)]
         public  string  HelloWorld()
         {
             JavaScriptSerializer js =  new  JavaScriptSerializer();
             Context.Response.Clear();
             Context.Response.ContentType =  "application/json" ;
             Models.HelloWorldData data =  new  Models.HelloWorldData();
             data.Message =  "HelloWorld" ;
             data.Name =  "MicJackson" ;
             return  js.Serialize(data);
         }
 
         [WebMethod]
         [ScriptMethod(UseHttpGet =  false , ResponseFormat = ResponseFormat.Json)]
         public  void  GetClass( int  fenshu)
         {
             JavaScriptSerializer js =  new  JavaScriptSerializer();
             Context.Response.Clear();
             Context.Response.ContentType =  "application/json" ;
             Models.HelloWorldData data =  new  Models.HelloWorldData();
             if  (fenshu > 90)
             {
                 data.Message =  "优异" ;
                 data.Name =  "语文" ;
             }
             else  if  (fenshu > 80)
             {
                 data.Message =  "良好" ;
                 data.Name =  "语文" ;
             }
             else  if  (fenshu > 60)
             {
                 data.Message =  "及格" ;
                 data.Name =  "语文" ;
             }
             else
             {
                 data.Message =  "不及格" ;
                 data.Name =  "语文" ;
             }
             Context.Response.Write(js.Serialize(data));
             Context.Response.End();
             //return js.Serialize(data);
         }
     }
 
 
}

这是我写的html代码  
XML/HTML code
?
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
< html >
< head >
     < script  src = "jquery-1.11.1.min.js"  type = "text/javascript" ></ script >
</ head >
< body >
     < script  type = "text/javascript" >
         $(document).ready(function(){
             $.ajax({
                 url: "http://localhost:53568/WebService.asmx/GetClass",
                 type: "GET",
                 dataType: "json",
                 data: {fenshu: 23},
                 success: function(json) {  
                     alert("success:"+json);  
                 },  
                 error: function(x, e) {  
                     alert("error:"+x.responseText);  
                 },  
                 complete: function(x) {  
                     alert("complete:"+x.responseText);  
                 }  
             }); 
 
             $.ajax({
                 url: "http://localhost:53568/WebService.asmx/HelloWorld",
                 type: "GET",
                 dataType: "json",
                 success: function(json) {  
                     alert("success:"+json);  
                 },  
                 error: function(x, e) {  
                     alert("error:"+x.responseText);  
                 },  
                 complete: function(x) {  
                     alert("complete:"+x.responseText);  
                 }  
             });             
         });
     </ script >
</ body >
</ html >

求助，哪里有问题，为什么得不到WebService返回的json数据啊？还有就是如果我想传参，有什么好点的办法吗？谢谢

额，自己解决了，是因为我的html页面不在同一个域里，没跨域，现在加上jsonp就没问题了
C# code

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
using  System;
using  System.Collections.Generic;
using  System.Linq;
using  System.Web;
using  System.Web.Services;
using  System.Web.Script.Services;
using  System.Web.Script.Serialization;
 
namespace  MeierbeiWebDtService
{
     /// <summary>
     /// WebService 的摘要说明
     /// </summary>
     [WebService(Namespace =  "http://tempuri.org/" )]
     [WebServiceBinding(ConformsTo = WsiProfiles.BasicProfile1_1)]
     [System.ComponentModel.ToolboxItem( false )]
     // 若要允许使用 ASP.NET AJAX 从脚本中调用此 Web 服务，请取消对下行的注释。
     [System.Web.Script.Services.ScriptService]
     public  class  WebService : System.Web.Services.WebService
     {
         [WebMethod]
         [ScriptMethod(UseHttpGet =  true , ResponseFormat = ResponseFormat.Json)]
         public  string  HelloWorld()
         {
             JavaScriptSerializer js =  new  JavaScriptSerializer();
             Context.Response.Clear();
             Context.Response.ContentType =  "application/json" ;
             Models.HelloWorldData data =  new  Models.HelloWorldData();
             data.Message =  "HelloWorld" ;
             data.Name =  "MicJackson" ;
             return  js.Serialize(data);
         }
 
         [WebMethod]
         [ScriptMethod(UseHttpGet =  false , ResponseFormat = ResponseFormat.Json)]
         public  void  GetClass( int  fenshu)
         {
             JavaScriptSerializer js =  new  JavaScriptSerializer();
             Context.Response.Clear();
             Context.Response.ContentType =  "application/json" ;
             Models.HelloWorldData data =  new  Models.HelloWorldData();
             if  (fenshu > 90)
             {
                 data.Message =  "优异" ;
                 data.Name =  "语文" ;
             }
             else  if  (fenshu > 80)
             {
                 data.Message =  "良好" ;
                 data.Name =  "语文" ;
             }
             else  if  (fenshu > 60)
             {
                 data.Message =  "及格" ;
                 data.Name =  "语文" ;
             }
             else
             {
                 data.Message =  "不及格" ;
                 data.Name =  "语文" ;
             }
             HttpRequest Request = HttpContext.Current.Request;
             string  callback = Request[ "jsonp" ];
             Context.Response.Write(callback +  "("  + js.Serialize(data) +  ")" );
             Context.Response.End();
             //return js.Serialize(data);
         }
     }
 
 
}


XML/HTML code
?
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
< html >
< head >
     < script  src = "jquery-1.11.1.min.js"  type = "text/javascript" ></ script >
</ head >
< body >
     < script  type = "text/javascript" >
         function callbackjsp(result){
             alert("Message:"+result.Message + ",Name:"+result.Name);
         }
         $(document).ready(function(){
             $.ajax({
                 url: "http://localhost:53568/WebService.asmx/GetClass",
                 type: "GET",
                 dataType: "jsonp",
                 jsonp: "jsonp", //传递给请求处理程序或页面的，用以获得jsonp回调函数名的参数名(默认为:callback)
                 jsonpCallback: "callbackjsp", //自定义的jsonp回调函数名称，默认为jQuery自动生成的随机函数名
                 data: { fenshu: 93 },
                 success: function (json) {
                     alert("success:" + json.Message);
                 },
                 error: function (x, e) {
                     //alert("error:" + x.responseText);
                 },
                 complete: function (x) {
                     //alert("complete:" + x.responseText);
                 }
             });       
         });
     </ script >
</ body >
</ html >


chelen_jak
关注
专栏目录
跨域访问解决方法-jsonp
01-07
使用jsonp跨域获取json数据。Ajax获取JAVA服务器json数据。
利用jsonp跨域调用百度js实现搜索框智能提示
11-25
【JSONP跨域调用与百度搜索框智能提示】 在Web开发中，由于浏览器的同源策略限制，JavaScript无法直接发起跨域请求。为了解决这个问题，JSONP（JSON with Padding）应运而生。JSONP是一种绕过同源策略的技术，通过...
jsonp跨域调用
跟着互联网
05-12 238
客户端： <script type="text/javascript"> function jsonpCallback(result){ alert(result[1].name); } </script> <script type="text/javascript"src="http://te...
使用HTTP GET访问方法
weixin_30699443的博客
04-30 354
•使用ScriptMethodAttribute进行标记 –UseHttpGet属性设为true •客户端使用代理的方法没有任何变化 •参数将使用QueryString进行传递 •性能较HTTPPOST方法略有提高 •一些特性略有改变 –缓存的基础 aspx <formid="form1"runat="server"> <asp:...
客户端访问WebService中如何使用【使用HTTP GET访问方法】
houxh86的专栏
09-25 1361
使用HTTP GET访问方法 • 使用ScriptMethodAttribute进行标记 　– UseHttpGet属性设为true • 客户端使用代理的方法没有任何变化 • 参数将使用Query String进行传递 • 性能较HTTP POST方法略有提高 • 一
第三部分 03 使用HTTP GET进行调用
weixin_33762321的博客
06-15 92
一 只需为WebService添加一个属性[ScriptMethod(UseHttpGet = true)]二 WebServiceusing System;using System.Web;using System.Collections;using System.Web.Services;using System.Web.Services.Protocols;using System.Web...
jquery ajax jsonp跨域调用实例代码
10-26
今天研究了AJAX使用JSONP进行跨域调用的方法，发现使用GET方式和POST方式都可以进行跨域调用,这里简单分享下，方便需要的朋友
JSONP解决跨域
qq_63479468的博客
05-06 1804
一、同源政策 1.什么是同源 如果两个页面拥有相同的协议、域名和端口，那么这两个页面就属于同一个源，其中只要有一个不同，就是不同源 2.同源政策的目的 同源政策是为了保证用户信息的安全，防止恶意的网站窃取数据。最初的同源政策是指A网站在客户端设置的Cookie，B网站是不能访问的 随着互联网的发展，同源政策也越来越严格，在不同源的情况下，其中有一项规定就是无法向非同源地址发送Ajax请求，如果请求，浏览器就会报错。 ...
JSONP实现跨域（9种跨域方案）
qq_39465116的博客
07-21 6741
跨域
轻松搞定JSONP跨域请求
热门推荐
诗渊的博客
07-26 8万+
本文介绍了通过JSONP实现跨域请求，首先介绍了“同源策略”，然后介绍了同构JavaScript动态加载script标签的方法，实现JSONP跨域，最后介绍了jQuery中对JSONP的封装和使用
jquery使用jsonp进行跨域调用
最新发布
eeeeety6208的博客
11-10 1117
jsonp:表示传递的参数，默认为callback，我们也可以自定义，服务器段通过此参数，获取自定义的函数名称，服务器这样获取 Request.QueryString["callback"]jsonpCallback：自定义的jsonp回调函数名称，默认为jQuery自动生成的随机函数名，也可以写"?jsonp：传递给请求处理程序或页面的，用以获得jsonp回调函数名的参数名(一般默认为:callback)jsonpCallback表示传递的参数值，也就是回调的函数名称，这是自定义的名称。
Jsonp解决ajax跨域问题
Saytime
05-30 4万+
一、介绍 最近跨域问题比较多，而且自己刚好也看到这一块，就总结了一下，关于JSONP的东西百度的话东西确实很多，很多人都是复制别人的，如此下去，其实找的资料就那么几份，关键是我还看不懂，可能是能力问题吧，自己经过很多尝试，所以总结了一下，终究还是弄懂了皮毛。注意一点是，这里是用Jsonp解决ajax的跨域问题，具体的实现其实不是ajax。 1、同源策略浏览器有一个很重要的概念——同源策略(Sam
jsonp方法跨域的过程
廿四桥明月夜的博客
08-16 9017
说到AJAX就会不可避免的面临两个问题，第一个是AJAX以何种格式来交换数据？第二个是跨域的需求如何解决？这两个问题目前都有不同的解决方案，比如数据可以用自定义字符串或者用XML来描述，跨域可以通过服务器端代理来解决。 但到目前为止最被推崇或者说首选的方案还是用JSON来传数据，靠JSONP来跨域。而这就是本文将要讲述的内容。   JSON和JSONP虽然只有一个字母的差别，但其实他们根本不...
使用 JSONP 实现跨域（速通）
高大志leo的博客
08-15 3562
两分钟，使用 JSONP 实现跨域。
JSONP实现跨域
花生吃花生的学习记录
11-06 1703
首先说一下什么是跨域： 跨域就是在客户端在访问服务器的时候，出现了协议、域名、端口有一项或者几项不同，就会导致跨域。也就是说，在这种情况下，跨域会阻止你的访问。向服务器发送请求后，也自然不会收到服务器返回的数据了。 那么：跨域应该如何解决呢，通常跨域有两种解决办法，一种是利用JSONP来实现跨域，另外就是使用CORS来实现跨域。 JSONP（JSON with Padding）实现跨域 原理：jsonp实现跨域的原理，就是利用script标签可以实现跨域访问，我们在使用script标签的时候，有时会
序列化(Serialization)据为JSONP远端请求
weixin_34015566的博客
01-12 86
Insus.NET前些日子，有分享了一段代码，《使用JSONP跨域请求数据》http://www.cnblogs.com/insus/p/3512271.html 是使用jQuery的DataType的jsonp来获取远端的数据。但是网友私下跟Insus.NET说，不会使用。主要是远端提供的数据，以及想一个较完整的实例演示。由于Insus.NET开发的实际环境中，是应用了条码枪，扫描产生流程的产品...
JSONP 实现跨域请求实例
前端博客
03-29 7934
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Title</title> <script src="https://cdn.bootcss.com/vue/2.6.10/vue.min.js">&l...
JSONP跨域调用详解
"本文主要介绍了JSONP跨域调用的概念、由来以及基本原理与实现方式，帮助读者理解如何利用JSONP解决浏览器的同源策略限制，实现不同源的脚本间的数据交互。" JSONP全称为JSON with Padding，是一种非官方的协议，...
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值