关于ajax跨域的一些解决方案
1、JSONP方式解决跨域问题
jsonp解决跨域问题是一个比较古老的方案(实际中不推荐使用),当然,在实际项目中如果要使用JSONP,一般会使用JQ等对JSONP进行了封装的类库来进行ajax请求
实现原理:
JSONP之所以能够用来解决跨域方案,主要是因为 <script> 脚本拥有跨域能力,而JSONP正是利用这一点来实现。
注意:
基于JSONP的实现原理,所以JSONP只能是“GET”请求,不能进行较为复杂的POST和其它请求,所以遇到那种情况,就得参考下面的CORS解决跨域了(所以如今它也基本被淘汰了)
2、CORS解决跨域问题
在Node.js后台配置(express框架)
Node.js的后台也相对来说比较简单就可以进行配置。只需用express如下配置:
app.all('*', function(req, res, next) {
res.header("Access-Control-Allow-Origin", "*");
res.header("Access-Control-Allow-Headers", "X-Requested-With");
res.header("Access-Control-Allow-Methods", "PUT,POST,GET,DELETE,OPTIONS");
res.header("X-Powered-By", ' 3.2.1')
//这段仅仅为了方便返回json而已
res.header("Content-Type", "application/json;charset=utf-8");
if(req.method == 'OPTIONS') {
//让options请求快速返回
res.sendStatus(200);
} else {
next();
}
});
3、代理请求方式解决接口跨域问题
注意,由于接口代理是有代价的,所以这个仅是开发过程中进行的。
与前面的方法不同,前面CORS是后端解决,而这个主要是前端对接口进行代理,也就是:
前端ajax请求的是本地接口
本地接口接收到请求后向实际的接口请求数据,然后再将信息返回给前端
一般用node.js即可代理
关于如何实现代理,这里就不重点描述了,方法和多,也不难,基本都是基于node.js的。
关于ajax跨域的一些解决方案的更多相关文章
- ajax 跨域访问的解决方案
ajax 跨域访问的解决方案 一.什么是跨域: 1.什么样的请求属于跨域: 域名,端口有任何一个不相同都属于跨域: 二.跨域的常用几种解决方案: 1.jsonp: 2.iframe: 3.webcon ...
- Ajax跨域问题及解决方案 asp.net core 系列之允许跨越访问(Enable Cross-Origin Requests:CORS) c#中的Cache缓存技术 C#中的Cookie C#串口扫描枪的简单实现 c#Socket服务器与客户端的开发(2)
Ajax跨域问题及解决方案 目录 复现Ajax跨域问题 Ajax跨域介绍 Ajax跨域解决方案 一. 在服务端添加响应头Access-Control-Allow-Origin 二. 使用JSONP ...
- PHP Ajax 跨域问题最佳解决方案 【摘自菜鸟教程】
PHP Ajax 跨域问题最佳解决方案 分类 编程技术 http://www.runoob.com/w3cnote/php-ajax-cross-border.html 本文通过设置Access-Co ...
- ajax跨域原理以及解决方案
说明 跨域主要是由于浏览器的“同源策略”引起,分为多种类型,本文主要探讨Ajax请求跨域问题 前言 强烈推荐阅读参考来源中的文章,能够快速帮助了解跨域的原理 参考来源 本文参考了以下来源 浏览器同源政 ...
- [转载]JQuery的Ajax跨域请求的解决方案
今天在项目中需要做远程数据加载并渲染页面,直到开发阶段才意识到ajax跨域请求的问题,隐约记得Jquery有提过一个ajax跨域请求的解决方式,于是即刻翻出Jquery的API出来研究,发现JQuer ...
- ajax跨域访问的解决方案
今天的工作中要访问摄像机内部的一个web站点,这就涉及到jquery的ajax跨域访问的问题.我使用的是jquery1.7的版本,下面总结如下: 问题一:一开始用IE调试,总是返回No Transpo ...
- 有关Ajax跨域请求的解决方案
前言 最近博主在赶项目进度.所以微信二次开发那边的博文一直没有更新.后续时间会慢慢记录这个学习历程的.来年公司要开发微信小程序.到时也会记录一下历程. 闲话少说,今天在工作中遇到了SpringMVC接 ...
- Ajax跨域问题及解决方案
目录 复现Ajax跨域问题 Ajax跨域介绍 Ajax跨域解决方案 一. 在服务端添加响应头Access-Control-Allow-Origin 二. 使用JSONP解决 小结 复现Ajax跨域问题 ...
- ajax跨域问题以及解决方案
转:https://blog.csdn.net/csdn_ds/article/category/6937392/3 在工作中,大家应该都遇到过ajax跨域问题,浏览器的错误如下: XMLHttpRe ...
- ajax跨域请求的解决方案
一直打算改造一下自己传统做网站的形式. 我是.Net程序员,含辛茹苦数年也没混出个什么名堂. 最近微信比较火, 由于现在大环境的影响和以前工作的总结和经验,我打算自己写一个数据,UI松耦合的比较新潮的 ...
随机推荐
- mvc 之 学习地址
https://blog.csdn.net/mss359681091/article/details/52135861
- non-ZenoAndAcceptingLocation
PATTERN系列的番外篇 对non-Zeno的概念进行了明晰 accepting:if infinitely often the same state non-Zeno:if time diverg ...
- 20175312 2018-2019-2 《Java程序设计》第5周学习总结
20175312 2018-2019-2 <Java程序设计>第5周学习总结 教材学习内容总结 已依照蓝墨云班课的要求完成了第六章的学习,主要的学习渠道是PPT,和书的课后习题. 总结如下 ...
- Kaggle比赛NCFM图像分类任务简介
为了保护和监控海洋环境及生态平衡,大自然保护协会(The Nature Conservancy)邀请Kaggle社区的参赛者们开发能够出机器学习算法,自动分类和识别远洋捕捞船上的摄像头拍摄到的图片中鱼 ...
- Nginx教程--02.Nginx虚拟主机的配置
1.Nginx虚拟主机的配置 1.1 在conf目录下,使用命令 : vim nginx.conf 对上图解释: //全局区 worker _processes 1; //表示当前有1个工作的子进程, ...
- 使用RStudio调试(debug)基础学习(一)
点击行号的左侧,即可设置断点(或者按下Shift+F9),如果没有出现,反而出现下图的警告: 那么只是因为我的坏习惯--写一段脚本测试的时候都是新建,但不save到本地,不喜欢保存,写的差不多了才开始 ...
- 特效 左右滑动轮播图jQuery思路
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...
- ES6的小知识(后半部分)
一.iterator和for-of循环 在js里有数组和对象,es6又新出现了set和map这样js就有了四种数据集合,这样可以组合使用他们,比如数组里拥有对象,set等,这样就需要一个统一的 接口机 ...
- 整合MyBatis(springboot)
pom文件: <dependency> <groupId>org.mybatis.spring.boot</groupId> <artifactId>m ...
- SASS 简单实用
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...