ASP.NET MVC 迅速集成 SignalR的過程
在現(xiàn)代 Web 應用程序中,實時更新數據是一個常見需求。本文將詳細介紹如何在 ASP.NET MVC 項目中使用 SignalR 實現(xiàn)定時任務操作數據庫并將數據更新到網頁。我們將逐步講解如何配置 SignalR、創(chuàng)建定時任務、操作數據庫以及在前端顯示實時數據。
1. 項目初始化
首先,創(chuàng)建一個新的 ASP.NET MVC 項目。
● 打開 Visual Studio,選擇 File > New > Project。
● 選擇 ASP.NET Web Application,命名項目為 RealTimeDataUpdate。
● 選擇 MVC 模板并點擊 Create。
2. 安裝和配置 SignalR
在項目中安裝 SignalR 包,并進行配置。
.打開 NuGet 包管理器控制臺,運行以下命令:
Install-Package Microsoft.AspNet.SignalR
.在 Startup.cs 文件中配置 SignalR:
using Microsoft.Owin;
using Owin;
[assembly: OwinStartup(typeof(RealTimeDataUpdate.Startup))]
namespace RealTimeDataUpdate
{
public class Startup
{
public void Configuration(IAppBuilder app)
{
app.MapSignalR();
}
}
}3. 創(chuàng)建數據庫和模型
創(chuàng)建一個簡單的數據庫和模型來存儲和獲取數據。
1. 創(chuàng)建一個名為 DataContext 的類:
using System.Data.Entity;
public class DataContext : DbContext
{
public DbSet<SensorData> SensorData { get; set; }
}
public class SensorData
{
public int Id { get; set; }
public string Temperature { get; set; }
public string Humidity { get; set; }
public DateTime Timestamp { get; set; }
}2. 在 Web.config 文件中添加數據庫連接字符串:
<connectionStrings>
<add name="DataContext" connectionString="Data Source=(localdb)\MSSQLLocalDB;Initial Catalog=RealTimeData;Integrated Security=True" providerName="System.Data.SqlClient" />
</connectionStrings>4. 創(chuàng)建 SignalR Hub
創(chuàng)建一個 SignalR Hub 來處理客戶端連接和數據更新。
1. 創(chuàng)建一個名為 DataHub 的類:
using Microsoft.AspNet.SignalR;
public class DataHub : Hub
{
public void SendData(string temperature, string humidity)
{
Clients.All.updateData(new { Temperature = temperature, Humidity = humidity, Timestamp = DateTime.Now });
}
}5. 實現(xiàn)定時任務
使用 System.Threading.Timer 實現(xiàn)定時任務,每隔一段時間從數據庫獲取數據并通過 SignalR 更新到客戶端。
1. 創(chuàng)建一個名為 DataScheduler 的類:
using System;
using System.Threading;
public class DataScheduler
{
private Timer _timer;
public void Start()
{
_timer = new Timer(UpdateData, null, 0, 5000); // 每5秒執(zhí)行一次
}
private void UpdateData(object state)
{
using (var context = new DataContext())
{
var latestData = context.SensorData.OrderByDescending(d => d.Timestamp).FirstOrDefault();
if (latestData != null)
{
var hubContext = GlobalHost.ConnectionManager.GetHubContext<DataHub>();
hubContext.Clients.All.updateData(new
{
Temperature = latestData.Temperature,
Humidity = latestData.Humidity,
Timestamp = latestData.Timestamp
});
}
}
}
}2. 在 Global.asax 文件中啟動定時任務:
protected void Application_Start()
{
AreaRegistration.RegisterAllAreas();
FilterConfig.RegisterGlobalFilters(GlobalFilters.Filters);
RouteConfig.RegisterRoutes(RouteTable.Routes);
BundleConfig.RegisterBundles(BundleTable.Bundles);
var scheduler = new DataScheduler();
scheduler.Start();
}6. 前端頁面和腳本
創(chuàng)建一個簡單的前端頁面來顯示實時數據。
1. 在 Views/Home/Index.cshtml 文件中添加以下代碼:
@model IEnumerable<RealTimeDataUpdate.Models.SensorData>
@{
ViewBag.Title = "實時數據監(jiān)測";
}
<h2>最新溫濕度數據</h2>
<table>
<tr>
<th>Temperature</th>
<th>Humidity</th>
<th>Timestamp</th>
</tr>
<tr>
<td id="temperature"></td>
<td id="humidity"></td>
<td id="timestamp"></td>
</tr>
</table>
<script src="~/Scripts/jquery-3.6.0.min.js"></script>
<script src="~/Scripts/jquery.signalR-2.4.2.min.js"></script>
<script src="~/signalr/hubs"></script>
<script type="text/javascript">
$(document).ready(function() {
var hub = $.connection.dataHub;
hub.client.updateData = function (data) {
$('#temperature').text(data.Temperature);
$('#humidity').text(data.Humidity);
$('#timestamp').text(data.Timestamp);
};
$.connection.hub.start().done(function () {
console.log("SignalR connected");
});
});
</script>7. 運行和測試
- 運行項目,確保數據庫已創(chuàng)建并有一些初始數據。
- 打開瀏覽器,訪問你的應用程序,應該可以看到實時更新的溫濕度數據。
通過以上步驟,你已經成功在 ASP.NET MVC 項目中使用 SignalR 實現(xiàn)了定時任務操作數據庫并實時更新網頁數據。
到此這篇關于ASP.NET MVC 迅速集成 SignalR的文章就介紹到這了,更多相關ASP.NET MVC集成 SignalR內容請搜索腳本之家以前的文章或繼續(xù)瀏覽下面的相關文章希望大家以后多多支持腳本之家!
相關文章
ASP.NET生成eurl.axd Http異常錯誤的處理方法
在IIS6中同時啟用了ASP.NET 2.0 和 ASP.NET 4.0 后,網站程序可能會出現(xiàn)如下錯誤:“ System.Web.HttpException: Path ‘//eurl.axd/‘ was not found. ”2011-05-05
Visual Studio實現(xiàn)xml文件使用app.config、web.config等的智能提示
這篇文章主要為大家詳細介紹了Visual Studio中xml文件使用app.config、web.config等的智能提示方法,具有一定的參考價值,感興趣的小伙伴們可以參考一下2018-09-09
解決uploadify使用時session發(fā)生丟失問題的方法
這篇文章主要為大家詳細介紹了uploadify使用時發(fā)現(xiàn)session發(fā)生丟失問題的解決方法,遇到過類似問題的朋友可以參考本文進行解決2016-05-05
.NET客戶端實現(xiàn)Redis中的管道(PipeLine)與事物(Transactions)
本文主要介紹了.NET客戶端實現(xiàn)Redis中的管道(PipeLine)與事物(Transactions)的相關知識。具有很好的參考價值,下面跟著小編一起來看下吧2017-03-03
.net?程序通過?crontab?無法啟動手動執(zhí)行腳本啟動的方法
.net 網關程序需要設置定時重啟,按照日常操作先把正在運行的 PID kill 掉后,再執(zhí)行啟動服務。通過腳本無法啟動,試著把 .net 程序寫成服務后,發(fā)現(xiàn)是可以正常重啟的,本文給大家介紹下.net 程序通過 crontab 無法啟動手動執(zhí)行腳本啟動,感興趣的朋友一起看看吧2021-12-12
ASP.NET?Core配置設置之Configuration包
這篇文章介紹了ASP.NET?Core配置設置之Configuration包,文中通過示例代碼介紹的非常詳細。對大家的學習或工作具有一定的參考借鑒價值,需要的朋友可以參考下2022-07-07

