如何解决跨域请求的问题
来源:互联网 发布:ubuntu内核 编辑:程序博客网 时间:2024/06/06 17:50
首先介绍一下什么叫跨域?
访问同源的资源是被浏览器允许的,但是如果访问不同源的资源,浏览器默认是不允许的。访问不同源的资源那就是我们所说的跨域。
那为什么会有跨域的产生呢?
原来这是浏览器的一个策略----“同源策略”。
1. 什么是同源策略(Same Origin Policy)?
所谓同源策略,它是浏览器的一种最核心最基本的安全策略。它对来至不同源的文档或这脚本对当前文档的读写操作做了限制。
为什么要有这个策略,想必你已经知道,那就是因为保证用户的信息安全。
2. 假如没有同源策略
假设现在有a.com和b.com两个域,如果没有这一安全策略,那么当用户在访问a.com时,a.com的一段脚本就可以在不加载b.com的页面而随意修改或者获取b.com上面的内容。这样将会导致b.com页面的页面发生混乱,甚至信息被获取,包括服务器端发来的session。这样的话,我们的web世界将是一片混乱。也是因为浏览器的同源策略,保证来至不同源的对象不会互相干扰,保证了我们访问页面最基本的安全。
重点是我们有跨域请求数据的需要时,如何解决这个问题呢?(下面介绍两种方法(本文重点)):
第一种方法:jquery 的jsonp
javascript代码:
<script> $.ajax({ url:"http://127.0.0.1:4000/kuayu?&callback=?", type:"get", dataType:"jsonp", jsonpCallback:"hello", success:function (data) { console.log("Hello,"+ data.name +"!"); } })</script>node.js代码:
router.get("/kuayu",function (req,res) { if(req.query.name){ res.send(req.query.callback+'({"name":"'+req.query.name+'"})'); } else{ res.send(req.query.callback+'({"name":"user"})'); }});
第二种方法:利用javascript的src可跨域的特性
javascript代码:
<script> function hello (data) { console.log("Hello,"+ data.name +"!"); }</script><script src="http://127.0.0.1:4000/kuayu?name=king&callback=hello" type="text/javascript"></script>node.js代码:
router.get("/kuayu",function (req,res) { if(req.query.name){ res.send(req.query.callback+'({"name":"'+req.query.name+'"})'); } else{ res.send(req.query.callback+'({"name":"user"})'); }});跨域的方法都需要服务端(后端)的配合
阅读全文
0 0
- 如何解决跨域请求的问题
- 解决webservice的跨域请求问题
- django解决跨域请求的问题
- 解决跨域请求问题
- 如何解决get请求URL地址的中文参数问题
- 如何解决Ajax请求结果的缓存问题说明
- 解决同域Nginx ajax 请求跨域的问题
- 通过jsonp解决ajax的跨域请求问题
- Tomcat下 解决Ajax请求跨域的问题
- JSONP解决js跨域请求的问题
- 解决JQuery的Ajax请求跨域问题
- 通过jsonp解决ajax的跨域请求问题
- 通过jsonp解决ajax的跨域请求问题
- 完美解决ajax跨域请求的问题
- 通过jsonp解决ajax的跨域请求问题
- 解决asp.net mvc的跨域请求问题
- 关于ajax post请求跨域问题的解决心得
- 解决axios跨域请求出错的问题
- LeetCode Problem 424: Longest-Repeating-Character-Replacement
- Java IO
- UVa 536 Tree Recovery
- BZOJ 4791: [CERC2016]Free Figurines 模拟
- 职场10大潜规则
- 如何解决跨域请求的问题
- ADB 过滤activity 关键字
- CODEVS--1201 最小数和最大数
- 浅谈模板类vector和array
- c++ 遍历文件夹函数
- <% %>,<%= %>与<%! %>的用途
- android 记录笔记
- Java注释、常用分隔符以及标识符命名规则
- Mac OS 安装Qt 编译时提示 running /usr/bin/xcodebuild