几乎每种浏览器都存在默认的安全机制,都有同源策略,因为浏览器恶意的把每个外部请求的都当做是黑客攻击,相当于是对自身的保护,所以浏览器在运行脚本时会判断脚本与请求的页面是否是同一来源,这个同一来源,包括1、协议,2、地址,3、端口,只有三者都相同才被认为是同一来源。

解决方案:1,在服务器端的响应头中添加一个http参数:
res.setHeader("Access-Control-Allow-Origin", "*");
res.setHeader('Access-Control-Allow-Methods', 'PUT, GET, POST, DELETE, OPTIONS');
用于告诉客户端可以访问这个跨域的资源,但是问题又来了,知道HTTP协议的同学都清楚,http是一种无状态的基于请求响应的协议,每次的请求都是全新的,服务器无法保持状态,这时我们可以利用服务器的session机制:
session是服务器的一个内存空间,当一个客户端访问服务器时,服务器会为这个客户端创建一个唯一
的空间,并且给定一个编号,这个编号就是sessionid,在响应客户端时,在响应头中加入了cookie.sessionid=xxxx,将这个cookie响应给客户端,当这个客户端下一次请求服务器时,客户端会自动将cookie写到请求头中发送给
给服务器,,服务器接受到这个请求之后,从请求头中取出这个sessionid,这样就可以判断是哪一个用户了。但是,问题又来了,如果出现跨域,服务器响应时写了res.setHeader("Access-Control-Allow-Origin", "*");,
客户端就会忽略本地的cookie,从而向服务器发送请求时不再发送cookie,这个服务器找不到cooie,就会认为你是个新用户,哪怕你已经请求过N次。 解决方案:JSONP 原理:Web页面上调用js文件时则不受是否跨域的影响(不仅如此,凡是拥有”src”这个属性的标签都拥有跨域的能力,比如<script>、<img>、<iframe>);
所以,我们可以这样做,在客户端声明一个处理json的函数,这个函数作为参数传给服务器,由服务器调用服务器生成动态的调用代码,并且把想要传给客户端的json数据作为实参注入)
jQuery已经为我们做好了一切,我们只需调用即可
例如:
客户端代码:
$.ajax({
type: "GET",
url: "服务器处理地址",
dataType:"jsonp",
jsonp: "callback",//传递给请求处理程序或页面的,用以获得jsonp回调函数名的参数名(一般默认为:callback)
jsonpCallback:"handle",//自定义的jsonp回调函数名称,默认为jQuery自动生成的随机函数名,也可以写"?",jQuery会自动为你处理数据
success: function( data){
alert( 'helloworl '+ data.count );
} ,
error: function(msg){
alert( msg);
}
}); //回调函数,由服务器端调用的函数
function handle( jsonResult ){
//处理
} 服务器代码:
//先取得传过来的回调函数名
var cb=request.callback; //要传送给客户端的 json数据
var jsonobj=xxx res.send("("+jsonobj+");");//即生成类似于 handle(jsonobj); 后发送给客户端

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请求跨域问题

    ajax跨域,这个是面试的时候常被问到,也是在做项目的时候会遇到的问题,在之前的项目中就有遇到过,这里根据经验写了三种分享下 1.使用中间层过渡的方式 简单来说就是"后台代理",把 ...

  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. JavaScript 中 Number()、parseInt()、parseFloat()的区别

    Number(): 概述:Number 对象由 Number() 构造器创建,是经过封装的能让你处理数字值的对象.在非构造器上下文中 (如:没有 new 操作符),Number 能被用来执行类型转换. ...

  2. virtualbox设置共享文件夹代替sftp同步代码

    通常的开发场景: 代码放在virtualbox上运行,本地的IDE通过sftp实现和虚拟机的代码同步. 有 一个不能避免的问题是,当使用git时,如果装在virtualbox端,那么每次virtual ...

  3. webstorm 更改默认服务器端口

    File ->Settings              Build,Execution,Deployment->Debugger 如下图 找到Debugger

  4. ThinkPHP的URL访问

    url访问 http://www.kancloud.cn/manual/thinkphp5/118012 ThinkPHP5.0在没有启用路由的情况下典型的URL访问规则是: http://serve ...

  5. 调用手机在线API获取手机号码归属地信息

    手机在线(www.showji.com)始创于2001年,发展至今已拥有国内最准确.号段容量最大的手机号码归属地数据库系统, 目前号段容量将近33万条,每月保持两次以上规模数据更新,合作伙伴包括:百度 ...

  6. Android之自定义侧滑菜单

    先来上图: 我们把主界面从左向右拉动,可以看到地下有一层菜单页,从透明渐渐变得不透明,从小渐渐变大,感觉上觉得菜单页是从屏幕外面被拉到屏幕中的.下面的代码实现这个DEMO: 首先是自定义控件Slidi ...

  7. Linux系统下配置环境变量

    一.环境变量文件介绍 转自:http://blog.csdn.net/cscmaker/article/details/7261921 Linux中环境变量包括系统级和用户级,系统级的环境变量是每个登 ...

  8. Android Studio开发Android应用如何签名

    1.使用jdk自带的工具生成keystore 使用cmd命令行进入到jdk的bin目录(比如:C:\Program Files\Java\jdk1.7.0_01\bin) 运行如下命令: C:\Pro ...

  9. GSM07.10协议中串口复用使用的校验算法

    ] = { 0x00, 0x91, 0xE3, 0x72, 0x07, 0x96, 0xE4, 0x75, 0x0E, 0x9F, 0xED, 0x7C, 0x09, 0x98, 0xEA, 0x7B ...

  10. 高程三:Array

    一:Array数组 1.Array.isArray(参数) 检测是否是数组,*不兼容IE8,兼容IE9及以上.Chrome.Firefox等,要兼容IE8,可以用 Object.prototype.t ...