SignalR 在vue3中的使用

1、npm 下载需要的版本

npm install @microsoft/signalr@7.0.2
//失败可从淘宝镜像
npm install @microsoft/signalr@7.0.2 --registry=<http://registry.npm.taobao.org>

2、public/js 放入下载的signalr.js

3、public 下 index.html 引入 ----全局

<script src="./js/signalr.js"></script>

4、使用 字段需和后端约定 withUrl跟接口地址 如具体地址为：http://......../dsdapi/hubs/notify

   const connection = new signalR.HubConnectionBuilder()
                  .withUrl('具体的地址', {
                    withCredentials: false,
                    accessTokenFactory() {
                      return sessionStorage.getItem('access_token') || ''; //access_token | token
                    }
                  })
                  .configureLogging(signalR.LogLevel.Information)
                  .build();

const connection = new signalR.HubConnectionBuilder()
        .withUrl((window as any).apiUrlList['pandahost'] + '/hubs/notify', {
          withCredentials: false,
          accessTokenFactory() {
            return sessionStorage.getItem('access_token') || '';
            // 本地调试
            // return 'eyJhbGciOiJSUzI1NiIsImtpZCI6IjhERjM3NzgyNEU4OTQ3RTE3QjRCMTFEQUIxQzFFOENEIiwidHlwIjoiYXQrand0In0.eyJuYmYiOjE3MDQxOTA0MjQsImV4cCI6MTcwNDI3NjgyNCwiaXNzIjoiaHR0cDovLzQxMzRkNTc3ejQuemljcC52aXA6NTE5MjkiLCJjbGllbnRfaWQiOiJyby5jbGllbnQiLCJzdWIiOiIxMjlkZDlmNi1jNzY0LTRkMjItYjBhZi1jMmI4NGE5MGUyYWYiLCJhdXRoX3RpbWUiOjE3MDQxOTA0MjQsImlkcCI6ImxvY2FsIiwibmFtZSI6IlRlc3RMYWIiLCJDdXN0b21lclR5cGUiOiIzIiwiQ3VzdG9tZXJJZCI6Ijg2Y2U2YjFhLWI4NjEtNDE3YS05MDMzLTdhZGQ3OTkyMTJhNyIsImp0aSI6IjAwMjE5RkM5NzE4NjFGM0YxRDdDRkIzMjVGMjYyOTYyIiwiaWF0IjoxNzA0MTkwNDI0LCJzY29wZSI6WyJhcGkucmVzb3VyY2UuZnVsbCJdLCJhbXIiOlsicHdkIl19.P8IdQXji47oXeihiwXINlARLhiVAn51xZZtIc-HtLJTA3SPT1QeZil1Mj-7rDWcS7Mqv-wMWvWHZksfc454AzuXj74yc2FHSJ_DWitnWX9v9IcrsAvqWJaE9FKf2KFGpPUlCXDYvuDE1HFYWhKUUC3KGXMz-Df0KMaiMJYxwx3oKcuMOq_v8588j1k7uEUgnGfwoSMyxd_9W0ks1pQ_Q5QUIz5GHjTpf8U1cf_912KKxztfnN_eU2e1PKEMvn5SS9-2MEB7GQ7WwOZeg6gsHwXGPMB4py5anpCelMnx5f_ts2LTpysKZWicinlkLWc8nLjNW_CoPMobIGjZig3QbNg';
          }
        })
        .configureLogging(signalR.LogLevel.Information)
        .build();
      connection.on('Message', (msg: any) => {
        console.log(msg, 'Completed==Message=');
        singLr();
      });

      connection.on('Failed', async (msg: any) => {
        console.log('Failed=====', msg);
      });
      async function start() {
        await connection.start();
        console.log('start----启动');
      }
      // 链接启动
      start();