# iot

**Repository Path**: lukecheng666/iot

## Basic Information

- **Project Name**: iot
- **Description**: 数据采集模块是工业物联网网关系统的核心组件，负责从各种工业设备协议中读取实时数据，并通过缓存、转发和历史存储机制提供完整的数据采集解决方案。本模块支持多种工业协议，包括Modbus、OPC UA、PLC、DL/T 645等，实现了高并发、低延迟的数据采集架构。
- **Primary Language**: Unknown
- **License**: Not specified
- **Default Branch**: master
- **Homepage**: None
- **GVP Project**: No

## Statistics

- **Stars**: 0
- **Forks**: 2
- **Created**: 2026-01-13
- **Last Updated**: 2026-02-21

## Categories & Tags

**Categories**: Uncategorized

**Tags**: None

## README

# Collect Gateway Web

Windows 系统部署手册（前端）

## 1. 项目概述
- 本项目为前端静态站点，技术栈：Vue 3 + Vite + TypeScript。
- 前端通过接口访问后端服务，默认接口地址配置在 `collect-gateway-web/src/api/index.ts`：
  - `baseURL: 'http://localhost:5000/api'`
- 部署目标是将构建产物 `dist/` 发布为静态站点，推荐与后端一起发布到 `wwwroot`。

## 2. 运行环境与软件要求（Windows）
- 操作系统：Windows 10 / 11 或 Windows Server 2019 / 2022
- Node.js：18 LTS 或以上
- npm：随 Node.js 安装
- 解压工具：7-Zip / WinRAR（用于 `dist.rar`）
- Web 服务器（可选）：
  - IIS（Windows 自带）
  - Nginx for Windows

## 3. 目录结构说明
- `collect-gateway-web/src/`：前端源码
- `collect-gateway-web/public/`：公共静态资源
- `collect-gateway-web/dist/`：构建输出目录（`npm run build` 后生成）
- `collect-gateway-web/dist.rar`：已打包的构建产物（可直接部署）
- `collect-gateway-web/package.json`：脚本与依赖说明

## 4. 部署方式概览
- 方式 A：后端发布后，将前端 `dist/` 文件放到后端 `wwwroot`（推荐）
- 方式 B：IIS 独立站点发布
- 方式 C：Nginx 独立站点发布
- 方式 D：直接部署 `dist.rar` / `dist/`

## 5. 方式 A：后端发布 + 前端放入 wwwroot（推荐）

### 5.1 后端发布
先完成后端发布，得到发布目录（包含 `wwwroot` 目录）。

### 5.2 前端构建
在前端目录执行：
```powershell
cd D:\lkc\collect\collect-gateway-web
npm ci
npm run build
```
构建成功后生成 `dist/`。

### 5.3 拷贝 dist 到 wwwroot
将 `dist/` **目录内的文件**拷贝到后端发布目录的 `wwwroot`：
```
D:\apps\collect-gateway\wwwroot
```
建议清空旧文件后再覆盖，以避免残留。

### 5.4 验证
启动后端服务后访问：
```
http://<服务器IP>/
```

### 5.5 子路径部署（可选）
如果需要发布到子路径（如 `/web`）：
1) 修改 `collect-gateway-web/vite.config.ts`：
```ts
export default defineConfig({
  base: '/web/',
  plugins: [vue()],
})
```
2) 重新构建，并将 `dist/` 拷贝到 `wwwroot/web`。

## 6. 方式 B：部署到 IIS

1) 启用 IIS
- “控制面板 → 程序 → 启用或关闭 Windows 功能”
- 勾选：Internet Information Services、静态内容

2) 创建站点
- 物理路径选择 `collect-gateway-web/dist`
- 绑定端口：如 `80`

3) SPA 路由重写
在 `dist/` 创建 `web.config`：
```xml
<?xml version="1.0" encoding="utf-8"?>
<configuration>
  <system.webServer>
    <rewrite>
      <rules>
        <rule name="SPA" stopProcessing="true">
          <match url=".*" />
          <conditions logicalGrouping="MatchAll">
            <add input="{REQUEST_FILENAME}" matchType="IsFile" negate="true" />
            <add input="{REQUEST_FILENAME}" matchType="IsDirectory" negate="true" />
          </conditions>
          <action type="Rewrite" url="/index.html" />
        </rule>
      </rules>
    </rewrite>
  </system.webServer>
</configuration>
```

## 7. 方式 C：部署到 Nginx（Windows）

1) 解压 Nginx 到：
```
C:\nginx
```

2) 修改 `C:\nginx\conf\nginx.conf`：
```nginx
server {
    listen       80;
    server_name  localhost;

    root   D:/lkc/collect/collect-gateway-web/dist;
    index  index.html;

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

3) 启动 Nginx：
```powershell
cd C:\nginx
.\nginx.exe
```

## 8. 方式 D：直接部署 dist.rar / dist
1) 解压 `collect-gateway-web/dist.rar`
2) 将解压后的 `dist/` 作为站点目录发布（IIS/Nginx 步骤同上）

## 9. 后端接口地址配置建议

### 方案 1：固定后端地址
- 直接把 `baseURL` 改成后端地址

### 方案 2：同域相对路径（推荐）
- 把 `baseURL` 改成相对路径：
  ```ts
  baseURL: '/api'
  ```
- 由后端反向代理或路由 `/api` 到后端接口

修改后需要重新构建前端。

## 10. 端口与防火墙
- 开发模式：`npm run dev` 默认端口 `5173`
- 预览模式：`npm run preview` 默认端口 `4173`
- 生产：IIS/Nginx 建议使用 `80/443`
- Windows 防火墙需放行对应端口

## 11. 升级与回滚
- 升级：用新 `dist/` 覆盖旧版本
- 回滚：保留旧版本 `dist/` 备份目录

## 12. 验收检查清单
- 首页能正常加载，控制台无 404/500
- 登录成功并返回 Token
- 设备、监控、报警等页面能正常访问接口
- 刷新页面不出现 404（单页路由正常）

## 13. 常见问题

1) 页面空白或刷新 404
- 原因：SPA 路由未配置重写
- 解决：IIS 用 `web.config`；Nginx 用 `try_files`

2) 接口 401 或跨域错误
- 原因：后端未允许跨域或地址错误
- 解决：检查 `baseURL`，或使用同域 `/api`

3) 接口访问超时
- 原因：后端不可达或端口未放行
- 解决：确认后端服务状态与防火墙策略