Charles设置断点篡改接口的返回值配置详细步骤

目标接口

https://test.huanxin.cn/web-pub/project/v1/code/branch/list

前置必做配置（不配置无法抓包篡改 HTTPS）

步骤 1：开启 Charles 基础代理

1.打开 Charles，顶部菜单栏点击 Proxy → Proxy Settings

2.默认端口 8888，勾选 Enable transparent HTTP proxying，直接点 OK 保存。

步骤 2：安装 Charles 根证书（解密 HTTPS 必备）

1.顶部菜单 Help → SSL Proxying → Install Charles Root Certificate

1. 弹出证书窗口，Mac 双击证书 → 信任设置改为始终信任；Windows 选择本地计算机 → 安装到受信任的根证书颁发机构。

1. 安装完成重启 Charles。

步骤 3：配置 SSL 代理拦截目标域名

1. 顶部菜单 Proxy → SSL Proxying Settings

1. 勾选 Enable SSL Proxying，点击 Add
2. Host 填写：test.huanxin.cn，Port 填写：443，点 OK

1. 保存后关闭窗口，HTTPS 解密配置完成。

正式给目标接口设置断点（精准拦截）

方法一：直接抓包后右键加断点（最简单）

1. 电脑浏览器 / 项目访问接口：https://test.huanxin.cn/web-pub/project/v1/code/branch/list
2. Charles 左侧列表找到 test.huanxin.cn 域名，展开找到路径 /web-pub/project/v1/code/branch/list 接口
3. 右键该接口 → 勾选 Breakpoints，勾选后接口会标红，顶部断点小圆点变红。

方法二：手动添加断点规则（精准匹配）

1. 顶部菜单 Proxy → Breakpoint Settings
2. 勾选 Enable Breakpoints，点击 Add

1. 按如下填写规则：
   • Protocol：HTTPS
   • Host：test.huanxin.cn
   • Path：/web-pub/project/v1/code/branch/list
   • 只勾选 Response（只篡改返回值，不用拦截请求）
2. 点 OK 保存断点规则。

拦截并篡改接口返回值完整操作

1. 重新在浏览器 / 项目刷新访问目标接口，会自动被 Charles 断点拦截，卡在断点页面
2. 切换到右侧 Response 标签 → 再切换 Text 子标签，这里就是接口原始返回数据。
3. 直接编辑修改里面的 JSON 内容（改状态码、改数据、改数组都可以）。
4. 修改完成后，点击页面下方 Execute 按钮，放行请求。
5. 此时浏览器 / 项目页面，就会展示你篡改后的返回数据，篡改成功。

Charles设置断点后网站无法访问问题解决

第一步：先彻底关掉系统代理（最优先）

Charles 退出后，Windows 的代理可能没自动恢复，导致 Chrome 还在往127.0.0.1:8888发请求，而 Charles 没开，就会连不上。

1. 打开 Windows 设置 → 网络和 Internet → 代理
2. 把所有开关全部关掉：
   • 自动检测设置：关闭
   • 使用安装脚本：关闭
   • 使用代理服务器：关闭（如果是开着的，点「编辑」，把地址和端口全清空，再关闭）
3. 关闭设置窗口，重启 Chrome 浏览器。

🟠 第二步：清除 Chrome 里这个域名的 HSTS 缓存（关键）

Chrome 因为之前 Charles 的证书问题，给这个域名加了 HSTS “黑名单”，不清除的话，即使代理关了也会拒绝访问。

1. 在 Chrome 地址栏输入并回车： plaintext chrome://net-internals/#hsts
2. 找到 Delete domain security policies 区域：
   • 在输入框里输入：test.huanxin.cn
   • 点击「Delete」按钮
3. 再到 Query domain security policies 区域：
   • 输入 test.huanxin.cn 点查询
   • 如果结果显示 Not found，说明清除成功了

🟡 第三步：强制刷新浏览器缓存（避免页面残留）

1. 关闭所有 Chrome 窗口
2. 重新打开 Chrome，按 Ctrl+Shift+N 开一个无痕窗口
3. 在无痕窗口里访问 https://test.huanxin.cn/project
   • 无痕模式不会用之前的 HSTS 和缓存，大概率能直接打开
   • 如果能打开，说明就是缓存问题，普通窗口重启一下就好了

🛡️ 以后抓包怎么避免再出这个问题？

1. 先开 Charles，再开 Chrome，抓包结束后：
   1. 先关闭 Chrome 浏览器
   2. 再退出 Charles，这样代理会自动恢复
2. 不要一直开着 Charles 的代理，不用的时候一定要关掉系统代理
3. 重新抓包时，确保 Charles 的 SSL 代理和证书都配置正确，再访问网站

按上面步骤操作完，网站就能正常访问了。

Charles证书删除

方法一：通过「证书管理器」删除（最干净，推荐）

1. 按下 Win + R 键，弹出「运行」窗口，输入： certmgr.msc 回车，打开「证书管理器」。
2. 在左侧目录树里，找到：
   • 受信任的根证书颁发机构 → 证书

1. 在右侧列表里，按名称排序，找到 Charles Proxy CA 开头的证书（你安装的那个，有效期 2026/5/14 - 2027/5/14）。

1. 右键这个证书 → 删除 → 确认删除。

方法二：直接从安装的证书窗口删除（你当前的那个）

1. 打开你之前弹出的证书窗口（就是显示 “此 CA 根目录证书不受信任” 的那个）：
   • 可以通过重新打开 Charles → Help → SSL Proxying → Install Charles Root Certificate 调出来。
2. 切换到 「详细信息」 标签页，点击下方的 「证书路径」。
3. 选中最上面的 Charles Proxy CA 证书 → 点击「查看证书」。
4. 在新弹出的证书窗口，点击 「安装证书」 旁边的「删除」（如果是灰色，说明证书没被系统加载，就用方法一）。

补充：顺便检查 Chrome 里的证书（可选）

如果之前给 Chrome 也装过证书，也可以顺便删掉：

1. Chrome 地址栏输入：chrome://settings/security
2. 拉到最下面，点击「管理设备证书」
3. 同样在「受信任的根证书颁发机构」里，找到 Charles Proxy CA 并删除。

删除后的收尾

1. 删除完证书后，重启电脑（或者至少重启 Chrome），避免缓存影响。
2. 之前的 HSTS 清除步骤也再做一次，就能彻底恢复到抓包前的状态了。