212 lines
7.5 KiB
Markdown
212 lines
7.5 KiB
Markdown
# SEO 检测指南
|
||
|
||
## 一、本地快速检测
|
||
|
||
### 1. 只测爬虫识别逻辑（不启动服务）
|
||
|
||
```bash
|
||
cd server
|
||
node test-crawler-detection.js
|
||
```
|
||
|
||
会跑多组 User-Agent，看是否把百度/Google 等识别为爬虫、普通浏览器识别为非爬虫。
|
||
|
||
### 2. 端到端检测（需先启动服务）
|
||
|
||
**步骤 1：启动 SEO 服务器**
|
||
|
||
```bash
|
||
cd server
|
||
npm install
|
||
npm run start
|
||
```
|
||
|
||
**步骤 2：另开一个终端，运行检测**
|
||
|
||
```bash
|
||
cd server
|
||
npm run test
|
||
```
|
||
|
||
或指定地址：
|
||
|
||
```bash
|
||
# Windows PowerShell
|
||
$env:SEO_TEST_URL="http://localhost:3000"; node test-seo.js
|
||
|
||
# 若部署在线上，可测线上
|
||
$env:SEO_TEST_URL="https://www.xingfucha.cn"; node test-seo.js
|
||
```
|
||
|
||
脚本会：
|
||
|
||
- 用 **百度爬虫 UA** 请求首页、代理页、帮助中心、个人查询等
|
||
- 检查响应里是否有：`<title>`、`<meta name="description">`、`<meta name="keywords">`、`<link rel="canonical">`
|
||
- 用 **普通浏览器 UA** 再请求一遍，确认仍是 200（SPA 正常）
|
||
|
||
全部通过即说明：爬虫拿到的是 SEO 模板，普通用户拿到的是 SPA。
|
||
|
||
---
|
||
|
||
## 二、用 curl 手动检测
|
||
|
||
在服务器已启动的前提下，在终端执行：
|
||
|
||
### 爬虫应拿到“带 TDK 的 HTML”
|
||
|
||
```bash
|
||
# 模拟百度爬虫请求首页
|
||
curl -s -A "Baiduspider/2.0" http://localhost:3000/ | findstr /i "title description keywords canonical"
|
||
```
|
||
|
||
应能看到包含「天远数据」的 title，以及 description、keywords、canonical 等标签。
|
||
|
||
**Windows 下中文乱码说明**：服务器返回的是 UTF-8，CMD 默认是 GBK，直接 `curl … | findstr` 会看到乱码（如 `澶╄繙鏁版嵁`）或出现 “FINDSTR: 写入错误”。可任选一种方式解决：
|
||
|
||
```cmd
|
||
:: 方式 1：先切到 UTF-8 再执行（CMD）
|
||
chcp 65001
|
||
curl -s -A "Baiduspider/2.0" https://www.tianyuandb.com/ | findstr /i "title description"
|
||
```
|
||
|
||
```powershell
|
||
# 方式 2：PowerShell 下指定输出编码
|
||
[Console]::OutputEncoding = [System.Text.Encoding]::UTF8
|
||
curl -s -A "Baiduspider/2.0" https://www.tianyuandb.com/ | Select-String -Pattern "title|description"
|
||
```
|
||
|
||
```cmd
|
||
:: 方式 3：保存到文件后用编辑器打开（任意编码都行）
|
||
curl -s -A "Baiduspider/2.0" https://www.tianyuandb.com/ -o seo-test.html
|
||
:: 用记事本/VSCode 打开 seo-test.html，选 UTF-8 即可看到正确中文
|
||
```
|
||
|
||
```bash
|
||
# 看完整 HTML 前几行（含 <head>）
|
||
curl -s -A "Baiduspider/2.0" http://localhost:3000/ | more
|
||
```
|
||
|
||
### 普通用户应拿到 SPA（一般是带 script 的 index.html）
|
||
|
||
```bash
|
||
# 不带爬虫 UA，相当于普通浏览器
|
||
curl -s http://localhost:3000/ | findstr /i "script root app"
|
||
```
|
||
|
||
通常会有 `id="app"` 或大量 `<script>`，说明是前端 SPA。
|
||
|
||
### 看响应头（若用了 Node 中间件）
|
||
|
||
```bash
|
||
curl -I -A "Baiduspider/2.0" http://localhost:3000/
|
||
```
|
||
|
||
若返回里有 `X-SEOMiddleware: prerendered`，说明走的是 SEO 中间件、返回的是预渲染 HTML。
|
||
|
||
---
|
||
|
||
## 三、用浏览器“伪装”爬虫（可选）
|
||
|
||
1. 打开 Chrome DevTools (F12) → Network。
|
||
2. 右键列表头 → 勾选 “User-Agent”（或先在 More tools 里加自定义请求头）。
|
||
3. 使用扩展（如 “User-Agent Switcher”）把 UA 改成：
|
||
- `Baiduspider/2.0`
|
||
4. 刷新页面，在 Elements 里看 `<head>`：
|
||
- 应看到正确的 `<title>`、`<meta name="description">`、`<meta name="keywords">` 等。
|
||
|
||
注意：若前端是 SPA，同一 URL 在浏览器里仍可能先加载 SPA 再改 title；用 curl 用爬虫 UA 请求，更能代表爬虫真实看到的内容。
|
||
|
||
---
|
||
|
||
## 四、线上/生产环境检测
|
||
|
||
### 1. 用本机脚本测线上
|
||
|
||
```bash
|
||
cd server
|
||
$env:SEO_TEST_URL="https://www.xingfucha.cn"; node test-seo.js
|
||
```
|
||
|
||
（Linux/Mac 用 `export SEO_TEST_URL=https://www.xingfucha.cn` 再运行 `node test-seo.js`。）
|
||
|
||
### 2. 用 curl 测线上
|
||
|
||
```bash
|
||
curl -s -A "Baiduspider/2.0" https://www.xingfucha.cn/ | findstr /i "title description"
|
||
curl -I -A "Baiduspider/2.0" https://www.xingfucha.cn/
|
||
```
|
||
|
||
### 3. 使用搜索引擎工具
|
||
|
||
- **百度**： [百度搜索资源平台](https://ziyuan.baidu.com/) → 抓取诊断 / 抓取频次，看抓取是否成功。
|
||
- **Google**： [Google Search Console](https://search.google.com/search-console) → URL 检查，输入首页或内页 URL，查看“已编入索引”的页面快照。
|
||
|
||
---
|
||
|
||
## 五、检测结果对照
|
||
|
||
| 检测项 | 预期结果 |
|
||
|------------------|----------|
|
||
| 爬虫 UA 请求 | 返回 200，HTML 内含完整 title、description、keywords、canonical |
|
||
| 爬虫响应头 | 若用 Node 中间件，有 `X-SEOMiddleware: prerendered` |
|
||
| 普通浏览器请求 | 返回 200，为 SPA 的 index.html（有 #app 或大量 script） |
|
||
| test-crawler-detection.js | 全部用例通过 |
|
||
| test-seo.js | 全部路由“爬虫拿到 SEO 模板 + 普通用户正常” |
|
||
|
||
若某一项不符合，按下面排查：
|
||
|
||
- **爬虫也拿到 SPA**：检查 Nginx/Node 里爬虫判断和 SEO 模板路径、路由映射是否正确。
|
||
- **普通用户报错或空白**：检查 SPA 静态资源和 fallback 的 index.html 是否正常。
|
||
- **标题/描述不对**：检查 `public/seo-templates/` 下对应模板是否已重新生成（`node generate-seo-templates.cjs`）。
|
||
|
||
---
|
||
|
||
## 六、爬虫请求返回 404 时排查
|
||
|
||
当执行 `curl -s -A "Baiduspider/2.0" https://www.xingfucha.cn/` 得到 **404 Not Found** 时，按下面顺序在**服务器上**检查。
|
||
|
||
### 1. 确认已接入 SEO 配置
|
||
|
||
- 若你**还没**在宝塔里替换/合并过 `server/nginx-www.xingfucha.cn.conf` 里的 SEO 相关配置，爬虫仍会走原来的 `location /`，不会返回 SEO 模板。
|
||
- **操作**：在宝塔 → 网站 → www.xingfucha.cn → 配置文件，确认存在：
|
||
- 上面的 `set $is_crawler`、`set $seo_file` 以及一堆 `if ($http_user_agent ...)`、`if ($uri = '/') ...`；
|
||
- `location ~ ^/__seo__/(.+)$ { ... internal; }`；
|
||
- 在 `location /` 里有 `if ($is_crawler = 1) { rewrite ^ /__seo__/$seo_file break; }`。
|
||
- 修改后执行 `nginx -t`，再重载 Nginx。
|
||
|
||
### 2. 确认 SEO 模板目录和文件存在
|
||
|
||
404 常见原因是 Nginx 去读 SEO 模板时路径不对或文件不存在。
|
||
|
||
在**服务器**上执行（路径按你实际部署的来，一般为宝塔默认）：
|
||
|
||
```bash
|
||
# Linux 服务器上
|
||
ls -la /www/wwwroot/www.xingfucha.cn/seo-templates/
|
||
cat /www/wwwroot/www.xingfucha.cn/seo-templates/index.html | head -5
|
||
```
|
||
|
||
- 若 `seo-templates` 不存在或没有 `index.html`，需要把本地的 `public/seo-templates/` 整个目录上传到服务器的 `/www/wwwroot/www.xingfucha.cn/seo-templates/`（与配置里的 `alias` 路径一致）。
|
||
- 若目录名或路径和 Nginx 里 `alias` 不一致（例如多写了 `public` 或少了一层目录），改成与配置一致或改配置里的 `alias`。
|
||
|
||
### 3. 看 Nginx 错误日志
|
||
|
||
在服务器上：
|
||
|
||
```bash
|
||
tail -20 /www/wwwlogs/www.xingfucha.cn.error.log
|
||
```
|
||
|
||
再发一次爬虫请求，看是否有 `open() ".../seo-templates/xxx.html" failed (2: No such file or directory)` 之类，根据路径修正目录或配置。
|
||
|
||
### 4. 快速对照
|
||
|
||
| 现象 | 可能原因 | 处理 |
|
||
|------|----------|------|
|
||
| 爬虫返回 404 | 未接入 SEO 配置 | 按 1 合并/替换 Nginx 配置并重载 |
|
||
| 爬虫返回 404 | 模板目录或文件不存在 | 按 2 上传/创建 `seo-templates` 并保证有 `index.html` |
|
||
| 爬虫返回 404 | alias 路径错误 | 对照 error.log 修正 `alias` 或目录结构 |
|
||
| 爬虫返回 200 但仍是 SPA | 爬虫未命中 SEO 逻辑 | 检查 `$is_crawler`、`$seo_file` 与 `rewrite` 是否生效 |
|
||
|
||
按上述步骤即可完成从本地到线上的 SEO 检测。
|