什么是跨域?概念:
跨域是指一个域下的文档或脚本试图去请求另一个域下的资源,这里跨域是广义的。
除了请求自己的服务器之外,请求别人的服务器统称为跨域。
严格一点来说:只要“协议,域名,端口”有任何一个不一样,就被当作是跨域。
广义的跨域:
1.资源跳转:a链接,重定向,表单提交;
2.资源嵌入:link,script,img,frame等dom标签;
3.脚本请求:js发起的Ajax请求,dom和js对象的跨域操作等;
什么是同源策略;
同源策略是一种约定,有Netscape公司1995年引入的浏览器,它是浏览器最核心也最基本的安全功能,如果缺少了同源策略,浏览器很容易收到XSS/CSFR等攻击。
同源是指“协议+域名+端口”三者相同,即便两个不同的域名指向同一个ip地址,也非同源。
同源策略限制以下几种行为:
1.)Cookie、LocalStorage 和 IndexDB 无法读取
2.)DOM 和 Js对象无法获得
3.)AJAX 请求不能发送
常见跨域场景:
跨域的方式都有那些;
JSONP:
全称json with padding。它是一种非官方的协议,它允许在服务器端集成Script tags返回客户端,通过JavaScript callback的形式实现跨域访问。
Jsonp只能使用GET方式发起跨域请求,跨域请求需要服务配合,设置callback,才能完成跨域请求。
Jsonp发送的不是Ajax请求;
弊端:不能post传值。
Axios:
特性:
1.可以在浏览器中发送XMLHttpRequest请求;
2.可以在node.js发送http请求;
3.支持Promise API;
4.拦截请求和响应;
5.转换请求数据和响应数据;
6.能够取消请求;
7.自动转换json数据;
8.客户端支持保护安全免受XSRF攻击;
Ajax:
Ajax,意思就是用JavaScript执行异步网络请求。
跨域实现方法:
主要可以通过架设代理服务器,jsonp和cors三种方案实现跨域,用JavaScript写一个完整的Ajax代码并不复杂。但是需要注意,Ajax请求是异步执行的,也就是说,要通过回调函数获得响应。
Cors:
Cors是一个w3c标准,全称“跨域资源共享”。
普通跨域请求:只服务端设置Access-Control-Allow-Origin即可,前端无须设置,若要带cookie请求:前后端都需要设置。
它允许浏览器向跨源服务器发出XMLHttpRequest请求。
Cors发送的是真正的Ajax请求;Cors支持Ajax的跨域;
优点:
1.支持post以及所有http请求;
2.安全性相对jsonp更高;
3.前端做的事情比较少;
缺点:
1.不兼容旧版浏览器,如IE9及其以下;
2.需要服务端支持;
3.使用起来复杂了写;
正向代理:
用途:
1.访问原来无法访问的资源,如Google;
2.可以做缓存,加速访问资源;
3.对客户端访问授权,上网进行认证;
4.代理可以记录用户访问记录(上网行为管理),对外隐藏用户信息;
缺点:
安全性较低;
反向代理:
作用:
1.保护内网安全;
2.负载均衡;(负载均衡可以通过反向代理解决跨域问题,同时也是为服务器的性能进行优化)
为什么浏览器要限制跨域呢;
原因就是安全问题:如果一个网页可以随意地访问另外一个网站的资源,那么就有可能在服务端完全不知情的情况下出现安全问题。
LNMP:
Linux,Nginx,Mysql,Php;