寒窗轩,寒川的个人网络博客,记录互联网事,学习网络编程、分享工作经验、人生感悟,包括但不限于程序代码、数据库、Office办公、随笔等内容。

nginx+php如何EventStream流式数据传输

近几年,AI发展迅猛,跟随的EventStream流式数据传输也流行起来。其中chatgtp就是,那如何输出EventStream流式数据呢?对apache+php的服务器来说,貌似天生就可以直接输出,但对于国内很多宝塔用户搭建的nginx+php,又该怎么输出流式数据呢?下面直接上干货。

1、配置nginx输出EventStream流式数据。

location = /stream.php {
        include fastcgi_params;
        fastcgi_pass unix:/tmp/php-cgi-74.sock;  # 确保路径正确
        fastcgi_index index.php;
        fastcgi_param SCRIPT_FILENAME $document_root$fastcgi_script_name;
        # 禁用代理缓冲
        fastcgi_buffering off;
        fastcgi_keep_conn on;
        # 设置长时间读取超时
        proxy_read_timeout 3600s;  # 增加超时时间,根据需要调整
        # 禁止响应数据被压缩
        gzip off;
    }

这里是为了只在网站根目录的“stream.php”文件访问时以流式数据输出。

2、stream.php文件演示内容如下:

<?php
header('Content-Type: text/event-stream');
header('Cache-Control: no-cache');
header('Connection: keep-alive'); // 保持连接
ob_end_flush(); // 结束输出缓冲
ob_implicit_flush(true); // 启用隐式刷新

$i = 0;
while (true) {
    $i++;
    
    if($i<=5){
       // 发送事件流数据
        echo "data: 这是第 {$i} 条数据。\n\n";
    }else{
        echo "event: close\n";
        echo "data: 连接将被关闭\n\n";
    }
    // 立即刷新输出缓冲区,确保数据被发送到客户端
    flush(); 
    // 延迟一段时间,以便下次发送
    sleep(1);
}

3、页面前端index.html内容如下:

<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Server-Sent Events 示例</title>
    <style>
        #events {
            border: 1px solid #ccc;
            padding: 10px;
            max-width: 500px;
            margin: 20px auto;
            font-family: Arial, sans-serif;
        }
    </style>
</head>
<body>

<div id="events">等待事件...</div>

<script>
    // 创建 EventSource 对象
    const eventSource = new EventSource('db.php'); // 替换为你的 PHP 文件路径

    // 监听消息事件
    eventSource.onmessage = function(event) {
        const eventsDiv = document.getElementById('events');
        eventsDiv.innerHTML += `<p>${event.data}</p>`; // 显示服务器发送的数据
    };

    // 监听关闭事件(如果需要)
    eventSource.addEventListener('close', function(event) {
        const eventsDiv = document.getElementById('events');
        eventsDiv.innerHTML += `<p>连接已关闭</p>`;
        eventSource.close(); // 关闭 EventSource 连接
    });

    // 处理错误
    eventSource.onerror = function(event) {
        const eventsDiv = document.getElementById('events');
        eventsDiv.innerHTML += `<p>发生错误</p>`;
        eventSource.close(); // 可以选择在错误时关闭连接
    };
</script>

</body>
</html>

祝您好运。

程序 2024-10-19 21:57:26 38 0 3137 nginxphpeventstream
文章写得不错?我是土豪我要在线打赏!
在线打赏

昵称:

验证码:验证码

评论:

文章分类
系统
程序
数据
Office
随笔
热门文章
python读取文件夹下图片并生成pdf文件
VB.net开发的word转pdf的小工具
使用python把word转成pdf
文章推荐
免责声明
关于博主
开篇第一章
随机推荐
说说银行收取点钞费
WAP写博客测试
emlog博客系统升级至3.50
给验证码添加一个点击刷新的功能
可恶的垃圾留言,我诅咒。。
我也玩玩php多线程
php SQL BETWEEN AND 查询日期范围。
.htaccess非伪静态url跳转到伪静态url再伪静态
access的mdb数据库长期使用变大的处理办法
Google Font API打造美轮美奂的网页字体
友情连接
春燕网络
谢润的博客
企安文档