刚刚接触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跨域请求时遇到的问题的更多相关文章

  1. 为什么返回的数据前面有callback? ashx/json.ashx?的后面加 callback=? 起什么作用 js url?callback=xxx xxx的介绍 ajax 跨域请求时url参数添加callback=?会实现跨域问题

    为什么返回的数据前面有callback?   这是一个同学出现的问题,问到了我. 应该是这样的: 但问题是这样的: 我看了所请求的格式和后台要求的也是相同的.而且我也是这种做法,为什么他的就不行呢? ...

  2. ajax跨域请求时,sessionId不一样,导致无法记住登陆状态

    遇到这样一个场景,就是前端的域是dev,请求接口时,接口的域是beta,即使在服务端设置了cookie存放的域,'COOKIE_DOMAIN'   =>  '.roboming.com',虽然c ...

  3. ajax 跨域请求时url参数添加callback=?会实现跨域问题

    例如: 1.在 jQuery 中,可以通过使用JSONP 形式的回调函数来加载其他网域的JSON数据,如 "myurl?callback=?".jQuery 将自动替换 ? 为正确 ...

  4. SpringMvc+ajax跨域请求时,出现options类型的请求并返回403的解决方案

    在使用 $.ajax({ url:'http://127.0.0.1:8081/rest/ccxxx/xxxx', type:'POST', dataType:"json", co ...

  5. Ajax跨域请求,设置content

    在使用Ajax跨域请求时,如果设置Header的ContentType为application/json,会分两次发送请求.第 一次先发送Method为OPTIONS的请求到服务器,这个请求会询问服务 ...

  6. ASP.NET MVC 实现AJAX跨域请求方法《1》

    ASP.NET MVC 实现AJAX跨域请求的两种方法 通常发送AJAX请求都是在本域内完成的,也就是向本域内的某个URL发送请求,完成部分页面的刷新.但有的时候需要向其它域发送AJAX请求,完成数据 ...

  7. webapi 解决ajax跨域请求问题

    webapi在配置文件中加入这几句就可以解决ajax(同源策略是JavaScript里面的限制,其他的编程语言,比如在C#,Java或者iOS等其他语言中是可以调用外部的WebService,也就是 ...

  8. Nginx 实现AJAX跨域请求

    在工作中遇到跨域请求的问题: AJAX从一个域请求另一个域会有跨域的问题.那么如何在nginx上实现ajax跨域请求呢?要在nginx上启用跨域请求,需要添加add_header Access-Con ...

  9. jQuery ajax跨域请求的解决方法

    在Ajax应用中,jQuery的Ajax请求是非常容易而且方便的,但是初学者经常会犯一个错误,那就是Ajax请求的url不是本地或者同一个服务器下面的URI,最后导致虽然请求200,但是不会返回任何数 ...

随机推荐

  1. 深度学习GPU集群管理软件 OpenPAI 简介

    OpenPAI:大规模人工智能集群管理平台 2018年5月22日,在微软举办的“新一代人工智能开放科研教育平台暨中国高校人工智能科研教育高峰论坛”上,微软亚洲研究院宣布,携手北京大学.中国科学技术大学 ...

  2. RESTful API的十个最佳实践

    WebAPI在过去几年里非常的盛行,我们很多以往的技术手段都慢慢的转换为使用WebAPI来开发,因为它的语法简单规范化,以及轻量级等特点,这种方式收到了广泛的推崇. 通常我们使用RESTFul(Rep ...

  3. webapp开发绝对定位引发的问题

    最近做了一个webapp 需求是要滑动页面翻页,我使用了大量绝对定位 当遇到输入框时,在部分手机上发现了问题.虚拟键盘收回时,整个body全部下移了,经过多次测试, 发现是fixed布局的音乐按钮造成 ...

  4. C语言中的逗号表达式

    转载:http://www.cnblogs.com/hnrainll/archive/2011/08/03/2126660.html C语言提供一种特殊的运算符——逗号运算符.用它将两个表达式连接起来 ...

  5. Linq排序方式与Lambda排序方式比较以及OrderBy、ThenBy的使用

    沿用之前某一篇文章的实体类与EF操作类代码.数据库中增加几条数据 Linq 的排序方式,下面例子是根据RoleId 升序,Name降序 EFContext<Member> efMember ...

  6. 转:oracle 事务

    原文地址:http://blog.csdn.net/junmail/article/details/5556561 关于Oracle事务的总结 1.什么是事务,事务的特性是什么? 事务的任务便是使数据 ...

  7. Unity调用安卓中的方法遇到的问题

    最近在用U3D做一个简单的迷宫游戏,在项目中利用Unity制作游戏场景,在android中调用游戏场景,并在游戏结束后调用安卓方法,传递参数,退出游戏场景 查找网上资料,基本上Unity调用安卓的写法 ...

  8. Linux通过docker安装运行酷Q--用QQ骰子君进行跑团

    Linux通过docker安装运行酷Q 文:铁乐与猫 需求:和小伙伴周末进行愉快的TRPG跑团,需要在QQ讨论组上加了qq小号后,将qq小号用酷Q配合投骰的应用变成骰子君. 限制:我个人的云计算服务器 ...

  9. 华为18.9.5校招笔试题AK

    26进制加法(一) 'a'-'z'代表十进制的0-25,求26进制加法.例如 'z'+'bc'= 'cb' 博主思路: 首先将长度不同的字符串高位补'a' 从低位开始将字符转换为10进制相加 计算进位 ...

  10. Python简单实现多级菜单

    # -*- coding: utf-8 -*- # @Time : 2018-06-01 13:40 # @Author : 超人 # @Email : huxiaojiu111@gmail.com ...