本地调试技巧：用Caddy搭建简易服务器反向代理

如果是bug调试什么的使用vscode的调试功能就好，但是有一些第三方服务有安全限制非要在https的正式域名下面才能触发，这样想调试第三方服务的代码就会很烦，因为本地没有办法知道上线效果。 因此考虑在本地使用caddy搭建简易服务器做反向代理到正式环境的域名。这样访问正式环境时候实际上访问到我们的本地。 本教程适用Mac。

生成Https证书

可以使用 mkcert 进行本地证书配置。因为要映射到正式域名，所以先生成证书，后面的服务器配置会用到。 现在就先假设我要映射的域名是：yuming.com，测试环境域名：xxx-test.yuming.com

1. 安装mkcert

brew install mkcert

2. 初始化

mkcert –install

3. 生成对应域名证书

可以直接生成顶级域名证书

现在就先假设我要映射的域名是：yuming.com，测试环境域名：xxx-test.yuming.com

mkcert "*.yuming.com"
mkcert "*.yuming.cn"

生成完的证书就放在./certs/xxx.pem酱紫就行了。就是根目录下面新建一个certs目录。怎么知道是不是根目录呢，就打开终端，打开终端的时候终端在的那个目录就是根目录，一般就是以你用户名开头的那个文件夹啦。就像下面这样。Mac就是访达里标着🏠的那个文件夹。

安装caddy

brew install caddy

caddy安装后的目录在homebrew下面，路径为：

• /opt/homebrew/opt （M1 Mac）
• /usr/local/etc/Caddyfile（Intel Mac）

配置caddyFile

官方文档有写一点配置：https://caddyserver.com/docs/caddyfile 可以去找一下，找到之后需要配置Caddyfile，也就是caddy的配置文件。我自己是新建了一个caddyFile放在了/opt/homebrew/etc/Caddyfile这里下面。（因为找到的各种破教程太多根本分不清楚，干脆直接自己新建了一个）。 就是酱紫。

通过Caddyfile文件来配置相关服务器行为，这里需要将 之前生成的https证书 放到相对应的目录，然后在配置文件配置tls路径；记得比对域名证书名称路径是否一致。 然后上面我们的certs证书目录就是在根目录下嘛，所以下面就直接./certs就可以找到对应的证书文件路径了。

*.yuming.com {
# 针对*.yuming.com的域名配置证书
tls ./certs/yuming.com.pem ./certs/yuming.com-key.pem

# yuming test域名
@yuming_test {
host xxx-test.yuming.com
}

# yuming prod域名
@yuming_prod {
host xxx.yuming.com
}

# 反向代理
reverse_proxy @yuming_test localhost:3000
reverse_proxy @yuming_prod localhost:3000
}

# 静态资源托管
*.yuming.cn {
tls ./certs/yuming.cn.pem ./certs/yuming.cn-key.pem

try_files {path} /index.html
root * ./dist
file_server browse
}

启动Caddy

指令文档：https://caddyserver.com/docs/command-line 使用指定config运行（跑这个命令就可以启动了）

// 启动
caddy run —config /opt/homebrew/etc/Caddyfile
// 重启
caddy reload —config /opt/homebrew/etc/Caddyfile

下面酱紫： 如有其他问题可查找/var/log/caddy日志目录。 还有可以在Caddyfile同级目录下运行，caddy run也可以启动服务器。

配置本地host映射

经过上面两步已经可以搭建一个映射服务器了，但是如果我们访问yuming.com，还是不能直接访问到本地，还需要再配置本地的host映射。

通常是因为DNS解析的问题 在未配置host映射前，域名还没有正确地解析到Caddy服务器的IP地址。因此，需要在本地的hosts文件中手动配置，指向我们服务器的IP地址。这是在DNS记录还未生效或者在内网测试时常用的手段。

安装switchhosts

推荐下载一个可视化的配置工具switchhosts 配置域名解析到本机即可。之后打开关闭啥的就好了

# 测试环境
127.0.0.1 xxx–test.yuming.com

# 正式环境
127.0.0.1 xxx.yuming.com

经过如上三步就可以映射生产域名到本地了。