微信小程序版本，主要針對AI對話的流式輸出，這裏主要有兩個要點
**1、如何流式渲染
2、如何建立SSE連接**
我們先從看得見的渲染開始着手，能渲染出來後再建立SSE做流式輸出

流式渲染

這裏使用uniapp插件市場的：zero-markdown-view
插件市場搜索直接下載導入到項目裏就可以用了
頁面使用：

<zero-markdown-view :theme-color="'#252B3A'" :markdown="youData" />

const youData = `如果是想聊點什麼，或者需要幫助，隨時告訴我哦！比如：
想了解某個知識點？
需要解決問題？
或者單純想閒聊？
我在這兒呢～ 🌟
`;

頁面可以直接渲染這段內容，但是光這樣渲染出來非常“硬核”，我們需要寫一個氣泡套住對話內容

<view class="ai-bubble">
  <zero-markdown-view :theme-color="'#252B3A'" :markdown="youData" />
</view>

ai-bubble的css樣式你可以自定義，這樣你會得到一個美觀的氣泡如下：

這樣流式輸出渲染就做好了，然後是SSE連接

建立SSE連接

uniapp的小程序端是不支持@microsoft/fetch-event-source插件的，開啓長連接可以使用uni.request實現，只需要添加上enableChunked參數即可，另外uni.request還支持手動停止，通過調用abort()即可

let requestTask = null; // uni.request實例
const startChat = async () => {
  let params = {}; // 你的參數
    requestTask = uni.request({
        url: `https://xxx.xxx.com/agentapi/v1/chat-messages`,
        method: 'POST',
        data: params,
        header: {
            'Content-Type': 'application/json',
            authorization: `你的token`
        },
        enableChunked: true, // 開啓流式傳輸
        responseType: 'text', // 指定響應的數據類型
        success: (res) => {
            console.log('完整響應了');
        },
        fail: (err) => {
            console.log('錯誤響應了', err);
        }
    });

  // 建立連接成功
    requestTask.onHeadersReceived(function (res) {
        console.log('建立連接成功', res);
    });

  // 連接響應
    requestTask.onChunkReceived(function (res) {
        try {
      // 輸出的內容無法直接使用，需要解碼
            const uint8Array = new Uint8Array(res.data);
            let text = String.fromCharCode.apply(null, uint8Array);
            const message = decodeURIComponent(escape(text));
      console.log('流式輸出片段',message)
      // 這裏可以做流式輸出了，拼接字符串
      // 當然你需要取list的最後一條，那條才是當前對話正確的內容
      // aiLastCaht.content += message
        } catch (err) {
            console.log('流式解析報錯', err);
        }
    });
};

這樣你的小程序版本的SSE就建立成功了，並且還支持手動停止，uni.request會返回一個requestTask，調用abort()實現停止

// 手動停止函數
const stopChat = () => {
  // 如果有專門的斷開接口這裏可以調用...
  
    if (requestTask.value) {
        requestTask.abort(); // 手動停止連接
        requestTask = null; // 釋放內存
    }
};

到這裏，基礎的流式渲染+SSE連接就完成了，更多的內容你可以根據自己的實際業務需求來定製。
我這裏提幾個需要注意的點，這在實際業務中很大概率會遇到：
1、建立SSE連接的時候手動斷開需要釋放內存、數據
2、解析片段過程中報錯需要處理
3、頁面markdown渲染時，剛建立連接需要設置loading
4、zero-markdown-view不支持深度思考，需要分割深度思考內容
5、如果SSE返回內容為空，是否需要處理邊界行為，例如："已暫停思考"

參考資料：
uniapp.request
zero-markdown-view