# Anycall 部署指南

## URL 格式说明

### ✅ 推荐使用独立页面URL
FAQ和Contact现在都是独立页面，推荐使用以下格式：

**推荐格式：**
- `https://www.anycall.online/faq` - FAQ页面
- `https://www.anycall.online/contact` - Contact页面
- `https://www.anycall.online/about` - About页面
- `https://www.anycall.online/blog` - Blog页面
- `https://www.anycall.online/careers` - Careers页面
- `https://www.anycall.online/privacy` - Privacy Policy
- `https://www.anycall.online/terms` - Terms of Service

### 传统Hash锚点格式（仅用于首页内部导航）
在首页内部导航时，可以使用hash锚点：

✅ **正确格式：**
- `https://www.anycall.online/#features` - 首页Features部分

❌ **不再推荐：**
- `https://www.anycall.online/#contact` - 请改用 `/contact`
- `https://www.anycall.online/#faq` - 请改用 `/faq`

### 为什么需要 `/`？

在URL中，hash片段（`#`后面的部分）必须在路径之后。标准的URL结构是：
```
protocol://domain/path#hash
```

如果路径为根路径，也必须包含 `/`：
```
protocol://domain/#hash
```

## 部署配置

### Vercel 部署
项目包含 `vercel.json` 配置文件，它会：
1. 将所有请求重写到 `index.html`（支持SPA路由）
2. 添加安全header

### Netlify 部署
项目包含 `_redirects` 和 `public/_redirects` 配置文件，它会：
1. 将所有请求重定向到 `index.html` with 200 status（支持SPA路由）

### 自定义服务器
如果使用自定义服务器（如Nginx或Apache），需要配置：

#### Nginx 配置示例：
```nginx
server {
    listen 80;
    server_name anycall.online www.anycall.online;

    root /var/www/anycall;
    index index.html;

    location / {
        try_files $uri $uri/ /index.html;
    }

    # 确保hash片段被正确处理
    location ~ ^/[^/]*#.* {
        rewrite ^(.*)$ / permanent;
    }
}
```

#### Apache .htaccess 配置示例：
```apache
<IfModule mod_rewrite.c>
    RewriteEngine On
    RewriteBase /
    
    # 处理所有请求到 index.html
    RewriteCond %{REQUEST_FILENAME} !-f
    RewriteCond %{REQUEST_FILENAME} !-d
    RewriteRule . /index.html [L]
</IfModule>
```

## Hash 锚点实现

项目使用以下机制确保hash锚点正常工作：

1. **RouterContext.tsx**: 多层hash处理逻辑
   - 初始加载时检测hash
   - 页面变化时保持hash
   - 重试机制（最多10次，每次间隔100ms）

2. **App.tsx**: 额外的页面加载后处理
   - 监听window.load事件
   - 确保所有资源加载完成后滚动

3. **globals.css**: scroll-margin-top配置
   - 移动端：7rem (112px)
   - 平板端：7.5rem (120px)
   - 桌面端：8rem (128px)

## 测试URL

部署后，请测试以下URL：

1. **首页**
   - https://www.anycall.online/
   - https://anycall.online/

2. **独立页面（推荐）**
   - https://www.anycall.online/faq - FAQ页面
   - https://www.anycall.online/contact - 联系我们
   - https://www.anycall.online/about - 关于我们
   - https://www.anycall.online/blog - 博客
   - https://www.anycall.online/careers - 招聘
   - https://www.anycall.online/privacy - 隐私政策
   - https://www.anycall.online/terms - 服务条款

3. **首页内部导航（Hash锚点）**
   - https://www.anycall.online/#features - Features部分

## 故障排查

### 页面导航不工作？

1. **检查URL格式**
   - 使用完整路径：`/faq` 而不是 `/#faq`
   - 独立页面无需hash符号

2. **检查浏览器控制台**
   - 打开开发者工具查看console.log
   - RouterContext会输出调试信息

3. **清除浏览器缓存**
   - 按 Ctrl+Shift+R (Windows) 或 Cmd+Shift+R (Mac)
   - 或使用无痕模式测试

4. **清除浏览器缓存**
   - 按 Ctrl+Shift+R (Windows) 或 Cmd+Shift+R (Mac)

### URL重定向问题？

1. **检查服务器配置**
   - 确保服务器正确配置了SPA重写规则

2. **检查DNS设置**
   - 确保 `anycall.online` 和 `www.anycall.online` 都正确解析

3. **检查HTTPS重定向**
   - 确保HTTP自动重定向到HTTPS

## 性能优化

1. **启用Gzip压缩**
2. **启用浏览器缓存**
3. **使用CDN**
4. **图片优化**

## 安全配置

项目已包含以下安全header（在vercel.json中）：
- `X-Content-Type-Options: nosniff`
- `X-Frame-Options: DENY`
- `X-XSS-Protection: 1; mode=block`

建议添加：
- HTTPS强制（HSTS header）
- Content-Security-Policy