[{"data":1,"prerenderedAt":101},["ShallowReactive",2],{"case-dev-build-log-android-apk-en":3,"blog-list-en":13},{"slug":4,"title":5,"summary":6,"date":7,"featured":8,"seoDescription":9,"series":10,"seriesOrder":11,"html":12},"dev-build-log-android-apk","测试机借来借去，我们不想再改系统代理","测试机在团队里转一次，Wi-Fi 代理就要跟着改一次。普通 App 写不了系统代理，于是我们做了 Android 配套 App，用 VpnService 把「换 IP、换端口」收成扫码切换。","2026-09-14",false,"DevPeek 开发实录：为什么做 Android 配套 App。测试机在团队里流转时不再反复修改 Wi-Fi 代理，而是通过 VpnService 扫码切换当前抓包电脑。","dev-build-log",5,"\u003Ch2>「这台手机的包怎么还在我这里？」\u003C/h2>\n\u003Cp>联调到一半，隔壁同事把测试机拿走了。他电脑上的 DevPeek 已经开着，\u003Ca href=\"/docs/mock/\">Mock\u003C/a> 和 \u003Ca href=\"/docs/param-transform/\">参数转换\u003C/a> 也配好了，手机却还记着我的代理地址。\u003C/p>\n\u003Cp>过了一会儿，我的抓包列表里还在冒请求，他那边一条都没有。\u003C/p>\n\u003Cblockquote>\n\u003Cp>「这台手机现在到底连的是谁？」\u003C/p>\n\u003C/blockquote>\n\u003Cp>以前只能打开 Wi-Fi 详情，找到代理设置，把主机名改成他的局域网 IP，再核对端口。还机时改回来，下一个人借走时再改一次。不同品牌入口不一样，有的藏在「高级选项」里。\u003C/p>\n\u003Cp>这套动作不难，但是它发生得太频繁，而且没有人会把「还机前清代理」当成一项正式流程。忘了切，包继续打到上一位同事；忘了清，测试机离开办公室后可能连网页都打不开。一个人在自己手机上调试时还好，一台设备在开发、测试之间转起来，几步系统设置就成了持续的摩擦。\u003C/p>\n\u003Cp>我们想把交接收成一句话：\u003Cstrong>扫谁的码，包就进谁的 DevPeek。\u003C/strong>\u003C/p>\n\u003Ch2>普通 App 改不了系统代理\u003C/h2>\n\u003Cp>最直接的想法，是做一个小工具保存几组 IP 和端口，点一下就替用户改好 Wi-Fi 代理。\u003C/p>\n\u003Cp>但 Android 没给普通 App 这项权限。Wi-Fi 的 HTTP 代理属于系统网络配置，第三方应用可以把地址显示出来、复制出来，却不能静默写进去。除非设备被 Root、由企业 MDM 管理，或者应用本身是 Device Owner——这些都不适合一台普通团队测试机。\u003C/p>\n\u003Cp>只做一个「代理地址收藏夹」并没有解决问题：点完收藏，用户还是得回系统设置粘贴。借一次机改一次，原来的摩擦几乎原封不动。\u003C/p>\n\u003Cp>继续找系统允许的路径时，我们注意到了 \u003Cstrong>VpnService\u003C/strong>。它原本是 Android 留给 VPN 客户端的接口：经用户明确授权，应用可以建立一张虚拟网卡，决定流量从哪里出去。Android 10 又给它补了 \u003Ccode>setHttpProxy\u003C/code>，允许给这张虚拟网卡声明 HTTP 代理。\u003C/p>\n\u003Cp>这正好绕开了「修改 Wi-Fi 配置」：\u003C/p>\n\u003Cul>\n\u003Cli>Android 10 及以上，通过 \u003Ccode>VpnService.setHttpProxy\u003C/code> 把认系统 HTTP 代理的流量交给当前这台 DevPeek；\u003C/li>\n\u003Cli>Android 8–9 没有这条 API，走 \u003Ccode>TUN → SOCKS5 → HTTP CONNECT → DevPeek\u003C/code>；\u003C/li>\n\u003Cli>设置里原来的 Wi-Fi 代理不动，断开 VPN 后，手机回到原来的网络路径。\u003C/li>\n\u003C/ul>\n\u003Cp>VPN 在这里不是为了把 DevPeek 做成手机 VPN 产品，而是普通 App 无法改系统代理之后，系统仍然允许用户授权的一条路。\u003C/p>\n\u003Ch2>「一键」实际指什么\u003C/h2>\n\u003Cp>我们一直给「一键」加引号，因为第一次使用并不是真的点一下就结束：要安装 App，要允许系统 VPN，有 HTTPS 解密需求时还要装 CA。系统弹出的授权和警告也不该被绕开。\u003C/p>\n\u003Cp>真正想省掉的是：\u003Cstrong>每次换人，都进系统设置重填代理。\u003C/strong>\u003C/p>\n\u003Cp>电脑与手机在同一局域网时，DevPeek 的手机面板会出一张配对码。它不是原来的证书下载码，而是一条 \u003Ccode>devpeek://proxy\u003C/code> 链接，里面带着协议版本、代理端口、电脑显示名，以及可能可用的局域网 IP：\u003C/p>\n\u003Cpre>\u003Ccode class=\"language-text\">devpeek://proxy?v=1&amp;host=192.168.1.23&amp;ips=192.168.1.23,10.0.0.2&amp;port=8888&amp;name=Alice\n\u003C/code>\u003C/pre>\n\u003Cp>手机扫码后，会按顺序短探测这些地址，找到当前网络里真正可达的那一个，再申请建立 VPN。这样电脑同时开着 Wi-Fi、网线或虚拟网卡时，不必让拿手机的人猜该填哪张网卡的 IP。扫不了码，仍可以从相册识别、粘贴链接或手填地址。\u003C/p>\n\u003Cp>连过的电脑会留在历史里，并显示名字、IP 和端口。测试机再次回到同一位同事手里，可以从历史直接连接；换给另一个人，就扫另一张码。App 会持续检查桌面代理是否还活着，连续连接失败时主动断开，而不是保留一个看起来正常、实际上已经失效的出口。\u003C/p>\n\u003Cp>还机前仍建议点「断开」。不断开时，新请求可能继续进入上一台电脑——这正是原来借机场景最容易漏的事。至少现在连接对象会明确显示在 App 顶部和系统常驻通知里，不必再回忆 Wi-Fi 设置中填过哪个 IP。\u003C/p>\n\u003Cp>桌面上的 \u003Ca href=\"/docs/collaboration/\">局域网协作\u003C/a> 解决的是电脑之间发现伙伴、发送请求或调试录制；配套 App 解决的是\u003Cstrong>同一台测试机在人之间交接\u003C/strong>。它们服务同一个团队，却不是同一条链路。\u003C/p>\n\u003Cp>手机也只负责把流量送进当前这台电脑。抓包、解密、Mock、参数转换和页面调试仍由桌面 DevPeek 完成，和 \u003Ca href=\"/docs/quick-start/\">快速上手\u003C/a> 里的代理链路没有分叉。\u003C/p>\n\u003Ch2>证书还是要装，只是不用再自己找下载\u003C/h2>\n\u003Cp>代理切过去以后，HTTP 会先进入列表。要看到 HTTPS 明文，手机仍然必须信任\u003Cstrong>当前这台电脑\u003C/strong>的 DevPeek CA。VPN 解决的是流量往哪里走，证书解决的是客户端是否接受中间人解密，两件事不能互相替代。\u003C/p>\n\u003Cp>以前通常还要让电脑再出一张证书码，用浏览器下载文件，然后回到系统设置里找到它。现在 App 已经知道连的是哪台电脑，便可以直接向它请求 \u003Ccode>/devpeek-ca.crt\u003C/code>，写入手机的「下载」目录，再打开系统设置。\u003C/p>\n\u003Cp>到这里就是普通 App 能做的上限。Android 11 之后，应用不能再通过 KeyChain 直接发起 CA 安装；最终确认必须由用户在系统设置里完成。所以按钮没有叫「一键安装」，而是很具体的 \u003Cstrong>保存并打开设置\u003C/strong>：\u003C/p>\n\u003Col>\n\u003Cli>手机须已设锁屏（PIN / 图案）\u003C/li>\n\u003Cli>点按钮后，确认文件已保存到「下载 / \u003Ccode>devpeek-ca.crt\u003C/code>」\u003C/li>\n\u003Cli>进入「安全 → 加密与凭据 → 安装证书 → CA 证书」\u003C/li>\n\u003Cli>不要选「VPN 和应用」\u003C/li>\n\u003Cli>选刚保存的 \u003Ccode>devpeek-ca.crt\u003C/code>，确认警告后返回\u003C/li>\n\u003C/ol>\n\u003Cp>不同厂商的菜单名字可能不同，这一步没法假装不存在。我们能减少的是重复找下载入口、确认证书来自哪台电脑；不能替用户接受一张根 CA。\u003C/p>\n\u003Cp>未安装 App 的设备仍可使用桌面上的「扫码下载证书」。配对码和证书码继续分开：前者决定流量去哪里，后者只负责取得 CA。完整的证书信任与 SSL 解密范围见 \u003Ca href=\"/docs/proxy-ssl/\">代理与 SSL 证书\u003C/a>。\u003C/p>\n\u003Ch2>VPN 图标亮了，不等于整台手机都被抓了\u003C/h2>\n\u003Cp>这里还有一个容易误解的地方：VpnService 建起的是流量入口，不代表我们把整台手机的所有连接都送到电脑。\u003C/p>\n\u003Cp>在 Android 10 及以上，Chrome、系统浏览器和常见 WebView 这类认系统 HTTP 代理的客户端会进入 DevPeek；不认代理的连接会经虚拟网卡直接回到手机原来的网络。这样做的目标是让测试机保持可用，而不是为了抓一个 H5，把所有后台同步、推送和其它应用流量都灌进桌面列表。\u003C/p>\n\u003Cp>因此边界也很明确：\u003C/p>\n\u003Cul>\n\u003Cli>\u003Cstrong>不是所有 App 都会进代理\u003C/strong>：很多原生 App 不认系统 HTTP 代理，会直接联网。\u003C/li>\n\u003Cli>\u003Cstrong>用户 CA 不是系统 CA\u003C/strong>：Android 7+ 默认不让普通 App 信任用户证书。微信等应用即使装了 CA，HTTPS 也可能无法解密；调试时仍需明确允许用户证书的构建。\u003C/li>\n\u003Cli>\u003Cstrong>UDP / QUIC 不保证进入 DevPeek\u003C/strong>：需要时让目标页面回退到 TCP / HTTP，不能把 VPN 图标当作全协议接管。\u003C/li>\n\u003Cli>\u003Cstrong>仍受局域网约束\u003C/strong>：手机和电脑须处于可互通的网络，电脑防火墙也要放行代理端口。\u003C/li>\n\u003Cli>\u003Cstrong>目前不做按应用过滤、系统证书注入和 iOS\u003C/strong>：这些不是藏起来的开关，而是尚未覆盖的能力。\u003C/li>\n\u003C/ul>\n\u003Cp>它也不是手机上的独立抓包台，不替代连得上时的 Chrome Inspect。它只把团队最常重复的那一步——\u003Cstrong>测试机换人时重设代理\u003C/strong>——从系统设置里拿了出来。流量进入桌面后，怎么筛选、看详情和重发，仍以 \u003Ca href=\"/docs/capture/\">抓包与过滤\u003C/a> 为准。\u003C/p>\n\u003Ch2>从「改设置」缩短到「确认连接对象」\u003C/h2>\n\u003Cp>回过头看，这个 App 的起点不是「DevPeek 也要有一个移动端」，而是一台测试机在团队里转来转去时，代理地址跟不上人。\u003C/p>\n\u003Cp>我们没法消掉 Android 的 VPN 授权，也不能替用户安装根证书；更不能承诺所有 App、所有协议都被接管。能做的是把每次都要重复的 IP、端口和网卡判断交给配对码，把当前连接对象明明白白地显示出来，把断开和切换留在同一个入口。\u003C/p>\n\u003Cp>原来是「进系统设置，确认现在填的是谁的 IP」。现在尽量缩短成「看一眼名字，扫一下码」。\u003C/p>\n\u003Ch2>相关文档\u003C/h2>\n\u003Cul>\n\u003Cli>\u003Ca href=\"/docs/android-app/\">Android 配套 App\u003C/a>\u003C/li>\n\u003Cli>\u003Ca href=\"/docs/quick-start/\">快速上手\u003C/a>\u003C/li>\n\u003Cli>\u003Ca href=\"/docs/proxy-ssl/\">代理与 SSL 证书\u003C/a>\u003C/li>\n\u003Cli>\u003Ca href=\"/docs/capture/\">抓包与过滤\u003C/a>\u003C/li>\n\u003Cli>\u003Ca href=\"/docs/collaboration/\">局域网协作\u003C/a>\u003C/li>\n\u003Cli>\u003Ca href=\"/docs/faq/\">常见问题\u003C/a>\u003C/li>\n\u003C/ul>\n\u003Ch2>下一篇\u003C/h2>\n\u003Cp>\u003Cstrong>\u003Ca href=\"/blog/dev-build-log-android-file-transfer-assistant/\">测试机连上以后，我们又做了个文件互传助手\u003C/a>\u003C/strong>——测试机没有聊天软件，也不该登录个人账号；既然已经与电脑配对，就顺手让文字、图片、视频和文件通过局域网直接互传。\u003C/p>\n\u003Chr>\n\u003Cp>配套 App 还在随桌面 1.4.x 打磨，目前不上架。电脑侧仍从 \u003Ca href=\"/\">DevPeek 官网\u003C/a> 下载；扫码连接、VPN 授权与证书安装步骤见 \u003Ca href=\"/docs/android-app/\">Android 配套 App 文档\u003C/a>。如果你也遇到过借机、切代理或安装证书的摩擦，欢迎到 \u003Ca href=\"https://github.com/GYPengDev/devpeek/discussions\">GitHub Discussions\u003C/a> 说说团队怎么使用测试机。\u003C/p>\n",{"items":14},[15,16,22,29,36,42,48,55,62,68,74,82,88,95],{"slug":4,"title":5,"summary":6,"date":7,"featured":8,"seoDescription":9,"series":10,"seriesOrder":11},{"slug":17,"title":18,"summary":19,"date":7,"featured":8,"seoDescription":20,"series":10,"seriesOrder":21},"dev-build-log-android-file-transfer-assistant","测试机连上以后，我们又做了个文件互传助手","团队测试机通常没有聊天软件，也不会登录个人账号，传一个 URL、截图或安装包都很麻烦。Android 配套 App 做完后，我们顺手在已有配对链路旁加了一条局域网互传通道。","DevPeek 开发实录：团队测试机没有聊天软件时，如何通过 Android 配套 App 的独立 WebSocket 与 HTTP 局域网通道，在手机和电脑之间互传文字、图片、视频和文件。",6,{"slug":23,"title":24,"summary":25,"date":7,"featured":8,"seoDescription":26,"series":27,"seriesOrder":28},"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.","api-debug-new-tricks",4,{"slug":30,"title":31,"summary":32,"date":33,"featured":8,"seoDescription":34,"series":27,"seriesOrder":35},"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":37,"title":38,"summary":39,"date":40,"featured":8,"seoDescription":41,"series":10,"seriesOrder":28},"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":43,"title":44,"summary":45,"date":46,"featured":8,"seoDescription":47,"series":10,"seriesOrder":35},"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":49,"title":50,"summary":51,"date":52,"featured":8,"seoDescription":53,"series":10,"seriesOrder":54},"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":56,"title":57,"summary":58,"date":59,"featured":8,"seoDescription":60,"series":10,"seriesOrder":61},"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":63,"title":64,"summary":65,"date":66,"featured":8,"seoDescription":67,"series":27,"seriesOrder":54},"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":69,"title":70,"summary":71,"date":72,"featured":8,"seoDescription":73,"series":27,"seriesOrder":61},"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":75,"title":76,"summary":77,"date":78,"featured":79,"seoDescription":80,"series":81,"seriesOrder":54},"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":83,"title":84,"summary":85,"date":86,"featured":79,"seoDescription":87,"series":81,"seriesOrder":61},"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":89,"title":90,"summary":91,"date":92,"featured":79,"seoDescription":93,"series":94,"seriesOrder":54},"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":96,"title":97,"summary":98,"date":99,"featured":79,"seoDescription":100,"series":94,"seriesOrder":61},"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.",1789537087068]