SignalR長接続の簡単な使い方
1973 ワード
ASP.NET SignalRはASP.NET開発者が提供するライブラリは、開発者がリアルタイムのWeb機能をアプリケーションに追加するプロセスを簡素化します.リアルタイムWeb機能とは、接続されたクライアントが利用可能になると、サーバコードがクライアントから新しいデータの要求を待つのではなく、すぐにコンテンツをプッシュする機能です.
次は簡単なdemoです.参照(https://docs.microsoft.com/en-us/aspnet/core/signalr/javascript-client?view=aspnetcore-3.0)
コード実行の結果、フロントエンドはサーバのようにデータを送信し、サーバが受信した後、フロントエンドに対応するデータをプッシュし、プロセス全体でページがリフレッシュされません.
次は簡単なdemoです.参照(https://docs.microsoft.com/en-us/aspnet/core/signalr/javascript-client?view=aspnetcore-3.0)
コード実行の結果、フロントエンドはサーバのようにデータを送信し、サーバが受信した後、フロントエンドに対応するデータをプッシュし、プロセス全体でページがリフレッシュされません.
document.addEventListener('DOMContentLoaded', function () {
var messageInput = document.getElementById('message');
// Get the user name and store it to prepend to messages.
var name = prompt('Enter your name:', '');
// Set initial focus to message input box.
messageInput.focus();
//
var connection = new signalR.HubConnectionBuilder()
.withUrl('http://192.168.1.156:5000/privatecar')
.build();
connection.qs = { 'orderId' : '12346579' };
//
connection.on('RegisterClient', function (name, message) {
// Html encode display name and message.
console.log(name)
});
// Transport fallback functionality is now built into start.
connection.start()
.then(function () {
console.log('connection started');
document.getElementById('sendmessage').addEventListener('click', function (event) {
//
connection.invoke('CarPositionChanged', name, messageInput.value);
// Clear text box and reset focus for next comment.
messageInput.value = '';
messageInput.focus();
event.preventDefault();
});
})
.catch(error => {
console.error(error.message);
});
});