vue.js - 如何在应用程序内获取开发服务器代理目标？

Question

我iframe在应用程序中使用，我不知道如何src通过开发服务器代理它，因此我正在做

const origin = process.env.NODE_ENV === 'production' ? location.origin : 'http://192.168.1.2:8081'

为了iframe在开发模式下工作，'http://192.168.1.2:8081'这里是硬编码的，我正在寻找一种方法来重用 webpack 开发服务器代理目标，一个类似的 API ，getProxyTarget()但是如果可以代理，那就更好了！iframesrc

vue.config.jsdevServer配置：

{
  port: 8055,
  proxy: {
    '/api': {
      pathRewrite: {
        '^/api': '',
      },
      target: 'http://192.168.1.2:8081',
      ws: true,
      changeOrigin: true,
    },
  },
}

Answer 1

我最终创建了一个环境变量：

VUE_APP_PROXY_TARGET='http://192.168.1.2:8081'

并在应用程序中使用它：

process.env.VUE_APP_PROXY_TARGET