前端使用vue

1.逐字输出 闪动css样式

<span id="response_row" class="result-streaming">{
  { item.assistantContent }}</span>

.result-streaming:after {
   
  -webkit-animation: blink 1s steps(5, start) infinite;
  animation: blink 1s steps(5, start) infinite;
  content: "▋";
  margin-left: 0.25rem;
  vertical-align: baseline;
}

2.使用fetch/eventSource/fetchEventSource进行sse流式处理

先贴最后成功使用的
使用fetchEventSource方法
参考代码：https://blog.csdn.net/cuiyuchen111/article/details/129468291
参考/下载文档：https://www.npmjs.com/package/@microsoft/fetch-event-source?activeTab=readme

以下为后端接口要求

前端代码

<p v-if="item.requestFlag" class="content robot_content"><span id="response_row" class="result-streaming">{
  { item.assistantContent }}</span></p>
<p class="content robot_content"><span v-html="item.assistantContent"></span></p>

 async getResponseFromAPI() {
   
          const that = this;
          this.sendLoading = true;
          // 用户提问时间
          let userTime = that.getNowTime();
          const form = JSON.parse(JSON.stringify(this.form));
          console.log(form, "请求里的form");
          //物理添加 页面
          that.conversations.push({
   
            userContentId: "",
            userContent: form.prompt,
            userContentDatetime: userTime,
            assistantContentId: "",
            assistantContent: "",
            assistantContentDatetime: userTime,
            requestFlag: true,
          });
          // 对话请求
          const abortController = new AbortController();
          let formData = new FormData();
          formData.append(