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

    Time Limit: 10 Sec  Memory Limit: 128 MBSubmit: 132  Solved: 75 Description 水叮当得到了一块五颜六色的格子形地毯作为生日礼物 ...

  2. java 引用传递及基本应用

  3. UTF-8编码的空格(194 160)问题

    前台的字符串传递到后台进行处理,发现了一个较诡异的问题:字符串中的一个空格(ASCII:32)被UTF-8编码之后变成了一个诡异的字符(ASCII:194 和 160的组合)!但在后台其表象还是空格. ...

  4. Python 静态方法、类方法

    今天我们来讨论一下Python类中所存在的特殊方法--静态方法.类方法. 一.定义 静态方法: 一种简单函数,符合以下要求: 1.嵌套在类中. 2.没有self参数. 特点: 1.类调用.实例调用,静 ...

  5. Nodejs事件引擎libuv源码剖析之:句柄(handle)结构的设计剖析

    声明:本文为原创博文,转载请注明出处. 句柄(handle)代表一种对持有资源的索引,句柄的叫法在window上较多,在unix/linux等系统上大多称之为描述符,为了抽象不同平台的差异,libuv ...

  6. RabbitMQ学习系列(三): C# 如何使用 RabbitMQ

    上一篇已经讲了Rabbitmq如何在Windows平台安装,还不了解如何安装的朋友,请看我前面几篇文章:RabbitMQ学习系列一:windows下安装RabbitMQ服务 , 今天就来聊聊 C# 实 ...

  7. Java集合之HashSet

    1.HashSet概述: HashSet实现Set接口,由哈希表(实际上是一个HashMap实例)支持.它不保证set 的迭代顺序:特别是它不保证该顺序恒久不变.此类允许使用null元素.HashSe ...

  8. 美团HD(1)-设置导航栏主题

    自定义一个UINavigationController DJNavigationController.h #import <UIKit/UIKit.h> @interface DJNavi ...

  9. 期权定价公式:BS公式推导——从高数和概率论角度

    嗯,自己看了下书.做了点笔记,做了一些相关的基础知识的补充,尽力做到了详细,这样子,应该上过本科的孩子,只要有高数和概率论基础.都能看懂整个BS公式的推导和避开BS随机微分方程求解的方式的证明了.

  10. Form Builder的三种查询方法构建

    1.使用DEFAULT_WHERE: DECLARE   V_DEFAULT_WHERE VARCHAR2(32767);  V_WHERE         VARCHAR2(32767); BEGI ...