uniapp使用简单方法signalR（仅用于web调试，无法打包app）

ASP.NET Core SignalR 是一种开放源代码库，可简化将实时 web 功能添加到应用程序的功能。实时 web 功能使服务器端代码可以立即将内容推送到客户端。适用于 SignalR ：需要从服务器进行高频率更新的应用。示例包括游戏、社交网络、投票、拍卖、地图和 GPS 应用。仪表板和监视应用。示例包括公司仪表板、即时销售更新或旅行警报。协作应用。协作应用的示例包括白板应用和团队会议软件

矿工学编程

7329人浏览 · 2020-10-26 14:41:52

矿工学编程 · 2020-10-26 14:41:52 发布

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、效果