为何在getStaticProps中请求127.0.0.1可行但localhost不行？

核心原因 #

• Node.js环境下，localhost默认会解析到IPv6地址::1，但你的Flask服务仅监听了IPv4的127.0.0.1，未监听IPv6接口，导致请求::1:5000被拒绝。
• getStaticProps/getServerSideProps运行在Node.js服务端环境，遵循Node.js的DNS解析规则；而客户端请求运行在浏览器中，浏览器对localhost的解析会优先尝试IPv4或自动 fallback，因此两个URL都能正常工作。

解决方案 #

方案1：修改Flask服务的监听地址，同时支持IPv4和IPv6

修改Flask启动代码，将监听主机设为::（IPv6通配地址），这样服务会同时监听IPv4和IPv6的所有接口：

from flask import Flask
app = Flask(__name__)

# ... 你的路由逻辑 ...

if __name__ == '__main__':
    app.run(host='::', port=5000)

方案2：在Next.js服务端代码中直接使用127.0.0.1

将getStaticProps/getServerSideProps中的请求地址替换为http://127.0.0.1:5000/posts，跳过DNS解析，直接请求IPv4地址：

import axios from "axios";

export default function SSG({ data }: { data: any }) {
  return <div>SSG</div>;
}

export async function getStaticProps() {
  const res = await axios.get("http://127.0.0.1:5000/posts");

  return {
    props: {
      data: res["data"],
    },
  };
}

补充说明 #

你遇到的问题与axios无关，使用Next.js的fetch也会出现相同情况，本质是Node.js与浏览器的DNS解析行为差异，以及Flask服务的监听配置限制。

内容的提问来源于stack exchange，提问作者utg.tdawg