206 lines
4.6 KiB
Markdown
206 lines
4.6 KiB
Markdown
# 🚀 部署指南
|
||
|
||
将您的 Astro 网站部署到 jiao77.cn (110.42.70.70) 服务器的完整步骤。
|
||
|
||
## 📋 部署前准备
|
||
|
||
### 1. 确认服务器环境
|
||
登录到您的服务器并检查：
|
||
```bash
|
||
# SSH 连接到服务器
|
||
ssh root@110.42.70.70 # 或您的用户名
|
||
|
||
# 检查 Apache 状态
|
||
sudo systemctl status apache2
|
||
|
||
# 检查 Apache 网站根目录
|
||
ls -la /var/www/jiao77.cn/
|
||
|
||
# 检查 Apache 模块
|
||
apache2ctl -M | grep -E "(rewrite|deflate|expires|headers)"
|
||
```
|
||
|
||
### 2. 启用必要的 Apache 模块
|
||
如果模块未启用，请运行：
|
||
```bash
|
||
sudo a2enmod rewrite
|
||
sudo a2enmod deflate
|
||
sudo a2enmod expires
|
||
sudo a2enmod headers
|
||
sudo systemctl reload apache2
|
||
```
|
||
|
||
## 🚀 部署步骤
|
||
|
||
### 方法一：自动部署 (推荐)
|
||
|
||
1. **构建项目**
|
||
```bash
|
||
npm run build
|
||
```
|
||
|
||
2. **运行部署脚本**
|
||
```bash
|
||
./deploy.sh
|
||
```
|
||
按提示输入服务器用户名和网站根目录路径。
|
||
|
||
### 方法二：手动部署
|
||
|
||
1. **构建项目**
|
||
```bash
|
||
npm run build
|
||
```
|
||
|
||
2. **压缩文件**
|
||
```bash
|
||
cd dist
|
||
tar -czf ../website.tar.gz *
|
||
cd ..
|
||
```
|
||
|
||
3. **上传到服务器**
|
||
```bash
|
||
scp website.tar.gz root@110.42.70.70:/tmp/
|
||
```
|
||
|
||
4. **在服务器上解压**
|
||
```bash
|
||
ssh root@110.42.70.70
|
||
cd /var/www/html
|
||
sudo rm -rf * # 清空现有文件 (请谨慎!)
|
||
sudo tar -xzf /tmp/website.tar.gz -C /var/www/html/
|
||
sudo chown -R www-data:www-data /var/www/html/
|
||
sudo chmod -R 755 /var/www/html/
|
||
```
|
||
|
||
### 方法三：使用 rsync (最佳选择)
|
||
|
||
```bash
|
||
# 直接同步 dist 目录内容
|
||
rsync -avz --delete --progress dist/ root@110.42.70.70:/var/www/html/
|
||
```
|
||
|
||
## ⚙️ Apache 配置
|
||
|
||
### 1. 配置虚拟主机 (可选但推荐)
|
||
|
||
将 `apache-config.conf` 的内容添加到您的 Apache 配置中：
|
||
|
||
```bash
|
||
# 在服务器上
|
||
sudo nano /etc/apache2/sites-available/jiao77.conf
|
||
# 粘贴 apache-config.conf 的内容
|
||
|
||
# 启用站点
|
||
sudo a2ensite jiao77.conf
|
||
sudo systemctl reload apache2
|
||
```
|
||
|
||
### 2. 上传 .htaccess 文件
|
||
|
||
确保 `.htaccess` 文件已上传到网站根目录：
|
||
```bash
|
||
scp .htaccess root@110.42.70.70:/var/www/html/
|
||
```
|
||
|
||
## 🔧 服务器优化
|
||
|
||
### 1. 设置正确的文件权限
|
||
```bash
|
||
sudo chown -R www-data:www-data /var/www/html/
|
||
sudo find /var/www/html/ -type d -exec chmod 755 {} \;
|
||
sudo find /var/www/html/ -type f -exec chmod 644 {} \;
|
||
```
|
||
|
||
### 2. 配置防火墙 (如果启用)
|
||
```bash
|
||
sudo ufw allow 80/tcp # HTTP
|
||
sudo ufw allow 443/tcp # HTTPS
|
||
```
|
||
|
||
## 📊 部署后检查
|
||
|
||
### 1. 功能测试
|
||
- [ ] 访问 http://jiao77.cn 或 http://110.42.70.70
|
||
- [ ] 检查首页导航卡片是否正常显示
|
||
- [ ] 访问 `/reports` 页面确认报告组件正常
|
||
- [ ] 测试页眉展开/收缩功能
|
||
- [ ] 检查移动端响应式设计
|
||
- [ ] 验证动画效果是否流畅
|
||
|
||
### 2. 性能测试
|
||
```bash
|
||
# 使用 curl 测试压缩
|
||
curl -H "Accept-Encoding: gzip" -I http://jiao77.cn
|
||
|
||
# 检查响应时间
|
||
curl -o /dev/null -s -w "时间: %{time_total}s\n" http://jiao77.cn
|
||
```
|
||
|
||
### 3. 在线工具检测
|
||
- [GTmetrix](https://gtmetrix.com/) - 性能分析
|
||
- [PageSpeed Insights](https://pagespeed.web.dev/) - Google 性能评分
|
||
- [SSL Labs](https://www.ssllabs.com/ssltest/) - SSL 配置检测 (如果使用 HTTPS)
|
||
|
||
## 🔄 更新部署流程
|
||
|
||
当您需要更新网站时：
|
||
|
||
1. **修改代码**
|
||
2. **重新构建**: `npm run build`
|
||
3. **部署**: `./deploy.sh`
|
||
|
||
## 🛡️ SSL/HTTPS 配置 (推荐)
|
||
|
||
### 1. 获取免费 SSL 证书 (Let's Encrypt)
|
||
```bash
|
||
sudo apt update
|
||
sudo apt install certbot python3-certbot-apache
|
||
sudo certbot --apache -d jiao77.cn -d www.jiao77.cn
|
||
```
|
||
|
||
### 2. 自动续期
|
||
```bash
|
||
sudo crontab -e
|
||
# 添加这行：
|
||
0 12 * * * /usr/bin/certbot renew --quiet
|
||
```
|
||
|
||
## 🐛 故障排除
|
||
|
||
### 问题1：页面不显示或显示 Apache 默认页
|
||
- 检查文件权限
|
||
- 确认 DocumentRoot 配置正确
|
||
- 查看 Apache 错误日志：`sudo tail -f /var/log/apache2/error.log`
|
||
|
||
### 问题2：CSS/JS 文件加载失败
|
||
- 检查 .htaccess 文件是否正确上传
|
||
- 确认 mod_rewrite 模块已启用
|
||
- 检查文件路径是否正确
|
||
|
||
### 问题3：动画效果不工作
|
||
- 检查 JavaScript 控制台错误
|
||
- 确认所有资源文件都已上传
|
||
- 验证 Content-Security-Policy 配置
|
||
|
||
### 问题4：移动端显示异常
|
||
- 检查 viewport meta 标签
|
||
- 验证响应式 CSS 是否正确加载
|
||
- 测试不同设备和浏览器
|
||
|
||
## 📞 技术支持
|
||
|
||
如果遇到部署问题，请检查：
|
||
1. Apache 错误日志：`/var/log/apache2/error.log`
|
||
2. Apache 访问日志：`/var/log/apache2/access.log`
|
||
3. 浏览器开发者工具控制台
|
||
4. 网络连接和防火墙设置
|
||
|
||
## 📈 监控和维护
|
||
|
||
建议设置：
|
||
- 定期备份网站文件
|
||
- 监控服务器资源使用情况
|
||
- 定期更新 Apache 和系统安全补丁
|
||
- 设置网站监控服务检测可用性 |