# ⚡ 快速部署操作手册

## 🎯 目标
将网站部署到：**https://solarark.net/g2026/g4/**

---

## 📋 部署前准备（5分钟）

### ✅ 确认事项
- [ ] 代码已推送到 Gitea: https://gitea.solarark.net/yangyuqing/new-site
- [ ] 有服务器访问权限（SSH 或 FTP）
- [ ] 知道服务器项目根目录路径

### 📦 当前版本
- 最新提交: `31ea4ba - 添加部署脚本和完整部署指南`
- 包含文件: index.html, css/, js/, .htaccess, images/

---

## 🚀 三种快速部署方式

### 方式一：SSH + Git（最快 ⭐⭐⭐⭐⭐）

**预计时间**: 10分钟

```bash
# 第1步：SSH登录服务器
ssh username@solarark.net

# 第2步：进入部署目录（根据实际路径修改）
cd /var/www/html/g2026/g4

# 第3步：克隆仓库
git clone https://gitea.solarark.net/yangyuqing/new-site.git .
# 输入 Gitea 用户名和密码

# 第4步：设置权限
sudo chown -R www-data:www-data .
sudo chmod -R 755 .

# 第5步：重启 Web 服务器
sudo systemctl restart apache2
# 或 sudo systemctl restart nginx

# 第6步：测试访问
curl -I https://solarark.net/g2026/g4/
```

**完成标志**: 返回 `HTTP/1.1 200 OK`

---

### 方式二：FileZilla FTP上传（常用 ⭐⭐⭐⭐）

**预计时间**: 15分钟

#### 步骤：

1. **下载 FileZilla**
   ```
   https://filezilla-project.org/
   ```

2. **连接服务器**
   ```
   主机: solarark.net
   用户名: [你的FTP用户名]
   密码: [你的FTP密码]
   端口: 21 (FTP) 或 22 (SFTP)
   ```

3. **定位目录**
   ```
   本地站点: d:\my_website
   远程站点: /g2026/g4/
   ```

4. **上传文件**
   ```
   选中以下文件拖拽到右侧：
   ├── index.html
   ├── css/
   ├── js/
   ├── images/
   ├── .htaccess
   └── README.md
   
   右键 → 上传
   ```

5. **验证上传**
   ```
   检查远程目录文件大小是否与本地一致
   确保 .htaccess 已上传（可能需要显示隐藏文件）
   ```

---

### 方式三：Windows打包 + FTP（简单 ⭐⭐⭐）

**预计时间**: 20分钟

#### 步骤：

1. **运行打包脚本**
   ```cmd
   cd d:\my_website
   deploy.bat
   ```

2. **等待生成 ZIP**
   ```
   生成文件: website_deploy_20260602_HHMMSS.zip
   ```

3. **上传 ZIP 到服务器**
   ```
   使用 FileZilla 上传 ZIP 到 /g2026/g4/
   ```

4. **在服务器上解压**
   ```bash
   ssh username@solarark.net
   cd /var/www/html/g2026/g4
   unzip website_deploy_*.zip
   rm website_deploy_*.zip
   ```

---

## ✅ 部署后验证（必做！）

### 1. 基础访问测试
```
浏览器打开: https://solarark.net/g2026/g4/
```

**期望结果**: 
- ✅ 页面正常显示
- ✅ 标题显示"雪域阳光方舟 - 轻索方舱"
- ✅ 莫兰迪绿色调正确

### 2. 控制台检查（F12）
```
按 F12 → Console 标签
```

**期望结果**:
- ✅ 无红色错误
- ✅ 无 404 警告

### 3. Network 资源检查
```
F12 → Network 标签 → 刷新页面
```

**期望结果**:
- ✅ style.css 状态码 200
- ✅ main.js 状态码 200
- ✅ 所有资源加载成功

### 4. 功能测试
```
✓ 点击导航栏各链接，平滑滚动
✓ 滚动页面，导航高亮变化
✓ 悬停卡片，有上浮效果
✓ 缩小窗口，变为单列布局
```

### 5. 移动端测试
```
Chrome DevTools → Toggle Device Toolbar
选择 iPhone 12 Pro
```

**期望结果**:
- ✅ 汉堡菜单可点击
- ✅ 单列布局
- ✅ 文字清晰可读

---

## ⚠️ 常见问题速查

### ❌ 问题1：页面空白

**快速诊断**:
```bash
# SSH 检查文件是否存在
ls -la /var/www/html/g2026/g4/index.html
ls -la /var/www/html/g2026/g4/css/style.css
```

**解决**:
- 确认文件已上传
- 检查文件权限（应为 644 或 755）
- 查看 Web 服务器错误日志

### ❌ 问题2：样式不加载

**快速诊断**:
```
F12 → Network → 查找 style.css
如果 404，说明路径错误
```

**解决**:
```html
<!-- 临时测试：改为绝对路径 -->
<link rel="stylesheet" href="/g2026/g4/css/style.css">
```

### ❌ 问题3：404 Not Found

**原因**: URL 重写未配置

**Apache 解决**:
```bash
# 检查 .htaccess 是否存在
cat /var/www/html/g2026/g4/.htaccess

# 检查 Apache 配置
sudo nano /etc/apache2/apache2.conf
# 确保 AllowOverride All
```

**Nginx 解决**:
```nginx
# 添加 try_files
location /g2026/g4/ {
    try_files $uri $uri/ /g2026/g4/index.html;
}
```

### ❌ 问题4：图片不显示

**原因**: 图片未上传

**解决**:
```bash
# 检查 images 目录
ls -la /var/www/html/g2026/g4/images/

# 暂时不影响展示（使用占位图）
```

---

## 🔄 后续更新（超简单）

### Git Pull 方式（推荐）
```bash
ssh username@solarark.net
cd /var/www/html/g2026/g4
git pull origin master
sudo systemctl restart apache2
```

### FTP 覆盖方式
```
1. 本地修改文件
2. git add . && git commit && git push
3. FileZilla 重新上传修改的文件
```

---

## 📞 紧急联系信息

### 如果部署失败，提供以下信息给老师：

```
📍 访问地址: https://solarark.net/g2026/g4/
⏰ 部署时间: [填写时间]
💻 部署方式: [SSH/FTP/其他]
❌ 遇到的问题: [详细描述]
📸 错误截图: [如有]
🔍 控制台错误: [复制错误信息]
```

---

## 🎊 成功标志

看到以下内容即表示部署成功：

✅ 可以访问 https://solarark.net/g2026/g4/  
✅ 页面显示"雪域阳光方舟 - 轻索方舱"  
✅ 莫兰迪苔绿色正确显示  
✅ 卡片阴影柔和美观  
✅ 导航功能正常  
✅ 移动端适配完美  
✅ 老师验收通过  

---

## 💡 小贴士

1. **首次部署建议先用 SSH + Git 方式**，最稳定
2. **部署前先备份**（如果服务器已有内容）
3. **部署后立即测试**，不要等到第二天
4. **保留部署日志**，方便排查问题
5. **记录服务器路径**，下次更新用

---

**祝你一次部署成功！** 🚀✨

*快速参考：详细文档请查看 DEPLOY_GUIDE.md*