PHP实时输出与JS动态更新教程

来到golang学习网的大家，相信都是编程学习爱好者，希望在这里学习文章相关编程知识。下面本篇文章就来带大家聊聊《PHP实时输出结合JS动态更新界面教程》，介绍一下，希望对大家的知识积累有所帮助，助力实战开发！

PHP流式输出需关闭输出缓冲和zlib压缩，用text/event-stream配合EventSource实现稳定SSE；Apache/Nginx须禁用代理缓冲与压缩；注意跨域、换行符规范及连接数限制。

PHP 输出缓冲没关，JS 根本收不到流式数据

PHP 默认开启输出缓冲（output_buffering），哪怕你写了 echo + flush()，数据也卡在 PHP 层发不出去。浏览器收不到第一个字节，fetch 或 EventSource 就不会触发 message 事件。

必须显式关闭缓冲并禁用 zlib 压缩：

• ob_end_flush() 或 ob_get_level() ? ob_end_clean() : null 清掉已有缓冲
• ini_set('output_buffering', 'off')
• ini_set('zlib.output_compression', 'off')
• header('Content-Encoding: none') 防止 Nginx/Apache 后续压缩

用 text/event-stream 比 fetch 流更稳

EventSource 是浏览器原生支持的 SSE 协议客户端，自动重连、解析 data: 字段、处理心跳，比手写 ReadableStream + decoder 少踩一半坑。

PHP 端只需保持连接不关、每条消息以 data: ...\n\n 结尾：

header('Content-Type: text/event-stream');
header('Cache-Control: no-cache');
while (true) {
    echo "data: " . json_encode(['progress' => $i++]) . "\n\n";
    ob_flush();
    flush();
    sleep(1);
}

JS 端直接监听：

const es = new EventSource('/stream.php');
es.onmessage = e => {
    const data = JSON.parse(e.data);
    document.getElementById('status').innerText = data.progress;
};

Apache/Nginx 会吞掉 chunked 响应，必须改配置

即使 PHP 发出了分块数据，反向代理常默认启用缓冲或超时机制，导致 JS 一直等不到响应。常见表现：页面白屏几秒后一次性刷出全部内容。

Apache 需加：

• SetEnv no-gzip 1（禁用压缩）
• BrowserMatch "MSIE" no-gzip（兼容旧 IE）

Nginx 必须关掉代理缓冲：

• proxy_buffering off;
• proxy_cache off;
• proxy_http_version 1.1;（SSE 要求 HTTP/1.1）

JS 收到数据但界面没更新？检查 DOM 更新时机和跨域

EventSource 只支持同源，跨域需服务端加 Access-Control-Allow-Origin；另外，若 PHP 输出含换行符不规范（比如 \r\n 混用），EventSource 会静默丢弃整条消息。

调试建议：

• 用 cURL -N http://yoursite/stream.php 直连验证 PHP 是否真正在流式输出
• 浏览器开发者工具 Network → 查看响应头是否含 Content-Type: text/event-stream
• 监听 es.onerror，很多失败根本没报错，只在控制台静默终止

SSE 不是万能的——连接数有限制，长连接对服务器压力比轮询更隐蔽，别在低配机器上开几十个并发流。

好了，本文到此结束，带大家了解了《PHP实时输出与JS动态更新教程》，希望本文对你有所帮助！关注golang学习网公众号，给大家分享更多文章知识！