ฉันกำลังสร้างแอปพลิเคชันแชทใน web api ASP-NET ด้วย C# ใน VS Code การลงทะเบียนผู้ใช้และการเข้าสู่ระบบทำงานกับฐานข้อมูล ฉันเพิ่มโค้ดตัวอย่าง SignalR ลงในหน้ายินดีต้อนรับ แต่ฉันต้องการแก้ไข: ชื่อผู้ใช้ต้องเป็นชื่อผู้ใช้ที่บันทึกไว้ และหลังจากนั้นเมื่อฉันคลิก "ส่งข้อความ" จะต้องมีลักษณะดังนี้: ''acc1 กล่าวสวัสดีชาวโลก''
ฟังก์ชั่นปุ่ม ''ส่งข้อความ'' อยู่ในไฟล์ ''chat.js'' และฉันไม่รู้ว่าฉันจะรับสตริง ''ชื่อผู้ใช้" ได้อย่างไร ที่นั่น
HttpContext.Session.GetString("username")
ไม่ทำงานในจาวาสคริปต์
แชท.เจส
"use strict";
var connection = new signalR.HubConnectionBuilder().withUrl("/chatHub").build();
//Disable send button until connection is established
document.getElementById("sendButton").disabled = true;
connection.on("ReceiveMessage", function (user, message) {
var msg = message.replace(/&/g, "&").replace(/</g, "<").replace(/>/g, ">");
var encodedMsg = user + " says " + msg;
var li = document.createElement("li");
li.textContent = encodedMsg;
document.getElementById("messagesList").appendChild(li);
});
connection.start().then(function () {
document.getElementById("sendButton").disabled = false;
}).catch(function (err) {
return console.error(err.toString());
});
document.getElementById("sendButton").addEventListener("click", function (event) {
var user = document.getElementById("userInput").value;
var message = document.getElementById("messageInput").value;
connection.invoke("SendMessage", user, message).catch(function (err) {
return console.error(err.toString());
});
event.preventDefault();
});
Wilcome.cshtml
@page
@model probagetrequest.Pages.WilcomeModel
@using Microsoft.AspNetCore.Http
<!DOCTYPE html>
<html>
<head>
<meta name="viewport" content="width=device-width" />
<title>Wilcome</title>
</head>
<body>
Welcome @HttpContext.Session.GetString("username")
<br>
<br>
<a asp-page="index" asp-page-handler="logout">Logout</a>
<a asp-page="profile">Change Profile</a>
<div class="container">
<div class="row"> </div>
<div class="row">
<div class="col-2">User</div>
<div class="col-4"><input type="text" id="userInput" /></div>
</div>
<div class="row">
<div class="col-2">Message</div>
<div class="col-4"><input type="text" id="messageInput" /></div>
</div>
<div class="row"> </div>
<div class="row">
<div class="col-6">
<input type="button" id="sendButton" value="Send Message" />
</div>
</div>
</div>
<div class="row">
<div class="col-12">
<hr />
</div>
</div>
<div class="row">
<div class="col-6">
<ul id="messagesList"></ul>
</div>
</div>
<script src="~/js/signalr/dist/browser/signalr.js"></script>
<script src="~/js/chat.js"></script>
</body>
</html>
ChatHub.cs
using Microsoft.AspNetCore.SignalR;
using System.Threading.Tasks;
using System;
namespace SignalRChat.Hubs
{
public class ChatHub : Hub
{
public async Task SendMessage(string user, string message)
{
Console.WriteLine($"user={user}, message={message}");
await Clients.All.SendAsync("ReceiveMessage", user, message);
}
}
}