谈谈前后端分离中的跨域问题
在前后端分离开发过程中常常出现下面这样的错误提示:
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调用中不会存在。同源策略中的同源是说站点的协议、域名、端口都需要相同。