vps_web/README.md

# 云服务器价格对比 (VPS Price)

云服务器 VPS 价格对比网站：支持后台手动添加/编辑数据、广告位（Google AdSense）、SEO 优化、每条数据跳转官网。

## 功能

- **前台**：多厂商 VPS 方案对比表，按厂商/区域/内存筛选，人民币/美元切换，每条可点击「官网」跳转
- **后台**：登录后添加、编辑、删除云服务器方案，支持填写官网链接
- **广告位**：页头、表格上方、页脚三处占位，可接入 Google AdSense
- **SEO**：meta 描述/关键词、canonical、Open Graph、sitemap.xml、robots.txt、JSON-LD 结构化数据

## 运行

```bash
# 安装依赖
pip install -r requirements.txt

# 首次运行：初始化数据库并导入示例数据
python init_db.py

# 开发时直接跑
python app.py
# 或
python main.py
```

- 前台：<http://127.0.0.1:5001>
- 后台：<http://127.0.0.1:5001/admin>（默认密码见下方环境变量）

### 生产环境：Gunicorn 后台常驻（Ubuntu systemd）

让 gunicorn 一直在后台运行，断线自启、开机自启：

**1. 安装 gunicorn**
```bash
cd /opt/vps_price   # 或你的项目目录
python3 -m venv venv
source venv/bin/activate
pip install -r requirements.txt
pip install gunicorn
```

**2. 创建 systemd 服务**
```bash
sudo nano /etc/systemd/system/vps_price.service
```

粘贴下面内容，**把 `/opt/vps_price` 和 `/opt/vps_price/venv` 改成你实际的项目路径**（若用 root 跑可把 `User=www-data` 改为 `User=root`）：

```ini
[Unit]
Description=VPS Price Gunicorn
After=network.target

[Service]
Type=notify
User=www-data
Group=www-data
WorkingDirectory=/opt/vps_price
Environment="PATH=/opt/vps_price/venv/bin"
ExecStart=/opt/vps_price/venv/bin/gunicorn -w 4 -b 127.0.0.1:5001 app:app
ExecReload=/bin/kill -s HUP $MAINPID
Restart=always
RestartSec=3

[Install]
WantedBy=multi-user.target
```

**3. 启用并启动**
```bash
sudo systemctl daemon-reload
sudo systemctl enable vps_price
sudo systemctl start vps_price
sudo systemctl status vps_price
```

之后 gunicorn 会一直后台运行，重启服务器也会自动起来。常用命令：
- 查看状态：`sudo systemctl status vps_price`
- 重启：`sudo systemctl restart vps_price`
- 看日志：`journalctl -u vps_price -f`

## 环境变量（可选）

| 变量 | 说明 | 默认 |
|------|------|------|
| `ADMIN_PASSWORD` | 后台登录密码 | `admin123` |
| `SECRET_KEY` | Flask 会话密钥 | 开发用固定值 |
| `SITE_URL` | 站点完整 URL（SEO、sitemap） | `https://example.com` |
| `DB_HOST` | MySQL 主机 | `199.168.137.123` |
| `DB_PORT` | MySQL 端口 | `3309` |
| `DB_USER` | MySQL 用户名 | `vps` |
| `DB_NAME` | MySQL 数据库名 | `vps` |
| `DB_PASSWORD` | MySQL 密码 | （见 config.py） |
| `DATABASE_URL` | 完整数据库连接串（若设置则优先于上述 DB_*） | 由 DB_* 拼成 MySQL URI |

生产环境请务必设置 `ADMIN_PASSWORD`、`SECRET_KEY`、`SITE_URL`，并妥善保管 `DB_PASSWORD`。

当前默认站点域名：`https://vps.ddrwode.cn`（可通过环境变量 `SITE_URL` 覆盖）。

### Ubuntu：Nginx + HTTPS（Let's Encrypt）

在 **Ubuntu 服务器**上按顺序执行即可为 `vps.ddrwode.cn` 启用 HTTPS。

**1. 安装 Nginx 和 Certbot**

```bash
sudo apt update
sudo apt install nginx certbot python3-certbot-nginx -y
sudo systemctl enable nginx
sudo systemctl start nginx
```

**2. 先写 Nginx 配置（只开 80，方便 Certbot 验证域名）**

```bash
sudo nano /etc/nginx/sites-available/vps.ddrwode.cn
```

写入（确保本机 Flask/gunicorn 已监听 5001 端口）：

```nginx
server {
    listen 80;
    server_name vps.ddrwode.cn;
    location / {
        proxy_pass http://127.0.0.1:5001;
        proxy_set_header Host $host;
        proxy_set_header X-Real-IP $remote_addr;
        proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
        proxy_set_header X-Forwarded-Proto $scheme;
    }
}
```

保存后启用并检查、重载：

```bash
sudo ln -sf /etc/nginx/sites-available/vps.ddrwode.cn /etc/nginx/sites-enabled/
sudo nginx -t
sudo systemctl reload nginx
```

**3. 申请 HTTPS 证书（自动改 Nginx 为 443）**

```bash
sudo certbot --nginx -d vps.ddrwode.cn
```

按提示输入邮箱、同意条款；选「重定向 HTTP 到 HTTPS」即可。Certbot 会自动加上 443 和证书路径。

**4. 确认访问**

- 打开：`https://vps.ddrwode.cn`
- 证书会自动续期（`certbot renew`），可加定时任务：`sudo certbot renew --dry-run`

项目根目录下的 `deploy/nginx-vps.ddrwode.cn.conf` 为上述配置的参考副本，便于你复制到服务器。

## 接入 Google 广告

1. 在 [Google AdSense](https://www.google.com/adsense/) 注册并获取广告代码。
2. 打开模板 `templates/index.html`，找到三个 `ad-slot` 区域（`id="ad-slot-1"`、`ad-slot-2`、`ad-slot-3`）。
3. 将注释中的示例替换为你的 AdSense 代码，或把获得的 `<script>` 与 `<ins>` 粘贴到对应 div 内。

广告位位置：页头横幅、表格上方、页脚前。

## 项目结构

```
vps_price/
├── app.py              # Flask 应用、路由、后台
├── config.py           # 配置（含环境变量）
├── models.py           # 数据库模型 VPSPlan
├── init_db.py          # 初始化 DB + 导入示例数据
├── requirements.txt
├── templates/
│   ├── index.html      # 首页（含 SEO、广告位）
│   └── admin/
│       ├── login.html
│       ├── dashboard.html
│       └── plan_form.html
└── static/
    ├── css/style.css
    ├── css/admin.css
    └── js/main.js
```

## SEO 说明

- **meta**：description、keywords、canonical、Open Graph
- **sitemap**：`/sitemap.xml`（需在线上将 `SITE_URL` 设为真实域名）
- **robots**：`/robots.txt` 允许抓取并指向 sitemap
- **JSON-LD**：WebApplication + Table 结构化数据，便于搜索引擎理解

价格与官网链接以各云厂商为准，后台可随时修改。