Server-Sent Events (hereinafter referred to as SSE) and event-source-polyfill use one-way long connection (the background actively pushes to the front end)

SSE is similar to WebSocket in that it establishes a communication channel between the browser and the server, and then the server pushes information to the browser. SSE is a one-way channel that can only be sent from the server to the browser, because streaming information is essentially downloading. If the browser sends information to the server, it becomes another HTTP request

Instructions 

Server-Sent Events tutorial - Ruan Yifeng's weblog https://www.ruanyifeng.com/blog/2017/05/server-sent_events.html

Disadvantages: not possible, such as adding token in the request header, etc.

 getSSE() {
      return new Promise((resolve, reject) => {
        let base = process.env.VUE_APP_SYSTEMURL;
        let url = `${base}/server/sampleRemovePush/sse`;
        if (window.EventSource) {
          this.SSE = new EventSource(url);
          this.SSE.addEventListener(
            "open",
            e => {
              console.log("建立连接。。。", e);
            },
            false
          );
          this.SSE.addEventListener(
            "message",
            event => {
              console.log("ebent", event);
              resolve(event);
            },
            false
          );
          this.SSE.addEventListener(
            "error",
            event => {
              // readyState连接状态: 0 - connecting; 1 - open; 2 - closed;
              if ((event.readyState = EventSource.CLOSED)) {
                console.log("sse错误------", event);
                reject("请求错误!");
              } else {
                resolve(event);
              }
            },
            false
          );
          // this.SSE.addEventListener("close", event => {
          //   console.log("我要关闭啦", event.type);
          //   this.SSE.close();
          // });
        } else {
          console.log("你的浏览器不支持SSE");
        }
      });
    },

 If you add custom parameters, you can use the three-party plug-in event-source-polyfill

GitHub - Yaffle/EventSource: a polyfill for http://www.w3.org/TR/eventsource/a polyfill for http://www.w3.org/TR/eventsource/. Contribute to Yaffle/EventSource development by creating an account on GitHub.https://github.com/Yaffle/EventSource/使用方法

npm install event-source-polyfill

import {EventSourcePolyfill} from 'event-source-polyfill';

  let base = process.env.VUE_APP_SYSTEMURL;
      let url = `${base}/server/sampleRemovePush/sse`;
      let { access_token } = this.$store.state.login.login;
      var es = new EventSourcePolyfill(url, {
        headers: {
          Authorization: access_token ? `Bearer${access_token}` : ""
        }
      });

      es.onopen = function(event) {
        console.log("连接成功", event);
      };

      es.onmessage = function(event) {
        // to to something…
        console.log("接收信息", event);
      };

      es.onerror = function(error) {
        // 监听错误
        console.log("错误", error);
      };

You can see that the token has been added