关于JQuery 中$.ajax函数利用jsonp实现Ajax跨域请求ASP.NET的WebService成功获取数据的案例
部署环境:Window 7 SP1+IIS7
成功方案:
其成功解决问题的几个重要因素如下:
1. 由于WebService默认不支持Get请求,所以要在Web.config配置文件内的<system.web>节点内添加如下元素:
<system.web>
<webServices>
<protocols>
<add name="HttpGet"/>
<add name="HttpPost"/>
</protocols>
</webServices>
</system.web>
注意:放在web service网站的web.config里面,而不是放在客户端程序的web.config里。
2. 在请求的URL加参数jsoncallback=?,注意这里jsoncallback=?是关键所在!其中?符号会被JQuery自动替换成其它的回调方法名称,具体过程和原理我们这里不予理会。我们关心的是jsoncallback=?起什么作用了?原来jsoncallback=?被替换后,会把方法名称传给服务器。我们在服务器端要做什么工作呢?服务器要接受参数jsoncallback,然后把jsoncallback的值作为JSON数据方法名称返回。
3. 设置dataType类型为”jsonp”
WebService代码如下:
using System.Web;
using System.Web.Services;
/// <summary>
///UserService 的摘要说明
/// </summary>
[WebService(Namespace = "http://tempuri.org/")]
[WebServiceBinding(ConformsTo = WsiProfiles.BasicProfile1_1)]
public class UserService : System.Web.Services.WebService
{
[WebMethod]
public void GetLoginId(string loginId)
{
string callback = HttpContext.Current.Request["jsoncallback"];
bool bl= true;//这是我调用业务逻辑层(BLL)的一个方法
//返回一个布尔(boolean)值
//现在我省略掉,直接赋值true
HttpContext.Current.Response.Write(callback +
"({result:'" + bl + "'})");
//关于result这词是你自己自定义的属性
//会作为回调参数的属性供你调用结果
HttpContext.Current.Response.End();
}
}
aspx页面及javascript脚本代码如下:
<%@ Page Language="C#" AutoEventWireup="true" CodeFile="Default.aspx.cs" Inherits="_Default" %> <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<title>测试</title>
<script type="text/javascript" src="Scripts/jquery-1.7.2.js"></script>
<script type="text/javascript">
//Document加载完毕后初始化方法
$(function Init() {
$("#TxtLoginId").bind("blur", CkLoginId);
});
//帐号验证及提示
function CkLoginId() {
var Id = $("#TxtLoginId");
$.ajax({
url: "http://localhost:5311/UserService.asmx/GetLoginId?jsoncallback=?",
dataType:"jsonp",
data:{"loginId":Id.val()},
success:OnSuccess,
error:OnError
});
}
function OnSuccess(json) {
alert(json.result);
}
function OnError(XMLHttpRequest, textStatus, errorThrown) {
targetDiv = $("#data");
if (errorThrown || textStatus == "error" || textStatus == "parsererror" || textStatus == "notmodified") {
targetDiv.replaceWith("请求数据时发生错误!");
return;
}
if (textStatus == "timeout") {
targetDiv.replaceWith("请求数据超时!");
return;
}
}
</script>
</head>
<body>
<form id="form1" runat="server">
<table border="0" cellspacing="0" cellpadding="0" width="100%">
<tr>
<td>
<asp:Label ID="LblLoginId" runat="server" Text="帐 号" ClientIDMode="Static"></asp:Label>
<asp:TextBox ID="TxtLoginId" runat="server" ClientIDMode="Static"></asp:TextBox>
</td>
</tr>
</table>
</form>
</body>
</html>
运行结果:

