以下是一个简化的例子，展示了如何在ASP.NET Core SignalR中使用TypeScript与JavaScript与服务端端点进行通信。
首先，这是C#的SignalR集线器类：
using Microsoft.AspNetCore.SignalR;
public class ChatHub : Hub
{
public async Task SendMessage(string user, string message)
{
await Clients.All.SendAsync("ReceiveMessage", user, message);
}
}然后，这是Vue 3中的TypeScript代码，用于连接到上述集线器并接收消息：
import { HubConnection, HubConnectionBuilder } from '@microsoft/signalr';
let connection: HubConnection;
async function startConnection() {
connection = new HubConnectionBuilder()
.withUrl('http://your-backend-url/chathub')
.build();
connection.on('ReceiveMessage', (user, message) => {
console.log(user + ' says: ' + message);
});
try {
await connection.start();
console.log('Connected to SignalR server');
} catch (err) {
console.log(err);
setTimeout(startConnection, 5000);
}
}
startConnection();最后，这是Vue 3中的JavaScript代码，用于发送消息到集线器：
import { HubConnectionBuilder } from '@microsoft/signalr';
let connection;
async function startConnection() {
connection = new HubConnectionBuilder()
.withUrl('http://your-backend-url/chathub')
.build();
try {
await connection.start();
console.log('Connected to SignalR server');
} catch (err) {
console.log(err);
setTimeout(startConnection, 5000);
}
}
async function sendMessage(user, message) {
if (connection) {
await connection.invoke('SendMessage', user, message);
}
}
startConnection();在这个例子中，我们创建了一个HubConnection，并使用.withUrl()指定了SignalR集线器的URL。我们监听了一个名为ReceiveMessage的集线器方法，这样当服务端调用它时，我们可以在客户端接收到消息。我们还可以调用sendMessage函数，通过invoke方法来发送消息到服务端集线器。如果连接失败，我们会尝试每5秒重新连接一次。