WebStorm内置服务器默认仅限localhost访问，需三步配置才能局域网共享：①Settings→Debugger中修改端口并勾选“Can accept external connections”；②Deployment中设置Web server root URL为本机IP加端口；③Mappings中正确填写Web path on server，确保路径匹配且不含中文空格。
WebStorm 内置的 Web 服务器默认只监听 localhost，不对外网开放——所以手机或同事电脑直接访问 http://192.168.x.x:63342 必然失败。必须改端口 + 开启外部连接 + 正确映射路径，缺一不可。
Debugger 设置里开启 external connections 并换端口
内置服务器的监听行为由 Debugger 模块控制，不是 Deployment 或 Server 配置项。很多人卡在这一步，反复检查 Deployment 却没点进 Debugger。
-
File → Settings → Debugger（macOS 是WebStorm → Preferences → Debugger） - 把
Port改成一个空闲端口，比如8080或8888（避开63342，它默认绑定127.0.0.1且无法外放） - 务必勾选
Can accept external connections—— 这是关键开关，不勾选等于没配 - 点
Apply，不用重启 WebStorm，但已打开的页面需刷新
Deployment 配置中填对 Web server root URL
这个 URL 不是随便写的，它决定了你项目在局域网中被访问时的“根地址”，而且必须和你实际的本机 IP 匹配。
- 进入
Settings → Build, Execution, Deployment → Deployment - 添加或编辑一条
Local or mounted folder类型配置 - 在
Connection选项卡下：
–Folder填项目根目录绝对路径（如D:\my-project）
–Web server root URL填http://<你的局域网IP>:<刚才设的端口>（如http://192.168.1.105:8080） - 确认该 IP 是你运行
ipconfig（Windows）或ifconfig（macOS/Linux）查到的 IPv4 地址，不是127.0.0.1或::1
访问时路径必须匹配 Mappings 中的 Web path
很多人配完能 ping 通、能连上，但打开就是 404 Not Found——问题几乎都出在 Mappings 里的 Web path on server。
- 切换到
Mappings选项卡 -
Local path应自动同步为项目根目录（如D:\my-project） -
Web path on server必须填项目名对应的 URL 路径，例如：
– 项目文件夹叫my-app，就填/my-app
– 项目根目录下有index.html，访问地址就是http://192.168.1.105:8080/my-app/
– 如果填成/或留空，WebStorm 会尝试从服务器根目录找文件，而它实际只服务你指定的本地文件夹 - 路径区分大小写，且不能含中文或空格；建议全小写+短横线命名
防火墙和路由器可能拦截请求
即使 WebStorm 配置全对，Windows 防火墙或公司网络策略仍可能拦掉入站连接。
- Windows 用户：检查防火墙是否允许该端口入站（
入站规则 → 新建规则 → 端口 → TCP → 特定本地端口（如 8080）→ 允许连接） - Mac 用户：
系统设置 → 网络 → 防火墙 → 选项 → 允许已签名的下载文件接收传入连接，或临时关闭防火墙测试 - 企业/学校 Wi-Fi 下，有些 AP 默认禁用设备间通信（Client Isolation），此时手机和电脑虽在同一 SSID 下，也无法互相访问——换手机热点可快速验证
- 浏览器访问时，别输错协议，必须是
http://，不是https://（内置服务器不支持 HTTPS）
最易忽略的是：每次修改 Web path on server 后，必须重新右键 HTML 文件 → Open in Browser，否则旧的 localhost 地址不会自动更新；而直接手输新 URL 时，少一个斜杠（比如 /my-app vs /my-app/）也可能导致静态资源 404。
