跨域

1. 为什么会有跨域问题？

浏览器的一种保护机制，为了防止用户个人信息等被攻击窃取，所以浏览器根据同源策略产生了跨域问题，服务器是没有跨域问题的，请求服务器，服务器都会返回数据，只是浏览器在拿到服务器返回的数据时，会不会返回给axios或者ajax请求的success而已
浏览器产生跨域问题，一般是报错CORS policy

2. 跨域怎么产生的？

只要一个请求URL中的协议，域名，端口三者之间任意一个与当前页面的URL不同，即为跨域

3. 跨域的几种解决办法

• JSONP
  由于script标签没有跨域问题，所以JSONP正是利用这一特点来解决跨域问题，服务器将数据和代码全部返给前端，在本地运行
  callback是为了告诉后端前端定义的方法名称，就是为了将方法名称写活，不用每次前后端都要定好方法名称
  后端
  
  前端
  
• CORS
  后端加一行代码即可解决跨域问题，不用前端做什么，但是这种方法会涉及到cookie的请求问题，则前后端都需要设置，前端的设置为axios.defaults.withCredentials=true这一行代码
  

• proxy代理
  应用最多的一种方法，应用的原理是，浏览器有跨域要求，服务器没有跨域要求，前后端同时都要设置
  
  
  vue.config.js文件
  设置changeOrigin为true
  
  还有一种方法是，找到config文件夹里面的index.js文件，给proxyTable设置changeOrigin为true
  

生产环境中没有proxy，用Ngnix反向代理，这是运维的事情，和前端没关系

最推荐用CORS方法，面试中只回答这一种方法就可以了

参考文章：https://segmentfault.com/a/1190000015597029

cors的后台设置

jsonp前端设置

proxy代理
vue项目中新建vue.config.js文件，文件名一定要叫这个，不能更改，在文件中modules.exports配置proxy的’/api’的target，changeOrigin
target是要请求的地址
changeOrgin设置为true，允许跨域，这个配置相当于vue脚手架帮你开启了一个隐藏的服务器，帮你转发了请求