Angular9登录注册示例localhost:4000配置及Postman测试问题咨询

关于localhost:4000的生效逻辑与Postman访问404的原因 #

• 你感知到的4000端口“正常生效”，本质是这份教程配套的独立后端demo服务，已经在你的本地4000端口启动运行了，并不是Angular前端应用本身可以响应4000端口的请求。
• 你用Postman直接访问http://localhost:4000根路径收到404，是因为这个后端服务根本没有配置根路径的响应路由——服务只提前定义了/users/authenticate、/users/register这类业务接口路径，直接访问未定义的根路径，自然会返回资源不存在的响应，不代表后端服务没有正常运行。
• 如果你后续把4000端口运行的后端demo服务关闭，再用Postman访问该地址，会收到连接被拒绝的错误，和之前的404响应有本质区别，可以通过这个方式判断后端服务是否真的在运行。

关于Postman测试登录方法的可行性 #

• 完全可以用Postman测试这个登录方法的核心接口链路，但没法覆盖前端写在响应管道里的localStorage逻辑。
• 可测试的部分：登录方法本质是向前端发了一个POST请求到http://localhost:4000/users/authenticate，请求体里带username和password两个字段。你在Postman里选POST方法，填对这个接口地址，Body选raw格式的JSON，把对应的用户名、密码填进去，就能测试后端能不能正确返回带JWT token的用户对象，这部分和所有普通后端接口测试没有区别。
• 没法测试的部分：接口拿到响应后，Angular代码里把用户对象转成字符串存到localStorage、把用户信息推给全局状态的逻辑，是纯浏览器侧的前端操作，和后端没关系。Postman没有浏览器的存储上下文，自然跑不了这部分代码，你只要确认后端接口返回的字段格式和代码里预期的一致，前端的存储逻辑直接在浏览器开发者工具的Application面板里检查就行，根本不需要靠Postman测。

关于前后端使用不同端口的设计原因 #

• 你跑Angular用的4200端口，和教程里写的4000端口，从根上就是两个完全独立的服务：
  • 4200是Angular CLI自带的开发服务器，作用是把你写的TS、组件代码编译成浏览器能识别的HTML、JS、CSS，给浏览器提供静态资源访问，顺便带热更新、自动刷新这些开发辅助功能。
  • 4000是独立的后端API服务，负责处理用户认证、数据库读写这些后端逻辑，和你写的Angular前端代码没有任何耦合。
• 之所以要分开用不同端口，根本不是教程随便拍脑袋定的：
  • 首先是避免端口冲突，如果前后端都挤在同一个4200端口，要么Angular CLI启动的时候端口被占报错，要么后端的接口路由把前端的静态资源路由冲掉，两边都跑不起来。
  • 其次是贴合真实生产环境的部署逻辑：线上环境里前端静态资源一般会放CDN或者静态资源服务器，后端接口会部署在独立的应用服务器上，本来就不在同一个端口跑。开发阶段分两个端口启动两个服务，只要配好CORS跨域规则，就能模拟真实生产的请求链路，不会等上线的时候才发现跨域、路径不对这类问题。

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