代码 – 7gugu's Blog

[工具] Whistle-MCP – 让你的 AI 助手成为网络代理专家

🌟 主要功能

智能分析网络请求 – AI 助手可帮你分析指定时间段内的 whistle 请求，发现异常
一键重放请求 – 只需告诉 AI 要重放哪个请求，无需手动配置参数
自动生成代理规则 – 根据代码定义自动生成 whistle 代理规则和 mock 数据
全面管理代理配置 – 通过自然语言轻松管理规则、分组和值

💡 适用场景

前端开发时快速调试接口问题
测试人员模拟各种网络响应场景
移动端应用抓包分析与请求重放

🏠 仓库&NPM

📦 快速上手

1.全局安装 whistle-mcp-tool

npm install -g whistle-mcp-tool

2.在 Cursor 中配置 MCP 服务

{
  "mcpServers": {
    "Whistle MCP": {
      "command": "whistle-mcp",
      "args": [
	    "--host=<如需指定 IP,可以增加该参数控制>"
        "--port=<如需指定端口,可以增加该参数控制>"
      ]
    }
  }
}

3.配置完成，开始使用

📢 使用建议

建议使用 Claude 3.7 Sonnet ，表现最好
建议在 Prompt 中加上「接口中不需要含有转义符和换行符」和「 Mock 数据应该是 JSON 格式」，这样子 AI 的输出会更标准

截图

[工具] ZIP-MCP-Server

项目简介

ZIP MCP Server 是一个基于 fastMCP 和 zip.js 的压缩服务器，实现了 Model Context Protocol (MCP) 协议。本项目提供了全参数可控的 ZIP 压缩、解压缩和查询压缩包信息功能。

功能特点

支持文件和数据的压缩与解压缩
支持多文件打包压缩
提供压缩级别控制 (0-9)
支持密码保护和加密强度设置
提供压缩包元数据查询功能

项目链接

如果觉得项目不错的话，欢迎点个 Star ⭐ 支持！

https://github.com/7gugu/zip-mcp

范例截图

图中使用的是 Raycast + MCP 插件

安装

您可以使用npm全局安装ZIP MCP Server：

npm install -g zip-mcp

MCP 配置

安装后，您可以在MCP JSON配置文件中配置ZIP MCP：

{
  "mcpServers": {
    "zip-mcp": {
      "command": "zip-mcp",
      "args": []
    }
  }
}

将 MCP JSON 配置到 AI 客户端中

Claude 客户端: https://modelcontextprotocol.io/quickstart/user
Raycast: 需要安装 MCP 插件
Cursor: https://docs.cursor.com/context/model-context-protocol#configuring-mcp-servers

联系方式

邮箱: gz7gugu@qq.com
播客: https://7gugu.com

Water Sort Puzzle by Claude 3.7 Sonnet

简介

尝试用AI生成了最近很火的水瓶分类小游戏，只能说逻辑部分AI能胜任，但UI部分就别指望了，还是得手工画。游戏我发布到itch.io上了，可以点进来玩玩，游戏是用PIXI做的，没有对触屏做适配，所以手机端点进去玩不了是符合预期的。

游戏截图

游戏链接

https://7gugu.itch.io/water-sort-puzzle

Dock Video Player – 一款可以在Dock栏上播放视频的播放器

Introduction / 简介

A program that plays videos in the Mac Dock bar by utilizing the Dock icon dynamic replacement API.

利用Dock图标动态替换API，实现的一款在Mac Dock栏播放视频的程序。

Usage Guide / 使用教程

Run npm install to install dependencies (ffmpeg-static installation might have issues, it’s recommended to use a China-based mirror)
Run npm start to launch the Electron application
Load a video
Click play to see the video displayed in the Dock bar
The repository includes a BadApple sample video. For the best experience, set audio playback to 1x speed and start it 0.2 seconds earlier

运行npm install安装依赖（ffmpeg-static安装可能会有点问题，建议直接使用国内镜像源下载）
运行npm start启动Electron应用
加载视频
点击播放即可在Dock栏中看到视频画面
仓库中提供了BadApple的范例视频，建议将音频的播放时间设置为1倍速+提前0.2秒播放，体验最佳

Github

https://github.com/7gugu/Dock-Video-Player

Demo Video / 演示视频

https://www.bilibili.com/video/BV1679oYKEdX

Finally / 最后

If you like this project, please give me a star. Thank you.

如果你喜欢这个项目，请给予我一个star，谢谢。

Contact / 联系方式

Firefox Addon 踩坑指南

最近为了提高工作效率，给Firefox开发了一个切换whistle代理的插件(Addon)，但是Firefox在manifestV3上有很多规范都与Chrome不相同，且中文互联网关于这方面的知识很少，所以在此总结了一些我遇到的坑点，希望可以帮助大家。

