跨域问题
CORS(Cross-Origin Resource Sharing,跨源资源共享),也叫跨域资源共享,是一种基于HTTP头的机制,该机制通过允许服务器标示除了它自己以外的其他源(域、协议或端口),使得浏览器允许这些源访问加载自己的资源。
出现跨域问题的主要原因是同源策略的限制。同源策略是浏览器的一种安全策略,是浏览器的行为,而且只针对fetch、xhr请求。只要协议、主机、端口之一不一致,就不同源。
响应头解决
要实现CORS很简单,只需在服务端添加响应头:Access-Control-Allow-Origin: *
代理解决
前端服务器若是用express的话,只需安装一个插件:npm i http-proxy-middleware --save-dev
,然后在express服务器启动代码中加入:
import {createProxyMiddleware} from 'http-proxy-middleware'
// ...
app.use('/api', createProxyMiddleware({ target: 'http://localhost:8080', changeOrigin: true }))