vue 开发模式可以访问代理,打包后访问失败

在Vue的开发模式下，可以通过配置代理实现跨域访问，即在开发环境中，可以通过代理服务器将请求先转发给目标服务器，然后在返回结果给前端应用。这样可以解决开发过程中的跨域问题。

但是在打包后的生产环境中，由于前端应用已经被打包成静态文件，并放置在一个服务器上，无法再使用代理服务器进行转发。这意味着代理配置将不再生效，因此无法通过代理来访问其他服务器。

在生产环境中，可以考虑通过nginx等反向代理服务器来将请求转发给目标服务器。或者，如果目标服务器允许跨域访问，可以直接在前端应用中发送请求到目标服务器进行访问。

总而言之，在Vue的开发模式下，可以通过配置代理实现跨域访问，但在打包后的生产环境下，需要采用其他方式来解决跨域问题。

相关问题

vue访问后台地址 打包后不正确

当使用vue构建应用程序并将其打包之后，在访问后台地址时会遇到一些问题。主要是由于vue打包时会将所有的资源文件压缩并打包在一起，包括应用程序中所使用的JS、CSS和HTML等文件。但是，如果后台地址是在服务器上而不是与应用程序一起打包的，则需要手动配置后台地址。

为了解决这个问题，需要在打包时将后台地址配置为动态地址，这样可以在部署时根据实际情况进行配置。可以在vue的配置文件中进行配置。在vue.config.js文件中，可以添加一个proxyTable选项，用于配置代理表，将请求转发到后端服务器。例如，如果要将所有/api开头的请求转发到后端服务器，可以这样配置：

module.exports = {
  devServer: {
    proxy: {
      '/api': {
        target: 'http://localhost:8080', //后端服务器地址
        changeOrigin: true,
        pathRewrite: {
          '^/api': ''
        }
      }
    }
  }
}

这样配置之后，在打包应用程序时，后台地址就不需要手动配置了。而是通过代理表进行转发。如果部署时需要更改后台服务器地址，只需要在配置文件中修改target选项即可。

综上所述，如果vue访问后台地址打包后不正确，应该检查是否手动配置了后台地址，并且是否使用了固定的地址，如果是，则需要将后台地址配置为动态地址，通过代理表进行转发。

vue项目打包后代理

Vue项目打包后的代理设置可以通过配置`vue.config.js`文件来实现。下面是一个示例：

module.exports = {
  devServer: {
    proxy: {
      '/api': {
        target: 'http://localhost:3000', // 设置代理目标地址
        changeOrigin: true, // 开启跨域
        pathRewrite: {
          '^/api': '' // 重写路径，去掉/api前缀
        }
      }
    }
  }
}

在上述示例中，我们将`/api`路径下的请求代理到`http://localhost:3000`地址上。通过设置`changeOrigin: true`，可以开启跨域请求。`pathRewrite`用于重写路径，这里将`/api`前缀去掉。

请根据你的实际需求修改代理目标地址和路径重写规则。然后将该配置保存到项目的根目录下的`vue.config.js`文件中，重新运行`npm run serve`即可生效。

注意：这只会在开发环境中生效，打包后的代码并不会使用代理设置。如果需要在生产环境中使用代理，可以考虑在服务器端进行配置。