ajax请求跨域问题
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请求跨域问题的更多相关文章
- day78_淘淘商城项目_11_单点登录系统实现 + 用户名回显 + ajax请求跨域问题详解_匠心笔记
课程计划 1.SSO注册功能实现 2.SSO登录功能实现 3.通过token获得用户信息 4.ajax跨域请求解决方案--jsonp 1.服务接口实现 SSO系统就是解决分布式环境下登录问题的,本 ...
- 解决ajax请求跨域
跨域大部分需要通过后台解决,引起跨域的原因: 3个问题同时满足 才可能产生跨域问题,即跨域(协议,主机名,端口号中有一个不同就产生跨域) 下面是解决方法 方法一 // ajax请求跨域 /* *解决a ...
- 解决Ajax请求跨域问题
from:https://blog.csdn.net/wang379275614/article/details/53333775 上篇文章提到,由于浏览器的同源策略,使得,AJAX请求只能发给同源的 ...
- 处理Ajax请求跨域问题
ajax跨域的原理 ajax出现请求跨域错误问题,主要原因就是因为浏览器的“同源策略”. CORS是一个W3C标准,全称是"跨域资源共享"(Cross-origin resourc ...
- 关于ajax请求跨域问题
jQuery中的异步请求跨域的方法: xhrFields: {withCredentials: true} 当设置为 true时,表示允许跨域: false时,表示禁止跨域
- Ajax请求跨域问题 -- 转载
几乎每种浏览器都存在默认的安全机制,都有同源策略,因为浏览器恶意的把每个外部请求的都当做是黑客攻击,相当于是对自身的保护,所以浏览器在运行脚本时会判断脚本与请求的页面是否是同一来源,这个同一来源,包括 ...
- web api 解决Ajax请求跨域问题
前端ajax请求接口时,经常出现跨域问题,当然了解决方法有很多种,比如: http://www.jb51.net/article/68424.htm 我本人恰好前后端都会一点,所以直接在接口端处理. ...
- WebApp开发:ajax请求跨域问题的解决
服务端:PHP 客户端:Andorid, HTML5, jQuery, ajax 现象:本想通过jQuery的ajax功能从服务器取回数据存到手机的缓存里,结果总是错误,后来想到可能是跨域问题,所以查 ...
- nginx配置 解决ajax请求跨域问题
文章来源:http://to-u.xyz/2016/06/30/nginx-cors/ 背景描述 最近在研究RESTful API接口设计,使用的是Nginx,要实现本地http://127.0.0. ...
随机推荐
- 【转】Windows Phone 8 开发环境的搭建
1.先安装Microsoft Visual Studio 2012旗舰版,安装包自己下载. 系统必须是Win8 X64 对于软硬件的检测可以参照: Windows Phone 8开发环境搭建之一.电脑 ...
- python字符串格式化方法 format函数的使用
python从2.6开始支持format,新的更加容易读懂的字符串格式化方法, 从原来的% 模式变成新的可读性更强的 花括号声明{}.用于渲染前的参数引用声明, 花括号里可以用数字代表引用参数的序 ...
- shell脚本编写方法
shell脚本编写就如同一门语言,涉及到运行环境.基本语法.变量定义.函数.参数(系统参数).条件判定.执行流程控制 等等问题. 本文就以下几个方面进行描述: 运行环境: shell shebang ...
- JS区别不同浏览器(微信、手机等)
最近一直在忙于自己公司的旅游产品,设计方面太广并且要兼容各种设备和场景,包括PC.Mobile.Pad.还有各种支付.由于微信支付和支付宝存在竞争,所以需要区别不同的浏览器,并且WEB项目还要出现在A ...
- Faster R-CNN CPU环境搭建
操作系统: bigtop@bigtop-SdcOS-Hypervisor:~/py-faster-rcnn/tools$ cat /etc/issue Ubuntu LTS \n \l Python版 ...
- Modbus通讯协议学习 - 串口调试
概述 我们在做任何事情之前都需要获取很多 调试步骤: 1:485转换器连接硬件 2:485转换器上的USB接口连接电脑. 3:打开设备管理器 ->查看端口 4:打开串口调试工具,在串口配置的地方 ...
- Myeclipse 2015 stable 1.0 完美破解方法(转自 http://yangl.net/2015/07/14/myeclipse_2015stable_1/)
Myeclipse 2015 stable 1.0 完美破解方法 http://yangl.net/2015/07/14/myeclipse_2015stable_1/ 破解包(注册机)下载地址:链接 ...
- ubuntu14.04LTS安装vmware10.0.1
因为所用Ubuntu系统是32位,而VMware最新版本又不支持32位,只好下载以前版本vmware10.0.1. vmware10.0.1下载地址: http://down.it168.com/1 ...
- solr searcher
solr searcher 前面我配置好了solr,并且数据库建立索引也完成了. 为php添加搜索 首先下载solrphp http://wiki.apache.org/solr/SolPHP 在so ...
- [原创]Andorid DexClassLoader的创建过程解析(基于5.0)
做Android插件框架时,经常会用到dex的动态加载,就要直接或间接的使用DexClassLoader,在new DexClassLoader的时候Android系统做了很多工作,下面我们详细分析一 ...