Docker中yarn启动Web应用无法访问localhost:8080问题排查

• 进入运行中的容器验证服务监听状态：执行docker exec -it <你的容器ID> bash进入容器内部，先安装网络工具apt update && apt install -y iproute2，再执行ss -tulpn | grep 8080查看端口绑定地址。如果输出的Local Address列显示为127.0.0.1:8080，即可确认故障原因。
• 容器内本地访问验证：在容器内部执行curl http://127.0.0.1:8080，如果能正常返回Web应用的页面内容，说明应用本身运行无异常，故障出在网络转发层。
• 宿主机验证端口映射规则：在宿主机执行docker port <你的容器ID>，确认输出存在0.0.0.0:8080->8080/tcp规则，排除启动命令端口映射参数写错的问题。

所有主流前端脚手架（Webpack DevServer、Vite、Vue CLI、Create React App等）的本地开发服务，默认仅绑定127.0.0.1回环地址。
在宿主机直接运行时，回环地址对应宿主机本身，访问localhost:8080可以正常连通；但在Docker容器内部，127.0.0.1仅对容器内的进程可见，宿主机通过端口映射转发的流量走容器虚拟网卡，无法到达绑定在回环地址上的服务，因此会出现Connection reset by peer错误，且应用本身运行正常无报错日志。

核心修改点是让开发服务监听0.0.0.0地址，允许所有网卡的流量接入，可任选以下一种方式修改：

1. 修改项目启动脚本：打开项目根目录的package.json，在start命令中添加--host 0.0.0.0参数：
   • Webpack/Vue CLI/Create React App 类脚手架：将脚本改为"start": "react-scripts start --host 0.0.0.0"（对应自己的启动命令替换即可）
   • Vite 类脚手架：将脚本改为"start": "vite --host 0.0.0.0"
2. 无代码修改方案：部分脚手架支持通过环境变量指定绑定地址，启动容器时追加环境变量参数即可，例如docker run -p 8080:8080 -e HOST=0.0.0.0 -itd webapp:latest
3. Dockerfile层强制指定：直接在CMD启动命令中追加host参数，无需修改项目代码，参考优化后的Dockerfile配置：

FROM ubuntu:20.04
ARG DEBIAN_FRONTEND=noninteractive
ENV TZ=Pacific/Auckland

# 合并RUN指令减少镜像层数，提前配置时区避免安装交互
RUN ln -snf /usr/share/zoneinfo/$TZ /etc/localtime && echo $TZ > /etc/timezone \
    && apt update -y && apt upgrade -y \
    && apt install -y curl npm git \
    && npm cache clean -f && npm install -g n && n stable \
    && apt remove -y cmdtest yarn \
    && npm install -g yarn -y \
    && git config --global url."https://".insteadOf git://

# 指定工作目录，避免文件散落在容器根目录
WORKDIR /app
# 先拷贝依赖文件利用Docker构建缓存，后续代码修改不需要重新装依赖
COPY package.json yarn.lock ./
RUN yarn
# 拷贝剩余项目代码
COPY . .

EXPOSE 8080
# 启动时强制绑定0.0.0.0地址
CMD ["yarn", "start", "--host", "0.0.0.0"]

内容的提问来源于stack exchange，提问作者usert4jju7