这是一个强大的多浏览器环境管理工具,专注于浏览器指纹管理、状态保存和反检测功能。基于electron, puppeteer, express 开发,是你学习的好项目。
这个指纹浏览器使用的环境是,你需要多开网站进行项目管理时,可以对多个账号进行管理使用,方便来回切换账号使用。
截图
技术栈
前端: React + TypeScript + Tailwind CSS
后端: Express + Node.js
自动化: Puppeteer + Puppeteer Stealth
桌面: Electron
工具链: Vite + TypeScript
安装
# 安装依赖
npm install
# 开发模式
npm run electron:dev
# 构建应用
npm run package
```
开发指南
### 项目结构
src/
├── browsers/ # 浏览器管理核心
├── config/ # 配置文件
├── electron/ # Electron 主进程
├── client/ # React 前端
├── middleware/ # Express 中间件
├── routes/ # API 路由
├── types/ # TypeScript 类型
└── utils/ # 工具函数
开发命令
# 启动开发服务器
npm run server:dev
# 启动前端开发
npm run client:dev
# 类型检查
npm run type-check
# 构建
npm run build
安装注意事项
设置淘宝镜像,npm资源地址国内访问受限,这一步是为了加快资源下载速度。
项目根目录下创建一个 .npmrc 文件,将需要下载的链接放上,在 `npm install` 安装时即可直接走 `.npmrc` 文件。
registry=https://registry.npmmirror.com
electron_mirror=https://npmmirror.com/mirrors/electron/
electron-builder-binaries_mirror=https://npmmirror.com/mirrors/electron-builder-binaries/
puppeteer_download_host=https://npmmirror.com/mirrors/
ELECTRON_BUILDER_BINARIES_MIRROR=https://npmmirror.com/mirrors/electron-builder-binaries/
PUPPETEER_DOWNLOAD_BASE_URL = https://cdn.npmmirror.com/binaries/chrome-for-testing
安装时碰到的问题
npm error command failed
npm error command sh -c node install.mjs
npm error PUPPETEER_DOWNLOAD_HOST is deprecated. Use PUPPETEER_DOWNLOAD_BASE_URL instead.
npm error Error: ERROR: Failed to set up Chrome v121.0.6167.85! Set "PUPPETEER_SKIP_DOWNLOAD" env variable to skip download.
npm error at file:///Users/gaofeifei/web/fingerprint-browser/node_modules/puppeteer/lib/esm/puppeteer/node/install.js:58:23
npm error at process.processTicksAndRejections (node:internal/process/task_queues:105:5)
原因
在19以下的版本,puppeteer 关联的 Chromium 的下载地址可以通过 puppeteer-download-host 进行配置,在 Puppeteer20.1 以上的版本则需要通过 PUPPETEER_DOWNLOAD_BASE_URL 进行配置
解决办法
#打开 `.npmrc`
#加入如下配置:
PUPPETEER_DOWNLOAD_BASE_URL = https://cdn.npmmirror.com/binaries/chrome-for-testing
保存后重新安装依赖,即可顺利运行。