[{"data":1,"prerenderedAt":107},["ShallowReactive",2],{"case-precise-mock-from-one-request-en":3,"blog-list-en":13},{"slug":4,"title":5,"summary":6,"date":7,"featured":8,"seoDescription":9,"series":10,"seriesOrder":11,"html":12},"precise-mock-from-one-request","断点总误伤一片？从一条真实请求勾出精确 Mock","主流抓包工具的断点是手写的 URL 规则，一开就连轮询和埋点一起停住。本文用 DevPeek 的 Mock 向导，从一条真实请求勾出匹配条件，并演示篡改版本与场景组怎么切换边界。","2026-09-24",false,"DevPeek Mock 教程：从抓到的请求勾选 URL、Query、Body 与请求头作为断点条件；加密参数先解密再按明文命中。同一条规则可一键切换篡改版本，多条规则可收成场景整组启停。","api-debug-new-tricks",5,"\u003Cp>联调时最常见的断点用法，是在 Charles、Fiddler 或 Whistle 里写一条 Host / Path 规则，然后打开断点。\u003C/p>\n\u003Cp>规则一开，订单详情、列表轮询、埋点、重试会一起停住。你改第一条的时候，后面几条已经超时，页面也卡住了。条件要写细，还得自己填 Host、Path、Query。接口如果加密，表单里看到的是密文，不知道该匹配哪一段。\u003C/p>\n\u003Cp>DevPeek 把这件事收成向导：对抓到的那条请求右键「Mock」，勾已经拆开的字段，保存成一条规则。本文按这个路径走一遍：精确命中、换返回、把一组边界收成场景。\u003C/p>\n\u003Ch2>适用读者\u003C/h2>\n\u003Cul>\n\u003Cli>用过抓包代理的断点，被「一开就停下一片」耽误过\u003C/li>\n\u003Cli>已能在 DevPeek 里看到 HTTPS 明文；还没抓到包的话，先看 \u003Ca href=\"/blog/install-first-capture/\">零基础上手：安装 DevPeek 并抓到第一个包\u003C/a>\u003C/li>\n\u003Cli>接口参数加密的，建议先读 \u003Ca href=\"/blog/api-param-encryption-debug/\">H5 接口参数加密？DevPeek 一键解密调试\u003C/a>，配好 \u003Ca href=\"/docs/param-transform/\">参数转换\u003C/a> 再做下面的明文勾选\u003C/li>\n\u003C/ul>\n\u003Ch2>容易卡住的地方\u003C/h2>\n\u003Cul>\n\u003Cli>断点打在 Host 或 Path 前缀上，同域的轮询和静态请求都会进暂停队列。\u003C/li>\n\u003Cli>匹配值手写，和线上多一个空格、少一个字段就永不命中。\u003C/li>\n\u003Cli>加密 Body 整段当条件，换一个订单号就失效；按明文里的 \u003Ccode>orderId\u003C/code> 勾，才能只断这一单。\u003C/li>\n\u003Cli>规则保存后会一直生效。勾得很细，也只是「这类请求」都停，不是「只停下一次」。测完把规则或场景关掉。\u003C/li>\n\u003C/ul>\n\u003Ch2>步骤一：先抓到要断的那条\u003C/h2>\n\u003Cp>把客户端代理到 DevPeek，打开要测的页面，在 \u003Ca href=\"/docs/capture/\">抓包列表\u003C/a> 里点开目标请求，确认 Method、Path、Query 和 Body 就是这次操作发出的那份。\u003C/p>\n\u003Cp>列表里若是密文，先确认参数转换已命中，详情里能看到解密后的明文。向导里的勾选用的就是这份明文。\u003C/p>\n\u003Cp>\u003Cstrong>完成标准：\u003C/strong> 列表里能点开一条完整的目标请求；加密接口在详情中能看到可读字段。\u003C/p>\n\u003Ch2>步骤二：向导里勾匹配条件\u003C/h2>\n\u003Cp>在这条请求上右键「Mock」。第一步标题是「拾取条件」。\u003C/p>\n\u003Cp>界面把这次请求拆成 Method、Host、Path、Query、Body、请求头。要多细就勾多细，值来自这条请求，不用手写规则。加密字段会先解密：JSON 可以展开，勾到 \u003Ccode>orderId\u003C/code> 这种子字段，密文本身不用当条件。\u003C/p>\n\u003Cp>常见勾法：\u003C/p>\n\u003Cul>\n\u003Cli>只想挡住这一个接口：Method + Path。\u003C/li>\n\u003Cli>同一接口要按订单区分：再勾 Query 或 Body 里的那一个字段。\u003C/li>\n\u003Cli>要排除别的客户端：再勾一个能区分环境的请求头。\u003C/li>\n\u003C/ul>\n\u003Cp>勾得越少，后面误伤越多。同一 Path 的轮询如果 Body 不同，就把那个不同字段勾上。\u003C/p>\n\u003Cp>\u003Cstrong>完成标准：\u003C/strong> 预览里能看到你勾中的字段和取值，且没有把整站 Host 当成唯一条件。\u003C/p>\n\u003Ch2>步骤三：选手动暂停，还是自动返回\u003C/h2>\n\u003Cp>第二步是「编辑返回」，二选一。\u003C/p>\n\u003Cp>\u003Cstrong>手动 Mock\u003C/strong> 勾请求、响应，或两段都要。之后命中这条规则的请求会暂停，弹出篡改窗口；改完点「继续」或「中止」。适合临时改一个字段看页面反应。\u003C/p>\n\u003Cp>\u003Cstrong>自动 Mock\u003C/strong> 只选请求或响应其中一段，并写好当前版本的篡改内容。命中后按这份内容放行。只 Mock 响应时，可以直接返回你写的状态码和 Body，不必打到真实服务器。适合固定的 404、空列表、错误 JSON。\u003C/p>\n\u003Cp>手动 Mock 的改包发生在命中之后；自动 Mock 的返回要在这一步写好。\u003C/p>\n\u003Cp>\u003Cstrong>完成标准：\u003C/strong> 保存成功。再触发一次相同操作，手动规则会弹出篡改窗口，自动规则会按你写的内容返回。\u003C/p>\n\u003Ch2>步骤四：同一条规则存几套返回\u003C/h2>\n\u003Cp>一条规则可以有多份篡改版本，例如「正常」「空列表」「500」。同一时刻只有标成生效的那一版参与 Mock，其余只是备着。\u003C/p>\n\u003Cp>右侧 Mock 面板里展开这条规则，点另一版即可切换，不用另写一条规则，也不用重填匹配条件。它不会按第几次请求自己轮换，要换边界就点那一版。\u003C/p>\n\u003Cp>\u003Cstrong>完成标准：\u003C/strong> 同一条规则下至少两版；切换生效版本后，下一次命中的返回跟着变。\u003C/p>\n\u003Ch2>步骤五：把相关规则收成一个场景\u003C/h2>\n\u003Cp>一个边界往往牵着好几条接口。比如「库存不足」要同时改创建订单和支付状态，就做成两条规则，放进同一个场景。\u003C/p>\n\u003Cp>场景是分组，用来整组启停。场景开关是总闸，不改每条规则自己的勾选；条目仍要单独勾上才会生效。多个场景可以同时开着。\u003C/p>\n\u003Cp>匹配不看场景在树上的上下位置。已启用的规则按配置列表从末尾往前找，后写的优先，命中第一条就停。两条规则都可能套住同一次请求时，把更具体的那条留在后面。\u003C/p>\n\u003Cp>\u003Cstrong>完成标准：\u003C/strong> 场景总闸打开时，组内已勾选的规则会命中；关掉总闸后，这组不再拦截，单条规则的勾选还在。\u003C/p>\n\u003Ch2>测完记得关掉\u003C/h2>\n\u003Cp>规则和场景会一直留在配置里。精确勾选减少的是「不像的请求被停住」；长得一样的后续请求，包括轮询和重试，仍会再命中。\u003C/p>\n\u003Cp>看完这次结果，关掉这条规则或整个场景，再刷新页面，确认请求已经回到源站。\u003C/p>\n\u003Ch2>下一步\u003C/h2>\n\u003Cp>匹配条件、手动 / 自动 Mock、篡改版本的字段说明见 \u003Ca href=\"/docs/mock/\">Mock 规则\u003C/a>。加密接口要先能在详情里看到明文，配置见 \u003Ca href=\"/docs/param-transform/\">参数转换\u003C/a>。\u003C/p>\n\u003Ch2>下一篇\u003C/h2>\n\u003Cp>这是「接口调试新姿势」系列当前最后一篇。你可以继续查看 \u003Ca href=\"/blog/\">博客列表\u003C/a>，或回到 \u003Ca href=\"/docs/mock/\">Mock 规则\u003C/a> 对照向导里的每一项。\u003C/p>\n\u003Chr>\n\u003Cp>如果你也在断点里一遍遍手写 URL，欢迎 \u003Ca href=\"/\">下载 DevPeek\u003C/a> 对一条真实请求走一遍向导；规则怎么配见 \u003Ca href=\"/docs/mock/\">Mock 规则\u003C/a>。遇到对不上的加密字段，可以到 \u003Ca href=\"https://github.com/GYPengDev/devpeek/discussions\">GitHub Discussions\u003C/a> 贴一条脱敏请求。\u003C/p>\n\u003Ch2>相关文档\u003C/h2>\n\u003Cul>\n\u003Cli>\u003Ca href=\"/docs/mock/\">Mock 规则\u003C/a>\u003C/li>\n\u003Cli>\u003Ca href=\"/docs/param-transform/\">参数转换\u003C/a>\u003C/li>\n\u003Cli>\u003Ca href=\"/docs/capture/\">抓包界面与请求详情\u003C/a>\u003C/li>\n\u003Cli>\u003Ca href=\"/docs/quick-start/\">快速上手\u003C/a>\u003C/li>\n\u003C/ul>\n",{"items":14},[15,16,23,29,35,42,48,54,61,68,74,80,88,94,101],{"slug":4,"title":5,"summary":6,"date":7,"featured":8,"seoDescription":9,"series":10,"seriesOrder":11},{"slug":17,"title":18,"summary":19,"date":20,"featured":8,"seoDescription":21,"series":22,"seriesOrder":11},"dev-build-log-android-apk","测试机借来借去，我们不想再改系统代理","测试机在团队里转一次，Wi-Fi 代理就要跟着改一次。普通 App 写不了系统代理，于是我们做了 Android 配套 App，用 VpnService 把「换 IP、换端口」收成扫码切换。","2026-09-14","DevPeek 开发实录：为什么做 Android 配套 App。测试机在团队里流转时不再反复修改 Wi-Fi 代理，而是通过 VpnService 扫码切换当前抓包电脑。","dev-build-log",{"slug":24,"title":25,"summary":26,"date":20,"featured":8,"seoDescription":27,"series":22,"seriesOrder":28},"dev-build-log-android-file-transfer-assistant","测试机连上以后，我们又做了个文件互传助手","团队测试机通常没有聊天软件，也不会登录个人账号，传一个 URL、截图或安装包都很麻烦。Android 配套 App 做完后，我们顺手在已有配对链路旁加了一条局域网互传通道。","DevPeek 开发实录：团队测试机没有聊天软件时，如何通过 Android 配套 App 的独立 WebSocket 与 HTTP 局域网通道，在手机和电脑之间互传文字、图片、视频和文件。",6,{"slug":30,"title":31,"summary":32,"date":20,"featured":8,"seoDescription":33,"series":10,"seriesOrder":34},"https-origin-cert-mismatch","Origin Certificate Mismatch: Why DevPeek Still Captures the Site","When an origin certificate does not match its Host, DevPeek neither hides the failure nor stops the debugging session. The site and HTTPS plaintext remain available while request details clearly flag the certificate problem.","Why can DevPeek still open and decrypt a site after ERR_TLS_CERT_ALTNAME_INVALID? Learn how it checks origin Host and SAN, preserves HTTPS debugging, and reports the unverified peer identity.",4,{"slug":36,"title":37,"summary":38,"date":39,"featured":8,"seoDescription":40,"series":10,"seriesOrder":41},"https-ssl-skip-decrypt","HTTPS Capture Breaks a Few Sites? Add Them to Skip SSL Proxy","Your proxy and CA work, but a few sites or apps fail only when HTTPS decryption is enabled. Add those Hosts to Skip SSL Proxy so they use CONNECT tunnels while other HTTPS traffic remains readable.","2026-09-01","A few sites or apps fail when DevPeek SSL proxying is enabled? If they recover with decryption off or through a CONNECT tunnel, use Include and Exclude to skip only incompatible Hosts.",3,{"slug":43,"title":44,"summary":45,"date":46,"featured":8,"seoDescription":47,"series":22,"seriesOrder":34},"dev-build-log-silent-auto-update","After Leaving Electron, Silent Updates Had to Be Ours","After the move to Tauri, electron-updater was gone and the stock updater didn't match Launcher, Core, and Shell. Checks and downloads moved into the tray; apply is a silent overwrite after you confirm. It ships in 1.3.0.","2026-08-28","DevPeek dev log: building our own silent updater after Electron. The tray checks and downloads in the background; a click runs a silent install. Windows / macOS in 1.3.0.",{"slug":49,"title":50,"summary":51,"date":52,"featured":8,"seoDescription":53,"series":22,"seriesOrder":41},"dev-build-log-ws-mock-dsl","Why We Designed a WebSocket Mock DSL Instead of YAML, JSON, or JS","Lightweight WebSocket Mock shouldn't feel heavier than HTTP Mock. YAML, JSON, and JS all work—but they're wordy for connect, login, heartbeat. We built a short DSL to keep lightweight Mock light.","2026-08-13","DevPeek dev log: why WebSocket Mock uses a custom Flow DSL. YAML, JSON, and JS handle heavy cases; sequential lightweight scripts get a shorter text format.",{"slug":55,"title":56,"summary":57,"date":58,"featured":8,"seoDescription":59,"series":22,"seriesOrder":60},"dev-build-log-electron-to-tauri","DevPeek Architecture: Dropping Electron for Tauri","A debugging proxy shouldn't ship a whole Chromium just to open a window. We moved business logic into Core and swapped the desktop shell for Tauri—lighter installs, leaner background use, and the tray brings the UI back after you close the window.","2026-08-08","DevPeek dev log: moving the desktop shell from Electron to Tauri—business stays in Core, the shell handles windows and OS features, with smaller footprint and lower resource use.",2,{"slug":62,"title":63,"summary":64,"date":65,"featured":8,"seoDescription":66,"series":22,"seriesOrder":67},"dev-build-log-sqljs-to-better-sqlite3","Why We Moved Capture History from sql.js to Native SQLite","Early DevPeek stored captures in JavaScript-based SQLite (sql.js); busy sessions ate RAM and stuttered the list. Native SQLite keeps memory flat so the proxy can run all day.","2026-08-05","DevPeek dev log: moving capture storage from sql.js to native SQLite—fixing memory growth and list lag on all-day debugging sessions.",1,{"slug":69,"title":70,"summary":71,"date":72,"featured":8,"seoDescription":73,"series":10,"seriesOrder":60},"mock-map-route-split-api","New API Is Live, Frontend Hasn't Shipped? Debug with Forward Rules","After a service split, the frontend still hits the old API while orders already live on the new service. DevPeek Forward Rules forward specific endpoints to the new host without code changes; if the new service isn't ready, Mock gets the page working first.","2026-07-26","Microservice integration and API host migration: use DevPeek Forward Rules for API forwarding—point old-host requests to the new service without changing the frontend. Mock when migration isn't done. Includes a hands-on demo.",{"slug":75,"title":76,"summary":77,"date":78,"featured":8,"seoDescription":79,"series":10,"seriesOrder":67},"api-param-encryption-debug","H5 API Encrypted? Decrypt It On the Fly with DevPeek","Stuck with AES-encrypted API params during integration? Set the key and IV once in DevPeek Param Transform, and see plaintext automatically — you can even edit and re-encrypt on resend.","2026-07-18","Use DevPeek Param Transform to auto-decrypt AES-GCM encrypted H5 API requests. Supports two-way transform, plaintext editing, and debug replay.",{"slug":81,"title":82,"summary":83,"date":84,"featured":85,"seoDescription":86,"series":87,"seriesOrder":60},"h5-debug-console-mock","H5 Debug in Practice (2): Android WebView White Screen—From Console Remote Debug to Mock Validation","A campaign H5 white-screened on some Android devices after a button tap—all requests returned 200, but the page showed nothing. Using DevPeek Console to capture WebView runtime logs, remote eval to confirm a polyfill override, then Mock to verify the fallback UI under error conditions.","2026-07-13",true,"DevPeek H5 debug practice part 2: troubleshoot Android WebView white screen via Console remote debug to locate a JavaScript polyfill conflict, then use Mock to verify page fallback behavior under abnormal API responses.","h5-debug",{"slug":89,"title":90,"summary":91,"date":92,"featured":85,"seoDescription":93,"series":87,"seriesOrder":67},"wechat-h5-storage-debug","H5 Debug in Practice (1): WeChat H5 Local Cache—Debug It on Desktop","After switching test accounts in a WeChat official-account H5, the avatar still showed the old user—capture had the new token, stale data stayed in localStorage. This post walks through a real joint-debug case and how to view and edit localStorage, sessionStorage, and IndexedDB in WeChat WebView from your PC.","2026-07-11","DevPeek H5 debug: locate localStorage, sessionStorage, and IndexedDB cache issues in WeChat H5—compared with vConsole and remote debug, with real WebView debugging workflow.",{"slug":95,"title":96,"summary":97,"date":98,"featured":85,"seoDescription":99,"series":100,"seriesOrder":60},"why-we-built-devpeek-h5-debug","Why We Built DevPeek (2): That H5 Page in the App—Debug It on Your PC","Param transform fixed login, but the activity H5 only broke inside the App WebView. Remote debug and capture lived in different windows—so we folded mirroring and our own debug panels into DevPeek.","2026-07-10","DevPeek origin series, part 2: in-app H5 bugs that only show on real devices, the split between remote debug and capture, and how the Debug tab mirrors pages with built-in DOM, Console, and Network panels.","origin",{"slug":102,"title":103,"summary":104,"date":105,"featured":85,"seoDescription":106,"series":100,"seriesOrder":67},"why-we-built-devpeek","Why We Built DevPeek (1): HTTPS Decrypted, Body Still Gibberish","The night before a release, TLS was already open—but changing one request field still meant digging up encrypt/decrypt scripts. That pushed us toward a proxy tool with business-layer crypto built in—and DevPeek started there.","2026-07-09","DevPeek origin series, part 1: the manual request-body encrypt/decrypt grind—and why we set out to build a proxy tool that owns business-layer crypto.",1790244370503]