使用axios等引起的跨域问题，及跨域auth

很久没写了，最近在搞微服务的东西，欠下很多文章，后期慢慢补~~
在开发vue项目的时候，经常碰到的一个问题就是跨域的问题，因为我们很可能要给前端项目一个独立的域名，这样我们在请求后端接口的时候，就会引起跨域的问题。这个问题需要前后端一起更改，下面以axios为例说一下解决的方案（其他的解决方式大同小异）。
部署好axios之后，我们先发起一个请求到服务端，发现axios会先发起一个OPTIONS类型的请求到服务端，也就是一个诊断请求。如果发现服务端不支持跨域，或者不支持我们自定义的请求头部，axios就会返回一个错误信息，这个时候我们查看控制台，会得到类似下面的信息：
Response to preflight request doesn’t pass access control check: No ‘Access-Control-Allow-Origin’ header is present on the requested resource
这个时候我们需要两个配置
1. 在axios里面配置
axios.defaults.headers.post[‘Content-Type’] = ‘application/x-www-form-urlencoded’; 表明axios发送数据的方式使x-www-form-urlenconded
2.在服务端设置返回的头部信息，以PHP为例：
header(“Access-Control-Allow-Origin: *”);
这个时候已经基本okay了，但是如果我们需要跨域的auth，这样的配置还不够。因为auth认证，我们需要定义自己的请求头部，Authorization。我们先在axios中增加一个配置项（以Basic认证为例）：
axios.defaults.auth = {username: ‘test’,password: ‘123456’}
这时，我们的所有axios正式请求，就会附带Authorization这个请求头部了。现在发起请求，发现还是不行。原因前面已经说了，axios会先发起一个OPTIONS请求，而且这个请求只是添加了一个自定义的请求头部信息，类似这样：
Access-Control-Request-Headers:authorization，而且仔细查看请求信息，并没有我们自定义的Authorization，因为OPTIONS并不会附带详细的请求信息，这点查看http中OPTIONS的定义就知道了，所以服务端需要针对OPTIONS做一个特殊操作，即“不验证”，直接通过，类似下面的PHP代码：

   if ($_SERVER['REQUEST_METHOD'] == 'OPTIONS') {
       return true;
   }

这样axios第一遍（OPTIONS）的请求就会正常返回，也保证了后续请求的正常进行。
大致就是这样，欢迎大家批评指正。