看完你就明白前后端分离项目中的跨域问题怎么解决了！

谈谈前后端分离中的跨域问题

在前后端分离开发过程中常常出现下面这样的错误提示：

Access to XMLHttpRequest at 'http://127.0.0.1:8000/apis/users/login/' from origin 'http://127.0.0.1:8080' has been blocked by CORS policy: Response to preflight request doesn't pass access control check: No 'Access-Control-Allow-Origin' header is present on the requested resource.
HelloWorld.vue?18db:50 err Error: Network Error
    at createError (createError.js?16d0:16)
    at XMLHttpRequest.handleError (xhr.js?ec6c:91)
复制代码

看到关键字CORS、Access-Control-Allow-Origin 可以判断基本上就是跨域相关的错误了。

不了解的人常常一头雾水，本文咱们就来具体探讨下这种跨域问题，彻底搞懂它，解决它。

什么是跨域？造成跨域的原因？

跨域问题是由浏览器的同源策略引起的，在后端编程语言的Http Client调用中不会存在。同源策略中的同源是说站点的协议、域名、端口都需要相同。