# sse-example

**Repository Path**: longsiyu/sse-example

## Basic Information

- **Project Name**: sse-example
- **Description**: No description available
- **Primary Language**: Unknown
- **License**: Not specified
- **Default Branch**: main
- **Homepage**: None
- **GVP Project**: No

## Statistics

- **Stars**: 0
- **Forks**: 0
- **Created**: 2025-03-07
- **Last Updated**: 2025-03-07

## Categories & Tags

**Categories**: Uncategorized

**Tags**: example

## README

# Server-Sent Events (SSE) Example Project

这是一个简单的示例项目，演示了Server-Sent Events (SSE)，这是一种允许服务器通过HTTP连接向客户端推送更新的技术。

## 功能

- 实时服务器到客户端通信
- 简单的Express.js服务器
- 干净的HTML/CSS/JS前端
- 连接管理
- 事件触发

## 先决条件

- Node.js（推荐v12或更高版本）
- npm（随Node.js一起安装）

## 安装

1. 克隆此仓库或下载文件
2. 导航到项目目录
3. 安装依赖：

```bash
npm install
```

## 运行应用程序

启动服务器：

```bash
npm start
```

对于开发环境（自动重启）：

```bash
npm run dev
```

然后打开浏览器并导航到：

```
http://localhost:3000
```

## 如何使用

1. 点击"Connect to SSE"按钮建立与服务器的连接
2. 连接后状态指示器将变为绿色
3. 点击"Trigger Event"使服务器向所有连接的客户端发送事件
4. 事件将在事件面板中显示，并带有时间戳
5. 点击"Disconnect"关闭连接
6. 点击"Clear Events"清除事件面板

## 工作原理

### 服务器端 (server.js)

- 创建Express服务器
- 设置带有适当SSE头的`/events`端点
- 维护已连接客户端列表
- 提供`/trigger-event`端点手动触发事件
- 向所有连接的客户端发送事件

### 客户端 (public/index.html)

- 使用`EventSource` API连接到SSE端点
- 显示连接状态
- 实时显示传入事件
- 允许从服务器手动触发事件

## SSE vs WebSockets

当你只需要从服务器到客户端的单向通信时，Server-Sent Events (SSE)是WebSockets的更简单替代方案。SSE有几个优点：

- 使用标准HTTP，无需特殊协议
- 自动重连
- 事件ID和自动跟踪最后一个事件
- 更简单的服务器实现

但是，如果你需要双向通信，WebSockets会是更好的选择。


## 许可证

MIT