原文链接:http://www.cnblogs.com/VAllen/archive/2012/07/12/JQueryAjaxRegion.html
关于JQuery 中$.ajax函数利用jsonp实现Ajax跨域请求ASP.NET的WebService成功获取数据的案例的更多相关文章
- 4 伪ajax:jsonp、cors 跨域请求
一.同源策略 https://www.cnblogs.com/yuanchenqi/articles/7638956.html 同源策略(Same origin policy)是一种约定,它是浏览器最 ...
- jsonp实现js跨域请求
sonp是跨域通信的一个协议 具体来说jsonp实现跨域请求其实是使用js文件引用(js文件不一定是.js结尾)可跨域的性质,将请求的结果包裹在客户端需要调用的js方法内部.需要前后端配合使用. 前段 ...
- JSONP方法解决跨域请求
Ajax跨域请求的问题 跨域:跨域名, 一个域名下的文件去请求了和他不一样的域名下的资源文件(注意是请求文件,而不是数据接口),那么就会产生跨域请求,下面来写一个ajax来跨域请求的例子 <!D ...
- 【转】solr+ajax智能拼音详解---solr跨域请求
本文转自:http://blog.csdn.net/wangzhaodong001/article/details/8529090 最近刚做完solr的ajax智能拼音.总结一下. 前端:jQuery ...
- Ajax跨域请求ashx文件与Webservice文件
前台页面: <%@ Page Language="C#" AutoEventWireup="true" CodeBehind="WebForm1 ...
- 使用jsonp来实现跨域请求
<!DOCTYPE html> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <m ...
- Vue2.0 vue-source.js jsonp demo vue跨域请求
以调用百度的输入提示接口为例 ===================================================================================== ...
- jQuery jsonp跨域请求
跨域的安全限制都是对浏览器端来说的,服务器端是不存在跨域安全限制的. 浏览器的同源策略限制从一个源加载的文档或脚本与来自另一个源的资源进行交互. 如果协议,端口和主机对于两个页面是相同的,则两个页面具 ...
- jQuery jsonp跨域请求详解
跨域的安全限制都是对浏览器端来说的,服务器端是不存在跨域安全限制的. 浏览器的同源策略限制从一个源加载的文档或脚本与来自另一个源的资源进行交互. 如果协议,端口和主机对于两个页面是相同的,则两个页面具 ...
随机推荐
- 用opencv画矩形打上马赛克Mosaic
/*----------------------------------------------------------------------------- * * 版权声明: * 可以 ...
- 关于mysql的error-based injection payload
今天用sqlmap扫一个网站,想得到一个表的所有列名,注意到sqlmap用到的一个error-based payload的: 1 AND (SELECT 3174 FROM(SELECT COUNT( ...
- bat 批处理 字符串 截取
由于项目中配置项太多,经常有同事在配置xml的时候,讲 配置的路径搞错,先需要搞一个脚本,可以自动将路径截取出来, 晚上收集了点资料,暂时先上几个 bat 后面留着 ,具体实现. @echo off ...
- Scala学习笔记(二)表达式和函数
笔记的整理主要针对Scala对比Java的新特性: 1.if表达式 if表达式是有结果返回的. val a= if (5>2) "你好" else 1 a的值为if表达式 ...
- 教程-Delphi7 自带控件安装对应表
原来的控件delphi7里何处寻? 经常有朋友提这样的问题,“我原来在delphi5或者delphi6中用的很熟的控件到哪里去了?是不是在delphi7中没有了呢?这是不是意味着我以前写的代码全都不能 ...
- Android UI--自定义ListView(实现下拉刷新+加载更多)
Android UI--自定义ListView(实现下拉刷新+加载更多) 关于实现ListView下拉刷新和加载更多的实现,我想网上一搜就一堆.不过我就没发现比较实用的,要不就是实现起来太复杂,要不就 ...
- IOS ScrollowView 滑动到边缘后不允许再拖动
当scrollowview滑动图片时,滑动到最后一张图本应该不让其滑动,但是如果不可以去设置属性,依然可以滑动,露出白色的底色,挺影响美观的, 可以设置其属性: sv.bounces=NO; 这样就不 ...
- C++ Primer--虚函数与纯虚函数的区别
首先:强调一个概念 定义一个函数为虚函数,不代表函数为不被实现的函数. 定义他为虚函数是为了允许用基类的指针来调用子类的这个函数. 定义一个函数为纯虚函数,才代表函数没有被实现. 定义纯虚函数是为了实 ...
- Java中各种排序算法
package org.rut.util.algorithm.support; import org.rut.util.algorithm.SortUtil; /** * @author treero ...
- android109 结构体,联合体,枚举,自定义
#include <stdio.h> #include <stdlib.h> void study(){ printf("吃饭睡觉打李志\n"); } // ...