From f3e42e3ac81880b0503d20f4caf7da9d31e8d2d2 Mon Sep 17 00:00:00 2001
From: liyi <m18269109817@163.com>
Date: Thu, 12 Dec 2024 15:48:15 +0800
Subject: [PATCH] =?UTF-8?q?fix:=E5=A2=9E=E5=8A=A0=E8=AF=BB=E5=8F=96h264?=
 =?UTF-8?q?=E6=96=87=E4=BB=B6=E5=90=8E=E4=BD=BF=E7=94=A8=E5=AE=9A=E6=97=B6?=
 =?UTF-8?q?=E5=99=A8=E5=8F=91=E9=80=81,=E8=B0=83=E6=95=B4html=E6=A0=B7?=
 =?UTF-8?q?=E5=BC=8F?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 assets/html/h264.html                         |  15 ++-
 lib/login/login/JMuxerApp.dart                | 126 +++++++++++++++---
 .../handle/impl/udp_talk_accept_handler.dart  |   5 +-
 3 files changed, 119 insertions(+), 27 deletions(-)
diff --git a/assets/html/h264.html b/assets/html/h264.html
index 431b5c38..46c234f9 100644
--- a/assets/html/h264.html
+++ b/assets/html/h264.html
@@ -6,8 +6,19 @@
           content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no">
     <title>play</title>
 </head>
+<style>
+    html{
+        margin:0 0;
+        padding: 0 0;
+    }
+    body{
+        margin:0 0;
+        padding: 0 0;
+    }
+
+</style>
 <body>
