uniapp使用简单方法signalR(仅用于web调试,无法打包app)

ASP.NET Core SignalR 是一种开放源代码库,可简化将实时 web 功能添加到应用程序的功能。 实时 web 功能使服务器端代码可以立即将内容推送到客户端。

适用于 SignalR :

  • 需要从服务器进行高频率更新的应用。 示例包括游戏、社交网络、投票、拍卖、地图和 GPS 应用。
  • 仪表板和监视应用。 示例包括公司仪表板、即时销售更新或旅行警报。
  • 协作应用。 协作应用的示例包括白板应用和团队会议软件。
  • 需要通知的应用。 社交网络、电子邮件、聊天、游戏、旅行警报和很多其他应用都需使用通知。

SignalR 提供一个 API,用于创建 (RPC) 的服务器到客户端 远程过程调用 。 Rpc 通过服务器端 .NET Core 代码从客户端调用 JavaScript 函数。

 uniapp如何正确连接signalR呢?参照往上的不少资料都是使用websocket,也许是本人技术不怎么样,按照实例博客使用uniapp的websocketAPI只能连接上signalR,无法正常获取和发送消息。那该怎么办呢?

通过仔细查看signalr JavaScript客户端的代码,signalr已不再依赖jQuery,只要能正确拿到signalR实例,就可以正常通讯。经过一番简单的尝试,终于测试成功。具体步骤如下。

1、按照微软官方教程,获取signalR JavaScript代码库signalr.js、signalr.js.map、signalr.min.js和signalr.min.js.map这四个文件。官方教程

2、将获取的文件复制到uniapp项目中。

本人放置在j/s/目录下

3、引入signalr,并在onLoad中读取数据。代码可以参照JavaScript客户端 代码进行编写。只要顺利拿到signalr实例,就可以正常通讯了。这里我直接抄的官方代码,不得不说,微软的改进太赞了。

<script>
	let signalR = require('../../js/signalr.js')
	export default {
		
		onLoad() {
			
			  const connection = new signalR.HubConnectionBuilder()
			            .withUrl("http://localhost:56630/chathub")
			            .configureLogging(signalR.LogLevel.Information)
			            .build();
			
			async function start() {
			            try {
			                await connection.start();
			                console.log("SignalR Connected.");
			            } catch (err) {
			                console.log(err);
			                setTimeout(start, 5000);
			            }
			        };
			 connection.onclose(start);
			        start();
			        //接收数据并弹窗
			        connection.on("ReceiveMessage", function (user, message) {       
			            console.log(message);
			        });
						
		},		
		data() {
			return {
				
			}
		},
		methods: {
        
		}
	}
</script>

4、效果

 

  • 1
    点赞
  • 11
    收藏
    觉得还不错? 一键收藏
  • 14
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论 14
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值