本地环境下 前端突然端口占用问题 针对vscode

1.问题背景

本地运行前端代码，虚拟机中使用nginx反向代理。两者都使用vscode进行开发。后端使用vscode远程连接。在前端发起一次接口请求后，后端会产生新的监听端口，出现如下图的提示情况。随后前端刷新，甚至无法正常显示界面。

2.问题分析

这是vscode针对远程连接开发部分的默认功能，在使用了remote时，vscode会自动检测到远程端口被监听，反向代理给了本地的3000端口，而前端也运行在本地3000端口位置。导致端口占用，无法正常使用。

3.解决方法

打开vscode设置（ctrl + ，），输入remote autoForwardPorts，然后将默认的勾选取消，即可解决问题。该操作是禁用vscode自动监听转发端口。