-<video controls autoplay muted style="width: 100vw;height: 100vh;" id="player">
+<video  autoplay muted style="width: 100vw;height: 100vh;" poster="images/loader-thumb.jpg" id="player">
 </video>
 <script>
     (function (global, factory) {
@@ -2644,7 +2655,7 @@
             jmuxer = new JMuxer({
                 node: 'player',
                 mode: 'video',
-                flushingTime: 0,
+                flushingTime: 1000,
                 fps: 22,
                 debug: true,
             });
diff --git a/lib/login/login/JMuxerApp.dart b/lib/login/login/JMuxerApp.dart
index 61d809ee..05ba059f 100644
--- a/lib/login/login/JMuxerApp.dart
+++ b/lib/login/login/JMuxerApp.dart
@@ -1,6 +1,9 @@
+import 'dart:async';
 import 'dart:convert';
 import 'package:flutter/material.dart';
 import 'package:flutter/services.dart' show ByteData, Uint8List, rootBundle;
+import 'package:star_lock/app_settings/app_colors.dart';
+import 'package:star_lock/tools/titleAppBar.dart';
 import 'package:webview_flutter/webview_flutter.dart';
 
 class LocalHtmlPage extends StatefulWidget {
@@ -34,32 +37,52 @@ class _LocalHtmlPageState extends State<LocalHtmlPage> {
     final ByteData data = await rootBundle.load('assets/talk.h264');
     final List<int> byteData = data.buffer.asUint8List();
 
-    int offset = 0;
-    int frameSize = 0;
+    // 提取 NALU 边界并生成 chunks
+    final List<int> chunks = extractChunks(byteData);
+    final int total = chunks.length;
 
-    // 根据 H.264 数据的帧结构来逐帧读取并发送
-    while (offset < byteData.length) {
-      // 获取每一帧的大小
-      frameSize = getFrameSize(byteData, offset);
+    int current = 0;
+    int start = 0;
+    int end = 0;
+    List<int> buffer = []; // 用于累积帧数据的缓冲区
+    Timer? timer;
 
-      if (frameSize == 0) {
-        print("No more frames or error in frame size calculation.");
-        break; // 如果没有更多的帧，或者无法计算帧的大小，则退出循环
+    // 创建一个定时器，每800毫秒触发一次
+    timer ??= Timer.periodic(Duration(milliseconds: 800), (timer) async {
+      if (current >= total) {
+        current = 0;
+        start = 0;
+        print("All frames sent. Restarting from the beginning.");
       }
 
-      // 提取当前帧数据
-      List<int> frameData = byteData.sublist(offset, offset + frameSize);
+      end = chunks[current];
+      current++;
 
-      // 将当前帧数据发送到 WebView 中的 feedDataFromFlutter 函数
-      String jsCode = "feedDataFromFlutter(${frameData});";
-      await _controller.runJavaScript(jsCode);
+      // 累积当前帧数据到缓冲区
+      List<int> frameData = byteData.sublist(start, end);
+      buffer.addAll(frameData);
+      start = end;
 
-      // 更新偏移量，继续发送下一个帧
-      offset += frameSize;
+      // 发送累积的数据
+      if (buffer.isNotEmpty) {
+        await _sendBufferedData(buffer);
+        buffer.clear(); // 清空缓冲区
+      }
 
-      // 控制帧率，模拟每秒 22 帧播放（或者根据你的视频帧率调整）
-      await Future.delayed(Duration(milliseconds: (1000 / 22).toInt()));
-    }
+      // 打印进度信息（可选）
+      if (current % 50 == 0) {
+        print("I am serving, no problem!");
+      }
+      if (current == 0) {
+        print("Started from first chunk...");
+      }
+
+      // 如果所有帧都已处理完毕，取消定时器
+      if (current >= total) {
+        timer.cancel();
+        print('All frames sent. Stopping timer...');
+      }
+    });
   }
 
   int getFrameSize(List<int> data, int offset) {
@@ -128,10 +151,69 @@ class _LocalHtmlPageState extends State<LocalHtmlPage> {
   @override
   Widget build(BuildContext context) {
     return Scaffold(
-      appBar: AppBar(
-        title: Text("加载本地 HTML"),
-      ),
       body: WebViewWidget(controller: _controller),
     );
   }
+
+  _sendBufferedData(List<int> buffer) async {
+    String jsCode = "feedDataFromFlutter(${buffer});";
+    await _controller.runJavaScript(jsCode);
+  }
+
+  // 提取 NALU 边界并生成 chunks
+  List<int> extractChunks(List<int> byteData) {
+    int i = 0;
+    int length = byteData.length;
+    int naluCount = 0;
+    int value;
+    int state = 0;
+    int lastIndex = 0;
+    List<int> result = [];
+    const minNaluPerChunk = 30; // 每个数据块包含的最小NALU数量
+
+    while (i < length) {
+      value = byteData[i++];
+      // finding 3 or 4-byte start codes (00 00 01 OR 00 00 00 01)
+      switch (state) {
+        case 0:
+          if (value == 0) {
+            state = 1;
+          }
+          break;
+        case 1:
+          if (value == 0) {
+            state = 2;
+          } else {
+            state = 0;
+          }
+          break;
+        case 2:
+        case 3:
+          if (value == 0) {
+            state = 3;
+          } else if (value == 1 && i < length) {
+            if (lastIndex > 0) {
+              naluCount++;
+            }
+            if (naluCount >= minNaluPerChunk) {
+              result.add(lastIndex - state - 1);
+              naluCount = 0;
+            }
+            state = 0;
+            lastIndex = i;
+          } else {
+            state = 0;
+          }
+          break;
+        default:
+          break;
+      }
+    }
+
+    if (naluCount > 0) {
+      result.add(lastIndex);
+    }
+
+    return result;
+  }
 }
diff --git a/lib/talk/startChart/handle/impl/udp_talk_accept_handler.dart b/lib/talk/startChart/handle/impl/udp_talk_accept_handler.dart
index 3f298838..fe51cd3f 100644
--- a/lib/talk/startChart/handle/impl/udp_talk_accept_handler.dart
+++ b/lib/talk/startChart/handle/impl/udp_talk_accept_handler.dart
@@ -22,18 +22,17 @@ class UdpTalkAcceptHandler extends ScpMessageBaseHandle
   }
 
   @override
-  void handleResp(ScpMessage scpMessage) async {
+  void handleResp(ScpMessage scpMessage)  {
     // 收到同意接听回复
     final GenericResp genericResp = scpMessage.Payload;
     if (checkGenericRespSuccess(genericResp)) {
       // 启动通话保持定时器
       _handleStartTalkPing();
-      await Future.delayed(Duration(seconds: 2), () {
+      Future.delayed(Duration(seconds: 2), () {
         // 启动发送预期数据请求
         _handleStartSendTalkExpectDataRequest();
         // 启动通话数据检查的定时器
         _handleCheckTalkDataTimer();
-
       });
       // 停止播放铃声
       stopRingtone();
