请问vue3+vite项目中，打包生成dist文件后，运行npm run preview预览，是不能请求接口吗？-灵析社区

劳资最帅

![image.png](https://wmprod.oss-cn-shanghai.aliyuncs.com/c/user/20240928/6106f76fd82c70c23311ba73573cfdf9.png) 这是我vite.config.js的配置： ![image.png](https://wmprod.oss-cn-shanghai.aliyuncs.com/c/user/20240928/7be74d5a0327a0f728de95fc3703704e.png) 这是我axios的配置: ![image.png](https://wmprod.oss-cn-shanghai.aliyuncs.com/c/user/20240928/449b07b5547dc5f1ff9694a731960151.png) 这是我.env.test的配置： ![image.png](https://wmprod.oss-cn-shanghai.aliyuncs.com/c/user/20240928/8a058e310fffc2d9e6e870d506834440.png) 这是我network的截图： ![image.png](https://wmprod.oss-cn-shanghai.aliyuncs.com/c/user/20240928/276b7b39ee5dc27ff93977401afa34ed.png) ![1715932637949.jpg](https://wmprod.oss-cn-shanghai.aliyuncs.com/c/user/20240928/e8baf355b97e694f63017626173b070f.png) ![1715932688738.jpg](https://wmprod.oss-cn-shanghai.aliyuncs.com/c/user/20240928/0c078cae380c7a7814a6f9829659f296.png)

阅读量：115

点赞量：0

问AI
可以啊，但是得看项目的构建配置。 从截图上面来看能猜测的原因是，请求的接口地址有问题。 1. 比如说请求的接口地址错误，例如不是完整的URL，单纯只有 "/api/xxx" 这样的使用浏览器拼接的形式。那么本地没有启动对应的服务自然会请求失败。 2. 请求的API地址是完整的，但是本地的接口服务没有启动。或者服务已经启动了但是跨域了。 *** EDIT 首先理解一下 "npm run preview" 这个命令有什么用。其实就是执行 "vite preview" 这个命令。它会在本地启动一个 "devServer" 的 HTTP服务，并指向到当前项目目录下的 "/dist" 目录。并且会读取 "vite.config.js" 中的 "preview" 相关的配置做一些额外的操作，比如代理转发的服务。👉 "预览选项" (https://link.segmentfault.com/?enc=8k3o%2FK2jWofwvWqgaQTi8Q%3D%3D.GOp5BVW5rfzKjBccdQCzK3xTFHDkC0WhWlq9TnVBMWry0O6s9nlbSLmSwCjymrLGD0lH6A3j8wYusaZ6oJvT%2BQ%3D%3D) 例如说我们在 "npm run dev" 之前经常会在 "vite.config.js" 中配置 "server.proxy" 来进行代理转发避免本地开发过程中的跨域问题 👉 "开发服务器选项" (https://link.segmentfault.com/?enc=Alsam%2B8QbXZ%2BZ%2Fi6Y8oi6w%3D%3D.MGEdJyyPsigg5A%2ByoPEzKOTEzAwkCyAAXEafgUrI5H%2BxtS17gjlZNBvVcCnbqZe77vpMXhcIlYu1WI9ZTGQZYg%3D%3D) *** 如果OP你没有配置 "preview" 相关的配置。那么自然就不会启动代理转发的服务，仅仅会在 "/dist" 目录中启动HTTP服务。就和我们在 "npm run dev" 时没有配置 "server.proxy" 是一样的。 所以如果没有配置的话，会遇到以下几种情况： 1. 请求的接口地址不是完整的，仅仅是 "/api/xx" 那么浏览器会自动拼接成完整的 "http://localhost/api/xxx" 这样去请求，我们当前启动的 "preview" 服务并没有相关的接口服务，自然会请求失败。 2. 如果请求的接口地址是完整的，比如说 "http://api.domain.com/api/xxx" 那么就得看后端的接口服务是否允许 "localhost" 这个域名访问，如果不允许的话，自然就是会被浏览器当成跨域请求拦截掉。 所以如果你想使用 "vite preview" 来测试打包的产物是否可以正常执行，得在 "vite.config.js" 中配置 "preview" 相关的配置，并且你的 "axios" 之类的 HTTP 请求库发起的请求得是正确的（也就是请求到 "vite preview" 启动的HTTP代理上面，一般都是配置 "baseURL" 为 "/"）。不然就会OP你在问题内容描述的请求失败。