后台老哥要用微软的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);