Cypress使用cy.request发POST请求返回404,生产/开发环境正常如何解决?
问题解决方案
1. 验证baseUrl配置正确性
Cypress 发起相对路径请求时,会自动拼接cypress.config.js(或老版本的cypress.json)中配置的baseUrl作为前缀。如果baseUrl配置错误、多了/少了路径前缀,都会导致最终请求路径和业务环境不一致。
你可以先将请求url替换为完整绝对路径测试:
cy.request({ method: 'POST', url: 'https://mysite.net/auth/login/example-url', // 替换为你业务环境实际请求的完整路径 failOnStatusCode: false, body: { arrival: '2021-12-01T17:23', departure: '2021-12-01T15:23', destination: 'New York', origin: 'Washington DC', }, })
如果修改为绝对路径后请求正常,说明是baseUrl配置问题,修正即可。
2. 移除form: true参数验证
你业务中使用fetch发起请求时,默认传递的是JSON格式数据,对应请求头Content-Type: application/json。而cy.request中设置form: true会强制将请求头改为application/x-www-form-urlencoded,同时将body转换为表单序列化格式。
如果你的Express后端仅配置了express.json()中间件解析JSON请求,没有配置express.urlencoded()解析表单格式请求,就会出现路由匹配失败返回404的问题。绝大多数情况下这类场景不需要设置form: true,删除该参数即可对齐业务环境的请求行为。
3. 检查代理/路径前缀配置
如果开发环境你配置了前端代理(比如React项目的setupProxy.js将/api前缀的请求转发到Express服务),需要注意cy.request默认不会走前端代理规则,会直接发起请求。这种情况你需要:
- 给
cy.request的url加上对应前缀(比如/api/auth/login/example-url) - 或者在
cypress.config.js中配置proxy规则对齐前端代理逻辑
4. 校验路径大小写与拼写
Express路由默认大小写敏感,仔细对比业务代码中fetch请求的路径和Cypress中写的路径,确认大小写、斜杠数量、拼写完全一致。
内容的提问来源于stack exchange,提问作者Nimrod Wander
相关产品推荐
相关产品推荐

