ajax跨域,这个是面试的时候常被问到,也是在做项目的时候会遇到的问题,在之前的项目中就有遇到过,这里根据经验写了三种分享下

1.使用中间层过渡的方式

简单来说就是"后台代理",把跨域请求交给后台去执行,然后在前端用ajax访问后台获取数据便可,这种比较简单,就不多说了。

2.使用script标签

对于 script 来讲,没有所谓的跨域限制,所以一般可以用来实现跨域请求,请求方式(这里用jquery,也可以直接用<script>标签)

 $(function () {
$.getScript("http://localhost:14412/ajaxTest.aspx", function () {
alert(responseVal);
})
})

后台对应代码

public partial class ajaxTest : System.Web.UI.Page
{
protected void Page_Load(object sender, EventArgs e)
{
Response.Write("var responseVal='Dylan'");
}
}

3.使用"jsonp"来实现
     jsonp方式其实就是在url后面多加一个callback=?的参数,这里给大家看下前端的调用方式:

使用$.getJSON来实现

    $(function () {
$.getJSON("http://localhost:14412/ajaxTest.aspx?callback=?", function (data) {
alert(data.name);
}); })

要注意的是在url的后面必须添加一个callback参数,这样getJSON方法才会知道是用JSONP方式去访问服务,callback后面的那个问号是内部自动生成的一个回调函数名

使用$.ajax来实现

    <script type="text/javascript">
$.ajax({
url:"http://localhost:14412/ajaxTest.aspx?callback=?",
dataType:"jsonp",
jsonpCallback:"my_callback",
success:function(data){
alert(data.name + " is a a" + data.sex);
}
});
</script>

这里jsonpCallback就是可以指定我们自己的回调方法名my_callback,远程服务接受callback参数的值就不再是自动生成的回调名,而是my_callback。dataType是指定按照JSOPN方式访问远程服务。

后台对应代码:

public partial class ajaxTest : System.Web.UI.Page
{
protected void Page_Load(object sender, EventArgs e)
{
//获取回调函数名
string callback = Request.QueryString["callback"];
//json数据
string json = "{\"name\":\"chopper\",\"sex\":\"man\"}"; Response.ContentType = "application/json";
//输出:回调函数名(json数据)
Response.Write(callback + "(" + json + ")"); }
}

好了,大概就这三种了。希望朋友们批评指正,也希望有其他更好的一起分享下。

ajax请求跨域问题的更多相关文章

  1. day78_淘淘商城项目_11_单点登录系统实现 + 用户名回显 + ajax请求跨域问题详解_匠心笔记

    课程计划 1.SSO注册功能实现 2.SSO登录功能实现 3.通过token获得用户信息 4.ajax跨域请求解决方案--jsonp 1.服务接口实现   SSO系统就是解决分布式环境下登录问题的,本 ...

  2. 解决ajax请求跨域

    跨域大部分需要通过后台解决,引起跨域的原因: 3个问题同时满足 才可能产生跨域问题,即跨域(协议,主机名,端口号中有一个不同就产生跨域) 下面是解决方法 方法一 // ajax请求跨域 /* *解决a ...

  3. 解决Ajax请求跨域问题

    from:https://blog.csdn.net/wang379275614/article/details/53333775 上篇文章提到,由于浏览器的同源策略,使得,AJAX请求只能发给同源的 ...

  4. 处理Ajax请求跨域问题

    ajax跨域的原理 ajax出现请求跨域错误问题,主要原因就是因为浏览器的“同源策略”. CORS是一个W3C标准,全称是"跨域资源共享"(Cross-origin resourc ...

  5. 关于ajax请求跨域问题

    jQuery中的异步请求跨域的方法: xhrFields: {withCredentials: true} 当设置为  true时,表示允许跨域: false时,表示禁止跨域

  6. Ajax请求跨域问题 -- 转载

    几乎每种浏览器都存在默认的安全机制,都有同源策略,因为浏览器恶意的把每个外部请求的都当做是黑客攻击,相当于是对自身的保护,所以浏览器在运行脚本时会判断脚本与请求的页面是否是同一来源,这个同一来源,包括 ...

  7. web api 解决Ajax请求跨域问题

    前端ajax请求接口时,经常出现跨域问题,当然了解决方法有很多种,比如: http://www.jb51.net/article/68424.htm 我本人恰好前后端都会一点,所以直接在接口端处理. ...

  8. WebApp开发:ajax请求跨域问题的解决

    服务端:PHP 客户端:Andorid, HTML5, jQuery, ajax 现象:本想通过jQuery的ajax功能从服务器取回数据存到手机的缓存里,结果总是错误,后来想到可能是跨域问题,所以查 ...

  9. nginx配置 解决ajax请求跨域问题

    文章来源:http://to-u.xyz/2016/06/30/nginx-cors/ 背景描述 最近在研究RESTful API接口设计,使用的是Nginx,要实现本地http://127.0.0. ...

随机推荐

  1. asp Gridview绑定形式获取行号

    Gridview中使用<%# Container.DataItemIndex %>取得当前行的序号 而在Repeater控件中使用Container.ItemIndex取得当前行的序号 & ...

  2. Cocos2dx使用wxsqlite开源加密SQLite3数据库

    最近使用wxsqlite加密sqlite3数据库,刚开始折腾好几天,在xcode上一直编译不通过,后来在sqlite3.c找到配置,编译顺利通过,太激动了,哈哈,废话少说!总结一下android和io ...

  3. Servlet3.0学习总结——基于Servlet3.0的文件上传

    Servlet3.0学习总结(三)——基于Servlet3.0的文件上传 在Servlet2.5中,我们要实现文件上传功能时,一般都需要借助第三方开源组件,例如Apache的commons-fileu ...

  4. iOS开发——高级技术精选&底层开发之越狱开发第一篇

    底层开发之越狱开发第一篇 做越狱开发也有一些时间了,有很多东西想总结一下,希望给他人一些借鉴,也是自己对过去开发经历的一些总结.个人不推荐使用盗版,这里主要以技术介绍为主. 这个系列里面主要介绍怎样进 ...

  5. Swift 关键字汇总

    常见的关键字有以下4种 与声明有关的关键字:class.deinit.enum.extension.func.import.init.let.protocol.static.struct.subscr ...

  6. Swift 自动布局框架-SnapKit

    官方网址:http://snapkit.io/ Github: https://github.com/SnapKit/SnapKit SnapKit is a DSL to make Auto Lay ...

  7. 8个经典炫酷的HTML5 Canvas动画欣赏

    HTML5非常强大,尤其是Canvas技术的应用,让HTML5几乎可以完成所有Flash能完成的效果.本文精选了8个经典炫酷的HTML5 Canvas动画欣赏,每一个都提供全部的源代码,希望对你有所帮 ...

  8. 使用https协议解决掉顽固不化的已解密的登录请求

    1.1 已解密的登录请求概述 在应用程序测试过程中,检测到将未加密的登录请求发送到服务器.由于登录过程所用的部分输入字段(例如:用户名.密码.电子邮件地址.社会保险号码,等等)是个人敏感信息,建议通过 ...

  9. WPF之DataGrid

    1.WPF 4 DataGrid 控件(基本功能篇) 基本使用,绑定数据展示 2.WPF 4 DataGrid 控件(自定义样式篇) 定义行,列,头,单元格等样式 3.WPF 4 DataGrid 控 ...

  10. 30个php操作redis常用方法代码例子

    From: http://www.jb51.net/article/51884.htm 这篇文章主要介绍了30个php操作redis常用方法代码例子,本文其实不止30个方法,可以操作string类型. ...