当前位置: 首页 > news >正文

uniapp使用@microsoft/signalr(报错“ReferenceError: require is not defined“)

后台老哥要用微软的signalr,总结了一些经验和问题

引入方法

1、npm

npm i @microsoft/signalr

2、下载他的js或者cdn

<script src="https://cdnjs.cloudflare.com/ajax/libs/microsoft-signalr/6.0.1/signalr.js"></script>

在uniapp中,h5是正常的,运行到App会报ReferenceError: require is not defined
在这里插入图片描述
可以使用renderjs

用法不想看可以直接复制

<script module="test" lang="renderjs">import * as signalR from "@microsoft/signalr";export default {data() {return {connection: null}},mounted() {// 建立连接console.log(signalR)this.connection = new signalR.HubConnectionBuilder().withUrl("xxxxx") // 此处填服务器地址.configureLogging(signalR.LogLevel.Information).build();// 注册方法(给后端调用的,需要在methods中定义)// this.connection.on("ReceiveMessage", this.ShowMsg);// 开始连接this.connection.start().then((res) => {console.log("Connected!a")this.$ownerInstance.callMethod('isConnected', {connected: true})this.connection.invoke("SendMessage", "hello world")}).catch((err) => {console.log(err)});return}}
</script>

注:可以直接新建一个script 标签,放在原页面script 标签的下面,像这样。
在这里插入图片描述

顺道写下使用方法 signalr文档,不太友好

注:在renderjs中,uni的东西都不可以使用
先引入。或者使用上面那种引入

import {HubConnectionBuilder} from "@microsoft/signalr";

建立连接
withAutomaticReconnect()这个是自动断线重连,就简单测试了一下是有用的所以不需要自己写心跳。

// 建立连接this.connection = new HubConnectionBuilder().withUrl(url) // 此处填服务器地址// .configureLogging(signalR.LogLevel.Information).withAutomaticReconnect().build();

开始连接
有成功和失败的回调

this.connection.start().then(() => {console.log('Connection established.');}).catch((error) => {console.error('Error connecting to SignalR server: ', error);});

调用SignalR服务器端的方法
第一个是方法名称,后面具体参数看后台

this.connection.invoke('serverMethod', data).then((response) => {console.log('Received response from SignalR server: ', response);}).catch((error) => {console.error('Error calling server method: ', error);});

接收服务器返回值
通过on来接收,第一个是方法名称

this.connection.on("ReceiveMessage",(res)=>{})

具体推送可以写在上面,推送文档 plus.push
注:需要在打包的时候勾选uni.push

let content = JSON.parse(message).name +'有一条新的危急值消息!';let options = {"cover": false,"when": new Date(),'title': "危急值"};let body = {'id': 'id','key': "key"}// let payload = JSON.stringify(body);plus.push.createMessage(content, '', options);
http://www.lryc.cn/news/158461.html

相关文章:

  • CloudCompare 二次开发(9)——半径滤波
  • ElementUI浅尝辄止29:Breadcrumb 面包屑
  • ABB MPRC086444-005数字输入模块
  • stable diffusion实践操作-常见lora模型介绍
  • kubeadm 安装k8s
  • 选择最适合您的Bug管理软件:市场比较与推荐
  • Spring MVC的常用注解及用法
  • HTTP和HTTPS的区别、 HTTPS运行原理
  • 统计封闭岛屿的数目
  • 【数据结构与算法系列4】长度最小的子数组
  • 问道管理:底部渐渐抬高 今年反弹时刻或已来临
  • 正规黄金代理的三大要素
  • Spine2D骨骼动画播放器 - 微信小程序版
  • 蓝天转债,双良转债上市价格预测
  • python-爬虫-xpath方法-批量爬取王者皮肤图片
  • go锁--读写锁
  • Unity中Shader的屏幕坐标
  • springboot MongoDB 主从 多数据源
  • 【100天精通Python】Day57:Python 数据分析_Pandas数据描述性统计,分组聚合,数据透视表和相关性分析
  • Unity 切换场景后场景变暗
  • RabbitMQ学习笔记
  • 【C# Programming】类、构造器、静态成员
  • 软件层面缓存基本概念与分类
  • 单片机有哪些分类?
  • 高阶数据结构-----三种平衡树的实现以及原理(未完成)
  • 北斗高精度组合导航终端
  • 低代码平台是否能替代电子表格?
  • qt多个信号如何关联一并处理
  • 【python爬虫】12.建立你的爬虫大军
  • 2023数学建模国赛C题思路--蔬菜类商品的自动定价与补货决策