Cypress无法拦截动态URL的POST请求，求排查解决

现有代码的核心问题 #

1. 中文引号引发语法错误：代码里用了中文的‘’和“”，Cypress无法识别，必须替换为英文的''或""。
2. 别名定义错误：as('@submissionCall')里的@是多余的，别名只需写as('submissionCall')，后续cy.wait()时才需要加@前缀。
3. 未指定请求方法：你要拦截的是POST请求，但现有规则会匹配所有HTTP方法的请求，容易出现漏匹配或误匹配。
4. URL匹配模式不严谨：原拼接的URL模式**def/ghi/jkl/*/mno/pqr/stu/*缺少开头的/，可能导致匹配失败；且无需字符串拼接，直接写通配符模式即可。
5. 回调变量名不匹配：then((result) => { cy.log(response) })中参数是result，但使用了未定义的response，会触发变量未定义错误。

最优拦截方法 #

针对动态URL的POST 201请求，推荐以下两种精准拦截方式：

方法1：通配符匹配（简洁易用）

// 提前定义拦截规则（必须在点击按钮前执行）
cy.intercept('POST', '**/def/ghi/jkl/*/mno/pqr/stu/*').as('submissionCall')

// 点击保存按钮
cy.get("button[class='btn save']").click()

// 等待请求完成并处理响应
cy.wait('@submissionCall').then((interception) => {
  cy.log(interception.response) // 正确使用回调参数
})

方法2：正则表达式匹配（更精准，适合复杂动态路径）

如果动态部分有格式要求（比如1234和9876是数字），可以用正则表达式精准匹配：

const urlPattern = /https:\/\/www\.test\.com\/abc\/def\/ghi\/jkl\/\d+\/mno\/pqr\/stu\/\d+/

cy.intercept('POST', urlPattern).as('submissionCall')

cy.get("button[class='btn save']").click()

cy.wait('@submissionCall').then((interception) => {
  cy.log(interception.response.statusCode) // 可验证是否为201状态码
})

额外排查要点 #

• 确保拦截规则在点击按钮前定义：Cypress的拦截是预定义机制，点击后再定义会无法捕获请求。
• 检查浏览器DevTools的Network面板：点击保存按钮后，确认请求的URL、方法、状态码是否和预期一致，避免请求路径有误。
• 延长等待时间（可选）：如果请求响应较慢，可在cy.wait()中添加超时参数，比如cy.wait('@submissionCall', { timeout: 5000 })。

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