# YouTube截图捕手
## 基本信息
- Slug: `tsubouchi-youtube_mcp`
- Source: modelscope
- Publisher: @tsubouchi/youtube_mcp
- Categories: image-and-video-processing / browser-automation
- Hosted: No
- License: Unknown
- Source URL: https://www.modelscope.cn/mcp/servers/@tsubouchi/youtube_mcp
## 简介
自动从YouTube视频和Shorts中以指定的时间间隔捕获并处理屏幕截图，支持自定义截图时间，并提供用于图像管理的API端点。
## 安装提示

```bash
Playwrigh-MCP-Server/ ├── functions/ # Cloud Functions │ ├── src/ # ソースコード │ │ ├── index.ts # メインエントリーポイント │ │ ├── screenshot.ts # スクリーンショット機能 │ │ ├── screenshots.ts # スクリーンショット一覧取得 │ │ ├── download-zip.ts # ZIPダウンロード機能 │ │ └── types.ts # 型定義 │ ├── package.json # 依存関係 │ └── tsconfig.json # TypeScript設定 ├── public/ # 静的ファイル │ └── index.html # メインページ ├── firebase.json # Firebase設定 └── storage.rules # Storageセキュリティルール
```

## MCP Server 详情

# YouTube MCP

这是一个从YouTube视频中自动截取屏幕截图的工具。支持YouTube Shorts和YouTube视频。

## 功能

### YouTube Shorts
- 每隔指定的n秒拍摄一次屏幕截图
- 最多可拍摄60张（如果视频超过60秒）
- 精确裁剪视频区域并保存到`tmp/`目录下
- 实时显示屏幕截图
- 可以选择下载所有或选定的图片为ZIP文件（Mac和Windows均可打开）

### YouTube 视频
- 每隔指定的n秒拍摄一次屏幕截图
- 最多可拍摄60张（如果视频超过60秒）
- 精确裁剪视频区域并保存到`tmp/`目录下
- 实时显示屏幕截图
- 可以选择下载所有或选定的图片为ZIP文件（Mac和Windows均可打开）

### TikTok
- 目前正在准备支持
- 请使用YouTube或YouTube Shorts的URL

## 技术栈

- Node.js 18
- Express
- Playwright
- Firebase Functions (Gen 2)
- Firebase Hosting
- Firebase Storage
- TypeScript
- Bootstrap CSS

## 项目结构

```
Playwrigh-MCP-Server/
├── functions/                 # Cloud Functions
│   ├── src/                  # ソースコード
│   │   ├── index.ts         # メインエントリーポイント
│   │   ├── screenshot.ts    # スクリーンショット機能
│   │   ├── screenshots.ts   # スクリーンショット一覧取得
│   │   ├── download-zip.ts  # ZIPダウンロード機能
│   │   └── types.ts         # 型定義
│   ├── package.json         # 依存関係
│   └── tsconfig.json        # TypeScript設定
├── public/                   # 静的ファイル
│   └── index.html           # メインページ
├── firebase.json            # Firebase設定
└── storage.rules            # Storageセキュリティルール
```


## API列表

### 获取屏幕截图
- **端点**: `/screenshot`
- **方法**: POST
- **参数**:
  ```json
  {
    "url": "YouTube URL",
    "interval": 1  // 间隔（秒）
  }
  ```
- **响应**:
  ```json
  {
    "success": true,
    "screenshots": [
      {
        "imageUrl": "带签名的URL",
        "time": "时间戳",
        "filename": "文件名"
      }
    ],
    "interval": 1
  }
  ```

### 获取屏幕截图列表
- **端点**: `/screenshots`
- **方法**: GET
- **响应**:
  ```json
  [
    {
      "filename": "文件名",
      "imageUrl": "带签名的URL",
      "time": "时间戳"
    }
  ]
  ```

### ZIP下载
- **端点**: `/download-zip`
- **方法**: POST
- **参数**:
  ```json
  {
    "filenames": ["文件名1", "文件名2"]
  }
  ```
- **响应**: ZIP文件

## GCP架构

### 使用的服务
1. Firebase Functions (Gen 2)
   - 运行时: Node.js 18
   - 区域: us-central1
   - 内存: 1GiB
   - CPU: 1
   - 超时: 540秒
   - 最大实例数: 100
   - 并发执行数: 80
   - 端点: https://api-ub7zp5pjra-uc.a.run.app

2. Firebase Storage
   - 存储桶: mcp-5e4b5.firebasestorage.app
   - 安全规则: 仅认证用户可访问

3. Firebase Hosting
   - 域名: https://mcp-5e4b5.web.app

### IAM权限设置

#### 用户权限
- `t@bonginkan.ai`
  - `roles/owner` (项目所有者)
  - `roles/run.admin` (Cloud Run管理员)

#### 服务账户权限
1. Cloud Functions
   - `33501462786-compute@developer.gserviceaccount.com`
     - `roles/run.admin`
     - `roles/run.developer`
     - `roles/run.invoker`
     - `roles/cloudfunctions.developer`
     - `roles/storage.admin`

2. Firebase Admin
   - `firebase-adminsdk-fbsvc@mcp-5e4b5.iam.gserviceaccount.com`
     - `roles/firebase.sdkAdminServiceAgent`
     - `roles/firebaseauth.admin`
     - `roles/iam.serviceAccountTokenCreator`
     - `roles/storage.admin`

