vue EventSource使用及配置请求头、webpack代理配置教程

npm install eventsource
npm install event-source-polyfill

const eventSource = new EventSource(url); //我是在vue项目里，普通请求用的axios；这里的url可以直接写接口路径，baseUrl会直接使用axios的baseUrl
eventSource.onopen = function (e) {
     console.log(e, "连接打开时触发");
};
eventSource.onmessage = function (e) {
     console.log(e);
};
eventSource.onerror = function (e) { //断开连接及后端返回错误信息均会触发
     eventSource.close(); // 关闭连接
};

<script>
import { EventSourcePolyfill } from 'event-source-polyfill'

export default {
    methods: {
        eventSource () {
            const _this = this, eventSource = new EventSourcePolyfill(url, {
                heartbeatTimeout:300000, //超时时间，毫秒为单位，以5分钟为例
                headers: {
                    '请求头名称': '请求头值'
                }
            });
            eventSource.onopen = function (e) {
                console.log('onopen', e);
            };
            eventSource.onmessage = function (e) {
                console.log('onmessage', e);
            };
            eventSource.onerror = function (e) {
                console.log('onerror', e);
                _this.$message.error('连接失败');
                eventSource.close(); // 关闭连接
            };
        }
    }
}
</script>