在前端页面开发中,可以通过Charles、Fiddler等工具mock页面中的http请求,但是对于websocket请求的mock却无能为力。本文展示一个工具可以拦截页面中的websocket请求,向被拦截的websocket发送自定义数据。
第一步:在调试对话框中新建一个调试会话。如下图,新建的调试会话拦截包含含有‘taobao’字符串的websocket链接。
第二步,在淘宝首页中打开控制台,新建连接到wss://taobao.com/mock/test://www.的ws连接,并绑定事件响应函数
此时,调试对话框提示建立好调试连接
第三步,在调试对话框发送一条消息,淘宝首页的控制台会输出对话框发出的消息。
第四步,淘宝首页发出的ws消息,会被拦截发送到调试对话框