自定义了响应body、statusCode，还有返回响应的延时时间
运行结果
延时生效了
body 和 statusCode 变成自定义的数据了
拦截请求的栗子
前置操作
beforeEach(() => {
cy.visit('http://localhost:7079/login')
})
断言请求的栗子
测试代码
运行结果
可以看到回调函数只有一个参数，就是 request 参数
重点
回调函数内不能包含 cy.**() 的命令，如果包含会报错
简单来说就是
cy.type() 命令执行完后会返回一个 promise 对象，同时又会调用回调函数，而回调函数内又调用了 cy.get() 返回了一个 promise 对象，Cypress 会将这种情况当做测试失败处理
将请求传递给下一个路由处理程序
前言
意思就是一个请求可以同时匹配上多个路由
测试代码
一个登录请求匹配成功了两个路由，且回调函数会按匹配的顺序执行
总结
回调函数的参数就是一个请求对象，它其实可以调用以下方法
{ /** * 销毁该请求并返回网络错误的响应 */ destroy(): void /** * 控制请求的响应 * 如果传入的是一个函数, 则它是回调函数, 当响应时会调用 * 如果传入的是一个 StaticResponse 对象, 将不会发出请求, 而是直接将这个对象当做响应返回 */ reply(interceptor?: StaticResponse | HttpResponseInterceptor): void /** * 使用 response body(必填) 和 response header(可选) 响应请求 */ reply(body: string | object, headers?: { [key: string]: string }): void /** * 使用 HTTP 状态码(必填)、 response body(可选)、response header(可选) 响应请求 */ reply(status: number, body?: string | object, headers?: { [key: string]: string }): void /** * 重定向到新的 location 来响应请求, * @param statusCode 用来重定向的 HTTP 状态代码, Default: 302 */ redirect(location: string, statusCode?: number): void }
拦截响应的栗子
req.reply() 函数详解
前言
可以使用 req.reply() 函数来动态控制对请求的响应
使用讲解
cy.intercept('/login', (req) => { // functions on 'req' can be used to dynamically respond to a request here // 将请求发送到目标服务器 req.reply() // 将这个 JSON 对象响应请求 req.reply({plan: 'starter'}) // 将请求发送到目标服务器, 并且拦截服务器返回的实际响应, 然后进行后续操作(类似抓包工具对响应打断点) req.reply((res) => { // res 就是实际的响应对象 }) })
.reply() 直接修改响应的栗子
测试代码
接口响应内容
拦截响应的小栗子
测试代码
一个是 request 对象，一个是 response 对象
自定义响应内容
前言
- 可以使用 resp.send() 函数动态控制传入的响应
- 另外，当响应发送到浏览器时，对 resp 的任何修改都将保留
- 如果尚未调用 resp.send() ，则它会在 req.reply() 回调函数完成后隐式调用
使用讲解
cy.intercept('/notification', (req) => { req.reply((resp) => { // Success 将作为 response body 返回到浏览器 resp.send('Success') // 将 success.json 里面的数据作为 response body 返回到浏览器 resp.send({fixture: 'success.json'}) // 将响应延迟 1000ms resp.delay(1000) // 将响应限制为 64kbps resp.throttle(64) }) })
传递字符串作为响应内容
测试代码
传递 JSON 对象作为响应内容
测试代码
传递 StaticResponse 对象作为响应内容
测试代码
接口响应内容
resp 可调用的函数总结
{ /** * 可以自定义 response statusCode、response body、response header * 也可以直接传 StaticResponse 对象 */ send(status: number, body?: string | number | object, headers?: { [key: string]: string }): void send(body: string | object, headers?: { [key: string]: string }): void send(staticResponse: StaticResponse): void /** * 继续返回响应 */ send(): void /** * 等待 delayMs 毫秒，然后再将响应发送给客户端 */ delay: (delayMs: number) => IncomingHttpResponse /** * 以多少 kbps 的速度发送响应 */ throttle: (throttleKbps: number) => IncomingHttpResponse }
