持续创作，加速成长！这是我参与「掘金日新计划 · 6 月更文挑战」的第3天，点击查看活动详情

1.同源

官方文档传送门:developer.mozilla.org/zh-CN/docs/…

同源策略（英文全称 Same origin policy）是浏览器提供的一个安全功能。浏览器的同源策略规定：不允许非同源的 URL 之间进行资源的交互。

同源指的是两个 URL 地址具有相同的协议、主机名、端口号。

为什么要有同源与不同源？

出于安全考虑，浏览器不允许，页面向不同源的接口请求数据，因为如果 接口 和 网页不同源，浏览器认为是2个不同的 服务器，

不同的服务器中内容是不可控的，是不允许访问的

如果不一致呢?那就好比你去小米官方旗舰店,点名要买苹果手机一样,那就是跨域啦!

2.跨域

跨域指的是两个 URL 地址的协议、主机名、端口号三者中有一个或多个不同。出现跨域的根本原因：浏览器的同源策略不允许非同源的 URL 之间进行资源的交互。

2.1跨域请求的报错

需要注意的是:请求是跨域的，但是并不一定会报错。普通的图片请求，css文件请求是不会报错的

而跨域请求出现错误的条件： 浏览器同源策略  &&  请求是ajax类型

敲黑板啦!!!!

只要是出现跨域问题，浏览器就会出现一个固定格式(没有之一)的报错信息

Access to XMLHttpRequest at '服务器url地址' from origin 'null' has been blocked by CORS policy: No 'Access-Control-Allow-Origin' header is present on the requested resource.

2.2跨域的几种解决方案

第一种:原生JSONP方式去发请求（jsonp不是ajax请求）

第二种jQuery中的jsonp

第三种:CORS技术

第四种:谷歌浏览器设置

第五种:Vue-Cli配置代理转发

今天太晚了!明天更新--------详解跨域的五钟解决方案