确保在应用程序调用api之前注册了网络拦截，注意cy.intercept在cy.visit之前运行。

it('is registered correctly', () => {
  cy.intercept('/todos').as('todos')
  cy.visit('/')
  cy.wait('@todos')
})

在以下示例中，cy.intercept在cy.visit之后运行，这可能会失败。

it('is registered too late, this might fail', () => {
    cy.visit('/')
    cy.intercept('/todos').as('todos')
    cy.wait('@todos')
  })

希望这对你或野外的其他人有帮助：）

我不完全确定为什么它没有被存根（假设您的意思是服务器响应正在通过？）
无论如何，这个残缺不全的React模式现在要复杂得多，它会绊倒很多人。
这是我对文件的解读
在cy.route(method, url, response)中，缓解记录为body
向匹配路由中的存根提供响应body。
在cy.intercept(method, url, routeHandler?)中，routeHandler是一个更复杂的怪兽。
路由处理程序（字符串|客体|功能|静态响应）
但object和StaticResponse都是对象- Cypress通过查看对象键来进行区分，如下所示
如果传递了一个没有StaticResponse键的对象，它将作为JSON响应body发送。
静态响应键包括

{
  fixture?: string
  body?: string | object | object[]
  headers?: { [key: string]: string }
  statusCode?: number
  forceNetworkError?: boolean
  delayMs?: number
  throttleKbps?: number
}

由于您正在发送statusCode，您的对象 * 是 * 一个StaticResponse，因此消息和结果应移至body，

cy.intercept('GET',
  `${API}farm/list`,
  {
    statusCode: 200,
    body: {
      message: 'Request successful',
      result: seededFarmList
    }
  }
);

我觉得他们有点过度设计了--从StaticResponse到对象的回退（取决于键）有点不必要。
我刚刚在示例规范network_requests.spec.js（在Cypress第一次运行时添加的）中找到了一个示例。

beforeEach(() => {
  cy.visit('https://example.cypress.io/commands/network-requests')
})

...

let message = 'whoa, this comment does not exist'

// Stub a response to PUT comments/ ****
cy.intercept({
  method: 'PUT',
  url: '**/comments/*',
}, {
  statusCode: 404,
  body: { error: message },                         // stub returns above message
  headers: { 'access-control-allow-origin': '*' },
  delayMs: 500,
}).as('putComment')

// we have code that puts a comment when
// the button is clicked in scripts.js
cy.get('.network-put').click()

cy.wait('@putComment')

// our 404 statusCode logic in scripts.js executed
cy.get('.network-put-comment').should('contain', message)

我设法让Stubbing使用@eric99提供的模式，

cy.intercept(
  'GET',
  'https://jsonplaceholder.typicode.com/todos/1',
  {
    statusCode: 200,
    body: {
      message: 'Request successful',
      result: ['my-data']
    }
  }
)
.as('typicode')

cy.visit('https://jsonplaceholder.typicode.com/')
cy.get('#run-button').click();

cy.wait('@typicode')
.then((interception) => {
  console.log('interception', interception)
})

该页面显示存根信息，

{
    "message": "Request successful",
    "result": [
        "my-data"
    ]
}

我有这个问题之前，我发现这是由CORS政策。
有一些解决方案可以解决此问题：

• https://docs.cypress.io/guides/guides/web-security.html#Set-chromeWebSecurity-to-false
• 前端和后端应位于同一原点;例如，HTTP：//本地主机：1000

不确定您是否使用了getServerSideProps（）或Next的其他SSR方法，但如果您使用了，cy.intercept（）将无法工作，因为API调用是在服务器端完成的。您必须使用nock来拦截和模拟在getServerSideProps（）或Next中的任何类似服务器端方法中完成的任何服务器端API调用。
关于这个主题的综合阅读如下：https://glebbahmutov.com/blog/mock-network-from-server/

我做了这个，它破坏了API。

cy.intercept(
          {
            method: 'GET',
            url: `${API}farm/list`
          },

          {
            body: {
              statusCode: 200,
              message: 'Request successful',
              result: seededFarmList
            }
          }
        ).as('loadData');

如果在路由匹配器模式中使用模板文字，Cypress似乎无法解析路由匹配器参数。
不工作：

cy.intercept('GET', `/.*${mybaseUrl}\/something\/.*/`)

(even尽管该模式是有效的，而且它甚至正好显示在Cypress中！）
我发现有两种方法可以让它工作。
1.使用routematcher参数说明url：

cy.intercept(
          {
            method: 'GET',
            url: `.*${mybaseUrl}\/something\/.*`
          })

1.使用RegExp构造函数

cy.intercept('GET', new RegExp(`.*${mybaseUrl}\/something\/.*`)

它看起来确实像Cypress中的bug，但这是两个非常可以接受的变通方法。