1、AdminLTE

一個(gè)基于 bootstrap 的輕量級(jí)后臺(tái)模板

2、AdminLTE 文檔

在線中文Demo：http://adminlte.la998.com/

在線中文文檔：http://adminlte.la998.com/documentation/index.html

Github：https://github.com/almasaeed2010/AdminLTE/releases

3、AdminLTE 布局

AdminLTE依賴于兩個(gè)主要框架：JQ和Bootstrap，其他插件可以按需增加。

從文檔可以知道，使用AdminLTE主要有四個(gè)部分：

• 包裝.wrapper。包裹整個(gè)網(wǎng)站的div。

• 主標(biāo)題.main-header。包含徽標(biāo)和導(dǎo)航欄。

• 邊欄.sidebar-wrapper。包含用戶面板和側(cè)邊欄菜單。

• 內(nèi)容.content-wrapper。包含頁眉和內(nèi)容。

在文檔中，可以找到下載地址，本文示例是使用最新的版本V2.4.5。

4、Asp.Net Core Razor

新建項(xiàng)目Asp.net Core Web應(yīng)用程序，默認(rèn)就是Razor Pages，然后添加相應(yīng)的模塊，

如圖：本文使用的SDK版本為：dotNet Core 2.1。

5、First

在Asp.Net Core項(xiàng)目中，引用AdminLTE，在wwwroot僅添加如圖三個(gè)文件夾即可：

• bower_components? 基本組件。

• dist? adminlte的主要文件。

• plugins 其他插件。

6、Second

在_Layout.cshtml文件中添加引入相關(guān)文件：

在body中，添加js：

sidebarskins.js是個(gè)人漢化的側(cè)邊欄皮膚，框架包里不存在

7、Third

開始使用AdminLTE

最后就可以運(yùn)行項(xiàng)目來預(yù)覽一下效果了：

移動(dòng)端的效果：

需要注意的是，點(diǎn)擊這個(gè)小圖標(biāo)可以實(shí)現(xiàn)左側(cè)邊欄收縮展開的功能，當(dāng)只有側(cè)邊欄可以正常收縮展開但Logo無動(dòng)于衷的時(shí)候，

你可能是少了【sidebar-mini】樣式和【logo-mini】logo小圖的引用

8、添加一個(gè)登陸

登錄界面寫得比較簡(jiǎn)約，在Pages文件夾中，添加一個(gè)Razor界面

在Startup中引入Authentication身份驗(yàn)證：

Configure方法內(nèi)調(diào)用

在Login.cshtml.cs中增加一個(gè)OnPostAsync的方法：

userService和CookieService都是在業(yè)務(wù)層定義的，gayhub會(huì)在文章末尾。

在.Net Core Razor中，xx.cshtml.cs中默認(rèn)觸發(fā)的是Get和Post方法，

• OnGet

• OnPost

• OnGetAsync

• OnPostAsync

如果是需要自定義的，舉個(gè)栗子，定義為：OnPostLoginAsync，然后在Form表單提交的【按鈕】增加asp-page-handler="Login"，

詳細(xì)的推薦大家閱讀這篇文章：ASP.NET Core - Razor頁面之Handlers處理方法。

接著，然后再Index和需要身份驗(yàn)證的地方都加上Authorize特性即可：

9、踩坑

一、Ajax Post請(qǐng)求， 400?Bad Request

折騰許久，原因是Razor被設(shè)計(jì)為可以自動(dòng)防止跨站請(qǐng)求偽造（CSRF / XSRF）攻擊。你不必編寫任何其他代碼。Razor頁面中自動(dòng)包含防偽令牌生成和驗(yàn)證。

這里請(qǐng)求失敗，是因?yàn)镻OST沒有提交AntiForgeryToken。

解決方法：

1.增加"XSRF-TOKEN"標(biāo)識(shí)到框架中

//增加了"XSRF-TOKEN"標(biāo)識(shí),值為表單自動(dòng)生成的防偽標(biāo)記
services.AddAntiforgery(o => o.HeaderName = "XSRF-TOKEN");

2.頁面*.cshtml頭部加上?

3.ajax引入

然后既可以正常訪問Handler

二、DataTables參數(shù)實(shí)例加說明

10、Banana

Demo中會(huì)使用到這兩個(gè)個(gè)人封裝的組件：

Banana.Uow是基于Dapper封裝的工作單元和倉儲(chǔ)；

Banana.Utility是常用的工具類，有Redis，加解密，拼音等等；

原文地址：https://www.cnblogs.com/zyg316/p/10953831.html

.NET社區(qū)新聞，深度好文，歡迎訪問公眾號(hào)文章匯總?http://www.csharpkit.com?

總結(jié)

以上是生活随笔為你收集整理的ASP.Net Core Razor 部署AdminLTE框架的全部?jī)?nèi)容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網(wǎng)站內(nèi)容還不錯(cuò)，歡迎將生活随笔推薦給好友。