在用AJAX跨域请求时遇到的问题
刚刚接触ajax就遇到一个词--跨域。
在我百度了各种资料以后总结了一句话:“只要不是在一个协议、域、名端口下,都属于跨域(127.0.0.1本地也属于跨域)”。
在做ajax请求的时候,请求不到并且浏览器会报错,错误如下:
XMLHttpRequest cannot load http://xxxxxxNo 'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'http://xxxxxxx' is therefore not allowed access.
我在查阅跨域的资料之后,学了两种解决跨域问题的方法。
一、设置header头运行ajax跨域
这步前端不需要做什么,正常使用dataType : 'json',和post请求。
只需要后台设置允许跨域。代码如下:
// 指定允许其他域名访问
httpServletResponse.setHeader("Access-Control-Allow-Origin", "*");
// 响应类型
httpServletResponse.setHeader("Access-Control-Allow-Methods", "POST");
// 响应头设置
httpServletResponse.setHeader("Access-Control-Allow-Headers", "x-requested-with,content-type");
Access-Control-Allow-Origin:* 表示允许任何域名跨域访问,由于设置*存在安全隐患,建议将*改成你想允许的域名。
看到一篇文章说只设置Access-Control-Allow-Origin这一个属性也可以允许跨域。
二、允许jsonp跨域
php代码
//需要获取的数据
$data = array('id'=>1, 'name'=>'ityangs');
//设置参数名
$callback = $_GET['callback'];
//输出
echo $callback.'('.json_encode($data).')';
//退出
exit;
输入的结果是:'users({'id': 1, 'name': 'ityangs'})'
前端代码
$.ajax({
type : "get",//jsonp的本质是利用script标签的src属性进行跨域请求,只能用于get请求。
url : "ajax.php",
dataType : "jsonp",
jsonp: "callback",//传递给请求处理程序或页面的,用以获得jsonp回调函数名的参数名(默认为:callback)
jsonpCallback:"success_jsonpCallback",//自定义的jsonp回调函数名称,默认为jQuery自动生成的随机函数名
success : function(json){
alert('success');
},
error:function(){
alert('fail');
}
});
由于个人见识有限,又是个渣前端,如有差错,请多多见谅,并提出修改办法,勿喷。

在用AJAX跨域请求时遇到的问题的更多相关文章
- 为什么返回的数据前面有callback? ashx/json.ashx?的后面加 callback=? 起什么作用 js url?callback=xxx xxx的介绍 ajax 跨域请求时url参数添加callback=?会实现跨域问题
为什么返回的数据前面有callback? 这是一个同学出现的问题,问到了我. 应该是这样的: 但问题是这样的: 我看了所请求的格式和后台要求的也是相同的.而且我也是这种做法,为什么他的就不行呢? ...
- ajax跨域请求时,sessionId不一样,导致无法记住登陆状态
遇到这样一个场景,就是前端的域是dev,请求接口时,接口的域是beta,即使在服务端设置了cookie存放的域,'COOKIE_DOMAIN' => '.roboming.com',虽然c ...
- ajax 跨域请求时url参数添加callback=?会实现跨域问题
例如: 1.在 jQuery 中,可以通过使用JSONP 形式的回调函数来加载其他网域的JSON数据,如 "myurl?callback=?".jQuery 将自动替换 ? 为正确 ...
- SpringMvc+ajax跨域请求时,出现options类型的请求并返回403的解决方案
在使用 $.ajax({ url:'http://127.0.0.1:8081/rest/ccxxx/xxxx', type:'POST', dataType:"json", co ...
- Ajax跨域请求,设置content
在使用Ajax跨域请求时,如果设置Header的ContentType为application/json,会分两次发送请求.第 一次先发送Method为OPTIONS的请求到服务器,这个请求会询问服务 ...
- ASP.NET MVC 实现AJAX跨域请求方法《1》
ASP.NET MVC 实现AJAX跨域请求的两种方法 通常发送AJAX请求都是在本域内完成的,也就是向本域内的某个URL发送请求,完成部分页面的刷新.但有的时候需要向其它域发送AJAX请求,完成数据 ...
- webapi 解决ajax跨域请求问题
webapi在配置文件中加入这几句就可以解决ajax(同源策略是JavaScript里面的限制,其他的编程语言,比如在C#,Java或者iOS等其他语言中是可以调用外部的WebService,也就是 ...
- Nginx 实现AJAX跨域请求
在工作中遇到跨域请求的问题: AJAX从一个域请求另一个域会有跨域的问题.那么如何在nginx上实现ajax跨域请求呢?要在nginx上启用跨域请求,需要添加add_header Access-Con ...
- jQuery ajax跨域请求的解决方法
在Ajax应用中,jQuery的Ajax请求是非常容易而且方便的,但是初学者经常会犯一个错误,那就是Ajax请求的url不是本地或者同一个服务器下面的URI,最后导致虽然请求200,但是不会返回任何数 ...
随机推荐
- CentOS7系列--5.2CentOS7中配置和管理Docker
CentOS7配置和管理Docker Docker是操作系统级别的虚拟化工具,它能自动化布署在容器中的应用 1. 安装Docker 1.1. 安装Docker相关软件 [root@server1 ~] ...
- CentOS7系列--3.2CentOS7中配置iSCSI服务
CentOS7配置iSCSI服务 在网络上的存贮服务为iSCSI Target,而连接到iSCSI Target服务的叫iSCSI Initiator 1. 直接配置iSCSI Target服务 1. ...
- Difference between model.evaluate vs model.predict in Keras
The model.evaluate function predicts the output for the given input and then computes the metrics ...
- Flutter Stack布局中定位的方式
前言 想要记录一下Stack布局中,定位的两种方式 代码 //……省略无关代码…… child: new Column( children: <Widget>[ new SizedBox( ...
- C语言中的逗号表达式
转载:http://www.cnblogs.com/hnrainll/archive/2011/08/03/2126660.html C语言提供一种特殊的运算符——逗号运算符.用它将两个表达式连接起来 ...
- zabbix系列之八——安装后配置三Triggers
1Triggers(触发器) 描述 详细 备注 术语描述 1)触发器是评估监控项采集的数据的逻辑表达式,代表了当前系统状态. 2)触发器可定义一个什么数据是可接受的阈值,因此,如果接收的数据超过了可接 ...
- 分享:将WDCP中的PHP5.2 1.7升级到PHP 5.3的方法
将wdcp中php 5.2.17升级到php 5.3方法: 1.首先下载wdcp php5.3升级脚本 wget http://down.wdlinux.cn/in/php_up53.sh 2.进行安 ...
- selenium&PhantomJS笔记
配置pip文件 Windows下pip 配置文件的位置%HOME%/pip/pip.ini linux下安装pip,以Debian Linux为例su -apt-get install python- ...
- ORACLE闪回机制分析与研究应用
1.查看数据库归档和闪回状态,及环境准备SQL> archive log list;SQL> select flashback_on from v$database;关闭数据库,启动归档和 ...
- [翻译] VBFPopFlatButton
VBFPopFlatButton https://github.com/victorBaro/VBFPopFlatButton Flat button with 21 different states ...