Upload 17 files

README.md

@@ -1,149 +1,147 @@
----
-title: Page Shot
-emoji: 📈
-colorFrom: pink
-colorTo: blue
-sdk: docker
-pinned: false
-license: mit
----
-
-Check out the configuration reference at https://huggingface.co/docs/hub/spaces-config-reference
-
-# Page Screenshot API
-
-A web service that captures screenshots of web pages using Puppeteer.
-
-## Features
-- Web page screenshot capture
-- Customizable dimensions (width/height)
-- Adjustable image quality
-- Rate limiting for API protection
-- CORS enabled for cross-origin requests
-
-## API Usage
-
-### POST /screenshot
-
-Capture a screenshot of a web page.
-
-**Request Body:**
-```json
-{
-  "url": "https://example.com",
-  "width": 1920,
-  "height": 1080,
-  "quality": 80
-}
-```
-
-**Parameters:**
-- `url` (required): The URL of the webpage to capture
-- `width` (optional): Screenshot width in pixels (default: 1920, range: 100-4000)
-- `height` (optional): Screenshot height in pixels (default: 1080, range: 100-4000)
-- `quality` (optional): JPEG quality (default: 80, range: 1-100)
-
-**Response:**
-Returns the screenshot as a JPEG image.
-
-### GET /
-
-Health check endpoint that returns API status.
-
-## Example Usage
-
-```bash
-curl -X POST https://your-app.railway.app/screenshot \
-  -H "Content-Type: application/json" \
-  -d '{"url": "https://example.com", "width": 1280, "height": 720}' \
-  --output screenshot.jpg
-```
-
-## Rate Limiting
-
-- 100 requests per 15 minutes per IP address
-
-## Deployment
-
-This application can be deployed on various platforms:
-- Hugging Face Spaces (Docker)
-- Railway
-- Render.com
-- Vercel
-
-For detailed deployment instructions, see `DEPLOYMENT_GUIDE.md`.
-
-## Railway部署指南
-
-### 1. 准备部署
-确保你的项目包含以下文件：
-- `Dockerfile` - 容器化配置
-- `railway.toml` - Railway部署配置
-- `package.json` - 依赖和启动脚本
-
-### 2. 部署到Railway
-有两种方式部署到Railway：
-
-#### 方式一：通过GitHub连接（推荐）
-1. 将代码推送到GitHub仓库
-2. 访问 [Railway.app](https://railway.app)
-3. 登录并点击 "New Project"
-4. 选择 "Deploy from GitHub repo"
-5. 选择你的仓库
-6. Railway会自动检测Dockerfile并开始部署
-
-#### 方式二：使用Railway CLI
-```bash
-# 安装Railway CLI
-npm install -g @railway/cli
-
-# 登录Railway
-railway login
-
-# 初始化项目
-railway init
-
-# 部署
-railway up
-```
-
-### 3. 环境变量配置
-在Railway控制台的Variables标签中添加：
-- `NODE_ENV=production`
-- `PORT` (Railway自动设置，无需手动配置)
-
-### 4. 资源配置
-推荐配置：
-- CPU: 1 vCPU
-- Memory: 1GB RAM
-
-这些配置已在 `railway.toml` 中预设。
-
-### 5. 自定义域名（可选）
-在Railway控制台的Settings > Domains中可以：
-- 使用Railway提供的免费子域名
-- 绑定你自己的域名
-
-### 6. 监控和日志
-- 在Railway控制台的Deployments标签查看部署状态
-- 在Metrics标签监控资源使用情况
-- 在Variables标签管理环境变量
-
-### 故障排除
-如果部署失败，检查：
-1. Dockerfile语法是否正确
-2. package.json中的start脚本是否正确
-3. 依赖包是否都已安装
-4. 内存使用是否超出限制
-
-### 部署后测试
-```bash
-# 健康检查
-curl https://your-app.railway.app/
-
-# 截图测试
-curl -X POST https://your-app.railway.app/screenshot \
-  -H "Content-Type: application/json" \
-  -d '{"url": "https://google.com"}' \
-  --output test-screenshot.jpg
+---
+title: Page Screenshot API
+emoji: 📸
+colorFrom: blue
+colorTo: green
+sdk: docker
+pinned: false
+license: mit
+---
+
+# Page Screenshot API
+
+A web service that captures screenshots of web pages using Puppeteer.
+
+## Features
+- Web page screenshot capture
+- Customizable dimensions (width/height)
+- Adjustable image quality
+- Rate limiting for API protection
+- CORS enabled for cross-origin requests
+
+## API Usage
+
+### POST /screenshot
+
+Capture a screenshot of a web page.
+
+**Request Body:**
+```json
+{
+  "url": "https://example.com",
+  "width": 1920,
+  "height": 1080,
+  "quality": 80
+}
+```
+
+**Parameters:**
+- `url` (required): The URL of the webpage to capture
+- `width` (optional): Screenshot width in pixels (default: 1920, range: 100-4000)
+- `height` (optional): Screenshot height in pixels (default: 1080, range: 100-4000)
+- `quality` (optional): JPEG quality (default: 80, range: 1-100)
+
+**Response:**
+Returns the screenshot as a JPEG image.
+
+### GET /
+
+Health check endpoint that returns API status.
+
+## Example Usage
+
+```bash
+curl -X POST https://your-app.railway.app/screenshot \
+  -H "Content-Type: application/json" \
+  -d '{"url": "https://example.com", "width": 1280, "height": 720}' \
+  --output screenshot.jpg
+```
+
+## Rate Limiting
+
+- 100 requests per 15 minutes per IP address
+
+## Deployment
+
+This application can be deployed on various platforms:
+- Hugging Face Spaces (Docker)
+- Railway
+- Render.com
+- Vercel
+
+For detailed deployment instructions, see `DEPLOYMENT_GUIDE.md`.
+
+## Railway部署指南
+
+### 1. 准备部署
+确保你的项目包含以下文件：
+- `Dockerfile` - 容器化配置
+- `railway.toml` - Railway部署配置
+- `package.json` - 依赖和启动脚本
+
+### 2. 部署到Railway
+有两种方式部署到Railway：
+
+#### 方式一：通过GitHub连接（推荐）
+1. 将代码推送到GitHub仓库
+2. 访问 [Railway.app](https://railway.app)
+3. 登录并点击 "New Project"
+4. 选择 "Deploy from GitHub repo"
+5. 选择你的仓库
+6. Railway会自动检测Dockerfile并开始部署
+
+#### 方式二：使用Railway CLI
+```bash
+# 安装Railway CLI
+npm install -g @railway/cli
+
+# 登录Railway
+railway login
+
+# 初始化项目
+railway init
+
+# 部署
+railway up
+```
+
+### 3. 环境变量配置
+在Railway控制台的Variables标签中添加：
+- `NODE_ENV=production`
+- `PORT` (Railway自动设置，无需手动配置)
+
+### 4. 资源配置
+推荐配置：
+- CPU: 1 vCPU
+- Memory: 1GB RAM
+
+这些配置已在 `railway.toml` 中预设。
+
+### 5. 自定义域名（可选）
+在Railway控制台的Settings > Domains中可以：
+- 使用Railway提供的免费子域名
+- 绑定你自己的域名
+
+### 6. 监控和日志
+- 在Railway控制台的Deployments标签查看部署状态
+- 在Metrics标签监控资源使用情况
+- 在Variables标签管理环境变量
+
+### 故障排除
+如果部署失败，检查：
+1. Dockerfile语法是否正确
+2. package.json中的start脚本是否正确
+3. 依赖包是否都已安装
+4. 内存使用是否超出限制
+
+### 部署后测试
+```bash
+# 健康检查
+curl https://your-app.railway.app/
+
+# 截图测试
+curl -X POST https://your-app.railway.app/screenshot \
+  -H "Content-Type: application/json" \
+  -d '{"url": "https://google.com"}' \
+  --output test-screenshot.jpg
 ```

hf-deploy/Dockerfile

@@ -1,22 +1,16 @@
-# 轻量级 HF Spaces Dockerfile
+# 最简 HF Spaces Dockerfile - 修复版
 FROM ghcr.io/puppeteer/puppeteer:21.5.2
 
-# 切换到 root 用户进行安装
-USER root
-
-# 安装额外的字体和依赖
-RUN apt-get update && apt-get install -y \
-    fonts-liberation \
-    fonts-dejavu-core \
-    && rm -rf /var/lib/apt/lists/*
-
-# 设置工作目录
+# 直接设置工作目录
 WORKDIR /usr/src/app
 
 # 复制 package 文件
 COPY package*.json ./
 
-# 安装依赖
+# 切换到 root 用户安装依赖
+USER root
+
+# 安装 Node.js 依赖
 RUN npm ci --only=production && npm cache clean --force
 
 # 复制应用代码
@@ -28,7 +22,6 @@ USER pptruser
 # 设置环境变量
 ENV NODE_ENV=production
 ENV PORT=7860
-ENV PUPPETEER_EXECUTABLE_PATH=/usr/bin/google-chrome-stable
 
 # 暴露端口
 EXPOSE 7860

hf-deploy/server.js

@@ -9,15 +9,15 @@ const PORT = process.env.PORT || 7860;
 
 // 中间件配置 - HF Spaces 优化
 app.use(helmet({
-  contentSecurityPolicy: false // HF Spaces 需要
+  contentSecurityPolicy: false
 }));
 app.use(cors());
 app.use(express.json({ limit: '10mb' }));
 
-// 速率限制 - HF Spaces 调整
+// 速率限制
 const limiter = rateLimit({
   windowMs: 15 * 60 * 1000,
-  max: 30, // 进一步降低限制
+  max: 30,
   message: {
     error: 'Too many requests, please try again later.'
   }
@@ -39,11 +39,10 @@ app.get('/', (req, res) => {
   });
 });
 
-// 截图API端点 - 增强错误处理
+// 截图API端点
 app.post('/screenshot', async (req, res) => {
   const { url, width = 1280, height = 720, quality = 75 } = req.body;
 
-  // 参数验证
   if (!url) {
     return res.status(400).json({
       error: 'URL is required',
@@ -51,10 +50,8 @@ app.post('/screenshot', async (req, res) => {
     });
   }
 
-  // URL格式验证
   try {
     const urlObj = new URL(url);
-    // 检查协议
     if (!['http:', 'https:'].includes(urlObj.protocol)) {
       return res.status(400).json({
         error: 'Only HTTP and HTTPS URLs are supported'
@@ -66,7 +63,6 @@ app.post('/screenshot', async (req, res) => {
     });
   }
 
-  // 分辨率验证 - HF Spaces 更严格限制
   if (width < 100 || width > 1600 || height < 100 || height > 1200) {
     return res.status(400).json({
       error: 'Width must be 100-1600px, height must be 100-1200px for HF Spaces'
@@ -75,8 +71,10 @@ app.post('/screenshot', async (req, res) => {
 
   let browser;
   try {
-    // 启动浏览器 - HF Spaces 专用配置
-    const browserOptions = {
+    console.log('Launching browser...');
+    
+    // HF Spaces 优化配置 - 使用 Puppeteer 镜像的默认 Chrome
+    browser = await puppeteer.launch({
       headless: 'new',
       args: [
         '--no-sandbox',
@@ -89,35 +87,21 @@ app.post('/screenshot', async (req, res) => {
         '--disable-extensions',
         '--disable-background-timer-throttling',
         '--disable-backgrounding-occluded-windows',
-        '--disable-renderer-backgrounding',
-        '--disable-features=TranslateUI',
-        '--disable-default-apps',
-        '--no-default-browser-check',
-        '--disable-background-networking'
+        '--disable-renderer-backgrounding'
       ]
-    };
-
-    // 在 HF Spaces 中使用系统 Chrome
-    if (process.env.PUPPETEER_EXECUTABLE_PATH) {
-      browserOptions.executablePath = process.env.PUPPETEER_EXECUTABLE_PATH;
-    }
-
-    console.log('Launching browser...');
-    browser = await puppeteer.launch(browserOptions);
+    });
 
     const page = await browser.newPage();
     
-    // 设置视窗大小
     await page.setViewport({
       width: parseInt(width),
       height: parseInt(height),
       deviceScaleFactor: 1
     });
 
-    // 设置用户代理和其他页面选项
     await page.setUserAgent('Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36');
     
-    // 拦截不必要的资源以提高性能
+    // 拦截资源以提高性能
     await page.setRequestInterception(true);
     page.on('request', (req) => {
       const resourceType = req.resourceType();
@@ -130,18 +114,15 @@ app.post('/screenshot', async (req, res) => {
 
     console.log(`Navigating to: ${url}`);
     
-    // 访问页面 - HF Spaces 更短超时
     await page.goto(url, {
-      waitUntil: 'domcontentloaded', // 更快的等待条件
-      timeout: 15000 // 15秒超时
+      waitUntil: 'domcontentloaded',
+      timeout: 15000
     });
 
-    // 等待页面稳定
     await page.waitForTimeout(1000);
 
     console.log('Taking screenshot...');
     
-    // 截图
     const screenshot = await page.screenshot({
       type: 'jpeg',
       quality: Math.max(10, Math.min(100, parseInt(quality))),
@@ -150,7 +131,6 @@ app.post('/screenshot', async (req, res) => {
 
     console.log(`Screenshot taken: ${screenshot.length} bytes`);
 
-    // 设置响应头
     res.set({
       'Content-Type': 'image/jpeg',
       'Content-Length': screenshot.length,
@@ -167,7 +147,6 @@ app.post('/screenshot', async (req, res) => {
       message: error.message
     };
     
-    // 根据错误类型提供更好的错误信息
     if (error.message.includes('timeout')) {
       errorResponse.suggestion = 'Try a simpler webpage or reduce timeout';
     } else if (error.message.includes('net::')) {
@@ -187,7 +166,7 @@ app.post('/screenshot', async (req, res) => {
   }
 });
 
-// HF Spaces 演示界面 - 改进版
+// HF Spaces 演示界面
 app.get('/demo', (req, res) => {
   res.send(`
     <!DOCTYPE html>