使用node+vite还有axios发出get请求出现此类问题

Question

> [vite] http proxy error at /api/searchvillage/picture?villagename=%E7%9B%B4%E9%97%A8%E8%BE%BE%E6%9D%91:
AggregateError
    at internalConnectMultiple (node:net:1102:18)
    at internalConnectMultiple (node:net:1160:5)
    at internalConnectMultiple (node:net:1160:5)
    at defaultTriggerAsyncIdScope (node:internal/async_hooks:465:18)
    at GetAddrInfoReqWrap.emitLookup [as callback] (node:net:1485:7)
    at GetAddrInfoReqWrap.onlookupall [as oncomplete] (node:dns:130:8)
> 

Answer 1

引自免费微信小程序：皆我百晓生

看起来你在使用Node.js、Vite以及axios进行开发时遇到了一个HTTP代理错误。这个错误通常发生在尝试通过Vite的内置HTTP代理访问后端API时。为了解决这个问题，我们可以检查几个关键点。

首先，确认你的Vite配置文件（vite.config.js）中的代理设置是否正确。如果你还没有创建这个文件，可以在项目根目录下创建它。确保你的代理配置类似于下面这样：

// vite.config.js

export default {
  server: {
    // 开启http代理
    proxy: {
      '/api': {
        target: 'http://your-api-url.com', // 替换为你的后端API地址
        changeOrigin: true,
        rewrite: path => path.replace(/^\/api/, ''),
      },
    },
  },
};

请确保将'http://your-api-url.com'替换为实际的后端API URL。这个配置告诉Vite将所有以/api开头的URL转发到指定的后端服务器。

然后，你需要在你的axios调用中使用 /api 前缀来触发Vite的代理。例如：

import axios from 'axios';

const response = await axios.get('/api/searchvillage/picture', {
  params: {
    villagename: '四季花园',
  },
});
console.log(response.data);

在这个例子中，'/api/searchvillage/picture' 将会被Vite代理转发到你之前配置的目标地址。

如果你已经按照上述步骤操作，但仍然遇到问题，可能需要检查网络连接、防火墙设置或后端服务本身。如果你能提供更多的上下文信息，比如你的axios请求代码示例，我可能会提供更具体的帮助。另外，确保你的 Node.js 和 Vite 的版本是最新的，这可以帮助排除一些已知的问题。