在前后端配合开发的时候,常常遇到跨源资源共享(CORS)的问题,很是烦人。解决跨域的问题也有各种方案,在此介绍一个简单、无侵入的方案,快速利用Caddy配置出一个专门允许跨域的反向代理服务。
Caddy 是一个现代的Web服务器,配置简单,具有自动HTTPS等优点。
快速使用
1. 编写配置文件
创建Caddyfile文件,写入如下内容:
:2020 {
@options {
method OPTIONS
}
header {
Access-Control-Allow-Origin "{http.request.header.Origin}"
Access-Control-Allow-Credentials true
Access-Control-Allow-Methods *
Access-Control-Allow-Headers DNT,X-CustomHeader,Keep-Alive,User-Agent,X-Requested-With,If-Modified-Since,Cache-Control,Content-Type,Authorization
}
reverse_proxy 127.0.0.1:8080
respond @options 204
}
其中,:2020是Caddy服务的端口号,可以按需修改, 127.0.0.1:8080是要代理的服务的地址,也可以按需修改。
2. 安装Caddy
在macOS上安装很简单,只要有Homebrew的情况下, 直接运行如下命令即可安装:
brew install caddy
其他系统下的安装也很简单,可以查看官方说明。
3. 使用
在与配置文件(Caddyfile)的相同目录下运行如下命令即可:
# 启动
caddy start
# 停止
caddy stop
# 刷新配置
caddy reload