开发模板

Firefox虽然没有太多关于V3的教程，但是插件开发还不至于从0开始搭建框架，此处推荐一个React+TS的开发模板，通过这个开发模板，可以“快速”打包出Chrome和Firefox平台的插件。

https://github.com/aeksco/react-typescript-web-extension-starter

该附加组件无法安装,因为它似乎已损坏

Firefox官方虽然说可以Self-distribute，但是文档的描述有问题，没有给出正确打包XPI的方式。直接将产物压缩成zip后，将拓展名改成xpi，Firefox依旧是不能正确识别的。

正确的方法应该是，将产物压缩成zip后，提交到AMO签名，签名后Firefox浏览器就能安装了。

操作流程：

1.提交本地产物到AMO上，选择自托管（https://addons.mozilla.org/zh-CN/developers/addon/submit/distribution）

2.审核签名完成后将XPI下载至本地即可

background.service_worker is currently disabled

这是因为在manifestV3中，Firefox与Chrome针对后台程序的处理有差异导致的。其实Firefox也是能使用后台程序的，但是不能直接写成service_worker。直接用service_worker，Firefox将会报错。

正确的写法应该是使用”scripts”代替”service_worker”，Firefox的后台程序变成了background_script。

The extension ID is required in Manifest Version 3 and above

上传产物压缩包到AMO的时候，可能会遇到这个问题，这个是因为Firefox在mainfestV3及以上版本中要求增加一个插件ID号和最低版本限制导致的，需要在manifest.json中增加该字段才可以。

最低版本号可以参考你所用的浏览器API限制来决定，id一般使用<插件名>+@+<个人域名>就可以了（只要保证ID唯一即可）。

参考插件

[Firefox Addon] Whistle-Switcher 快捷切换 Whistle 规则插件

之前在Blog中分享过一次这个调试插件，可以以这个插件为基准来检查自己的插件是否符合上架要求。

[Firefox Addon] Whistle-Switcher 快捷切换 Whistle 规则插件

什么是 Whistle

whistle(读音[ˈwɪsəl]，拼音[wēisǒu])基于 Node 实现的跨平台 web 调试代理工具，类似的工具有 Windows 平台上的Fiddler，主要用于查看、修改 HTTP 、HTTPS 、Websocket 的请求、响应。

面向人群

终端开发
软件测试

背景

之前了解到 Chrome 下原来有一个 whistle 的快速切换插件可以用，但是搜了一下发现 Firefox 还没有，因此想要自己动手改造一个可以给 Firefox 使用的快速切换插件，提高工作效率。

功能

快捷切换浏览器代理
规则管理
- 单一规则开关
- 规则分组展示
黑名单设置
状态设置
- 多规则开关
- 切换规则后自动刷新
- 展示代理地址和代理端口
- 快捷跳转 whistle 管理页面
状态展示
- 是否启用代理
- 启用代理规则数量

截图

下载地址

为了安全考量，直接使用 Firefox 的拓展商店安装即可。

Github仓库

https://github.com/7gugu/whistle-firefox

联系方式

如果有使用问题，可以优先通过邮箱和 Firefox 评论区提交问题，正常情况下在一个工作日内就会回复。（公共假期不定期回复）

Email：gz7gugu@qq.com

[Raycast] Protobuf2TypeScript

A Raycast script which help front-end devloper to convert *.protobuf file into *.d.ts file.

Installtion Link

Screenshots

Example

Convert this:

message Person {
  string name = 1;
  int32 id = 2;
  bool isFriend = 3;
  repeated PhoneNumber phones = 4;
}

message PhoneNumber {
  string number = 1;
  PhoneType type = 2;
}

message AddressBook {
  repeated Person people = 1;
}

into this:

interface Person {
  name: string;
  id: number;
  isFriend: boolean;
  phones: PhoneNumber[];
}

interface PhoneNumber {
  number: string;
  type: PhoneType;
}

interface AddressBook {
  people: Person[];
}

Idea From

protobuf-to-typescript

Cocos 2.4.7 Building Assets卡住问题

关键词：构建资源、Building Assets、资源刷新、Prefab

背景

下午开发的时候想要构建一下游戏产物，但是一直会卡在资源打包上，白思不得其解，搜了一下官方论坛也没找到相关的问题的解决方法。

定位

reset大法一个个回滚到指定的commit上跑一下构建，直到找到会卡住的那个commit再做分析

// 命令行构建
/Applications/CocosCreator/Creator/2.4.7/CocosCreator.app/Contents/MacOS/CocosCreator --path /Users/7gugu/Documents/gitlab/genshinImpact --build