3. Cloud Build
   - `33501462786@cloudbuild.gserviceaccount.com`
     - `roles/run.admin`
     - `roles/cloudfunctions.developer`
     - `roles/storage.admin`
     - `roles/artifactregistry.admin`
     - `roles/eventarc.admin`

## 实现细节

### 截图功能
- 使用Playwright控制无头浏览器
- 视口大小: 1280x720
- 使用临时目录暂时保存截图
- 上传到Firebase Storage后删除临时文件
- 签名URL有效期为15分钟

### 错误处理
- 在每个API端点捕获错误
- 以JSON格式返回错误信息
- 处理404端点
- 适当地处理500错误响应

### CORS配置
- 允许的源:
  - https://mcp-5e4b5.web.app
  - http://localhost:3001
- 允许的方法: GET, POST
- 凭证: 有效

### 安全性

- Firebase Storage的安全规则
- 签名URL的有效期设置（15分钟）
- 临时文件的适当删除

## 最新修订内容（2024-03-28）

### Bug修复
1. CORS设置改进
   - 明确指定允许的源
   - 启用凭据

2. 错误处理加强
   - 404错误以JSON格式响应
   - 500错误时提供详细的错误消息

3. Firebase Storage支持
   - 明确指定存储桶名称
   - 设置签名URL有效期为15分钟

4. Cloud Functions Gen 2优化
   - 优化内存设置（1GiB）
   - 调整超时设置（540秒）
   - 设置并发执行数（80）

### 功能改进
1. 截图功能
   - Playwright配置优化
   - 无头浏览器视口设置
   - 改进临时文件管理
   - 改进对YouTube Shorts的支持
   - 实现实时显示功能

2. API响应改进
   - 错误信息日语化
   - 统一响应格式
   - 标准化时间戳格式
   - 实现流式响应

3. 安全性增强
   - 更新Firebase Storage安全规则
   - 确保临时文件被彻底删除
   - 适当限制错误信息

4. 前端改进
   - 优化实时显示
   - 修正图片URL
   - 加强错误处理
   - 改进用户界面

## 设置

1. 克隆仓库
```bash
git clone https://github.com/tsubouchi/youtube_mcp.git
cd youtube_mcp
```


2. 安装依赖包
```bash
# プロジェクトルート
npm install

# Cloud Functions
cd functions
npm install
```


3. 安装Firebase CLI
```bash
npm install -g firebase-tools
```


4. 登录Firebase
```bash
firebase login
```


5. 初始化项目
```bash
firebase init
```


6. 部署
```bash
# Cloud Functions
cd functions
npm run deploy

# Firebase Hosting
cd ..
firebase deploy --only hosting
```


## 本地开发环境设置

1. 安装依赖包
```bash
# プロジェクトルート
npm install

# Cloud Functions
cd functions
npm install
```


2. 设置服务账号密钥
- 从Firebase控制台下载服务账号密钥
- 保存为`functions/service-account.json`

3. 设置环境变量
```bash
# functions/.env
GOOGLE_APPLICATION_CREDENTIALS=./service-account.json
```


4. 启动模拟器
```bash
cd functions
npm run serve
```


### 模拟器端口设置

模拟器使用以下端口：
- Functions: http://127.0.0.1:5001
- Emulator UI: http://127.0.0.1:4001

### API测试

1. 健康检查
```bash
curl http://localhost:5001/mcp-5e4b5/us-central1/api
```


2. 获取截图
```bash
curl -X POST http://localhost:5001/mcp-5e4b5/us-central1/api/screenshot \
  -H "Content-Type: application/json" \
  -H "Accept: application/json" \
  -d '{"url": "YouTube URL", "interval": 5}'
```


3. 获取截图列表
```bash
curl http://localhost:5001/mcp-5e4b5/us-central1/api/screenshots
```


4. ZIP下载
```bash
curl -X POST http://localhost:5001/mcp-5e4b5/us-central1/api/download-zip \
  -H "Content-Type: application/json" \
  -d '{"filenames": ["ファイル名1", "ファイル名2"]}'
```


### 注意事项

- 使用模拟器时，实际上会访问真实的Firebase Storage
- 服务账号密钥包含在`.gitignore`中，不会提交到仓库
- 可以通过模拟器UI查看函数执行情况和日志

## 注意事项

- Node.js 18将于2025年4月30日不再推荐使用
- 截图将保存在临时目录中，并在处理后被删除
- 如果视频长度超过60秒，只保存前60张截图
- Firebase Storage的安全规则仅允许认证用户访问
- 签名URL有效期仅为15分钟

## 重要提示

### 截图保存与ZIP化的规格
1. 截图保存
   - 所有截图都将暂时保存在`/tmp/screenshots/`目录下
   - 文件名格式为`screenshot_[时间戳]_[序号].png`
   - 临时文件在处理完成后仍然保留，直到拍摄新的截图时会被覆盖

2. 创建ZIP文件
   - 选定的截图将直接从`/tmp/screenshots/`读取
   - ZIP文件将暂时创建于`/tmp/screenshots/`，并在下载后删除
   - ZIP文件名格式为`screenshots_[时间戳].zip`

3. 临时文件管理
   - 临时文件需要定期清理
   - 推荐在拍摄新截图之前先删除旧文件

## 许可证

MIT License