我早就想写了，之前部署遇到了很多问题，也没有记录，现在简单记录几个比较重要的点。

后端用go写的，打包为可执行文件，配置文件设置release模式就可以了，没有什么坑点，前端倒是在部署上线有不少问题。

部署后刷新404问题

在nginx的配置文件中加入如下配置

config
#vue 路由重定向到index.html的配置，用于解决vue页面在浏览器刷新后404的问题
    location / {
         try_files $uri $uri/ /index.html;
    }

这是因为vue打包后是单页应用，任何路由都在index.html这个文件中，刷新后的路由无法直接找到，需要将任何路由都重定向到index文件。

部署后调用跨域api接口问题

在本地测试可以在vite.json中配置代理，如：

json
    server: {
      proxy: {
        '/bgmapi': {
          target: 'https://api.bgm.tv',
          changeOrigin: true,
          rewrite: (path) => path.replace(/^\/bgmapi/, '')
        },
        '/api':{
          target: 'http://digbgmapi.masterkagami.com',
          changeOrigin: true,
          rewrite: (path) => path.replace(/^\/api/, '')
        }
      },
      port: process.env.DIGBGM_PORT
    }

然后再axios中定义两个baseURL

vue
const bangumiService = axios.create({
  baseURL: '/bgmapi'
})
const digbgmService = axios.create({
  baseURL: '/api'
})

通过axios.bangumiService和axios.digbgmService的方式使用这两个跨域地址。

这在开发环境是完全ok的，但是线上部署的生产环境我们是通过nginx服务器的，代理是无法生效的，目标url不会自动转发。

解决方法为为nginx配置反向代理，将我们想跨域请求的地址反带到目标地址。
例：
代理目录：/api/
目标URL: http://api.bgm.tv
发送域名： api.bgm.tv