[開源]OSharpNS - .net core 快速開發框架 - 快速開始


什么是OSharp

OSharpNS全稱OSharp Framework with .NetStandard2.0,是一個基於.NetStandard2.0開發的一個.NetCore快速開發框架。這個框架使用最新穩定版的.NetCore SDK(當前是.NET Core 2.2),對 AspNetCore 的配置、依賴注入、日志、緩存、實體框架、Mvc(WebApi)、身份認證、權限授權等模塊進行更高一級的自動化封裝,並規范了一套業務實現的代碼結構與操作流程,使 .Net Core 框架更易於應用到實際項目開發中。

開發環境

OSharp 框架使用現在流行的 前后端分離 的架構模式,開發環境的初始化涉及后端開發環境和前端開發環境。

后端開發環境

后端開發環境指的是 .NetCore 的開發環境,涉及到的開發環境為SDK,IDE,數據庫等。

.NetCore SDK

OSharp 框架的后端是基於 .NetCore 的最新穩定版本的,目前最新穩定版本為 Microsoft.AspNetCore.App,當 3.0 版本發布穩定版本之后,不出意外 OSharp 會跟隨腳步升級到 3.0,所以,請安裝最新版本的 SDK。
最新 SDK 下載地址如下:

https://dotnet.microsoft.com/download

  • 點擊 Download .NET Core SDK 按鈕進行最新 SDK 的下載。
  • 在服務器部屬的時候,不需要完整的 SDK,點擊 Download .NET Core Runtime 按鈕進行最新 Runtime 的下載。

安裝完成后,在 命令提示符PowerShell 窗口輸入如下命令,即可查看到本機已安裝的 .NetCore 的 SDK 和 Runtime 版本詳細信息

dotnet --info

我的電腦輸出如下,可以看到,已經安裝了 2.2.203 版本的 SDK 和 2.2.4 版本的 Runtime:

.NET Core SDK(反映任何 global.json):
 Version:   2.2.203
 Commit:    e5bab63eca

運行時環境:
 OS Name:     Windows
 OS Version:  10.0.17763
 OS Platform: Windows
 RID:         win10-x64
 Base Path:   C:\Program Files\dotnet\sdk\2.2.203\

Host (useful for support):
  Version: 2.2.4
  Commit:  f95848e524

.NET Core SDKs installed:
  2.2.203 [C:\Program Files\dotnet\sdk]

.NET Core runtimes installed:
  Microsoft.NETCore.App 2.2.4 [C:\Program Files\dotnet\shared\Microsoft.NETCore.App]

To install additional .NET Core runtimes or SDKs:
  https://aka.ms/dotnet-download

IDE (集成開發環境)

  • Visual Studio 2019:開發 .NET 程序,當前首先宇宙最強IDE Visual Studio,.NetCore 2.2 的可用VS版本為 VS2017 和 VS2019,推薦使用最新版本的 VS2019。
  • Visual Studio Code:如果你覺得VS太過笨重,喜歡比較輕量級的IDE,VS Code 也是個很不錯的選擇,只需裝上 C# 插件即可完美運行 .NetCore 代碼。VS Code 也是目前最好用的前端IDE,后面將作為前端IDE進行前端代碼的開發。

兩個IDE都可以在如下的地址中下載:

https://visualstudio.microsoft.com/zh-hans/downloads/

補充說明

當使用 Visual Studio 時,Resharper 這個插件是個不可錯過的插件,可以在 智能提示、變量命名、代碼優化、代碼重構、代碼結構導航、dll反編譯查看源代碼等方面對 Visual Studio 進行大量不可多得的功能補充。當然,這個插件比較吃資源,需要你有一台性能優良的硬件機器才能流暢使用。

數據庫

OSharp 框架的數據存儲是基於 EntityFrameworkCore (簡稱EFCore) 這個ORM實現的,只要 EFCore 支持的數據庫,都可以作為 OSharp 的數據存儲,現已支持數據庫如下:

  • Microsift SqlServer 2012+
  • MySql 5.7+
  • Sqlite
  • PostgreSql
  • Oracle

前端開發環境

在前后端分離的項目中,三大前端技術框架 Angular、Vue、React 已經成為不可跨越的必選項,基於歷史的原因(osharp的.net fx 版本基於AngularJS),OSharp 的前端是基於 Angular 實現的,考慮到 Vue 在國內不可忽視的市場,Vue 版本的前端也在計划之內,而 React 版本目前還沒有排上日程。
要上三大前端,NodeJS 是必須的,可在如下地址獲得 NodeJS 的安裝包:

https://nodejs.org/en/

NodeJS 安裝 好之后,NPM 也就可以用了。但 NPM 的默認安裝源在國外,通常會比較慢,因此需要把 NPM 的安裝源設置到國內鏡像源,淘寶鏡像是個不錯的選擇,執行如下命令設置將淘寶鏡像設置為NPM的安裝源:

npm config set registry https://registry.npm.taobao.org

Angular

OSharp 的 Angular 版前端是基於 NG-ALAIN 前端框架開發的。NG-ALAIN 是一個基於 Antd 中后台前端解決方案,提供更多通用性業務模塊,讓開發者更加專注於業務。
首先,需要通過 npm 命令全局安裝 @angular/cli 運行環境

npm install -g @angular/cli

Vue

OSharp 的 Vue 版前端是基於 IView 前端框架開發的。IView 是一套基於 Vue.js 的高質量 UI 組件庫。
首先,需要通過 npm 命令全局安裝 @vue/cli 運行環境

npm install -g @vue/cli

由於精力有限及優先級的問題,Vue版本現在尚未開發完成。

項目初始化

每一個新項目,都離不開身份認證,權限授權,系統配置,還有相應的前端操作界面等基礎而重復的工作,如果每一個新項目都要從0開始做這些重復性工作,是很無味而繁瑣的。因此,OSharp 框架制作了一個基於 dotnet cli 命令行工具的快速啟動模板 OSharpNS.Template.Mvc_Angular ,一鍵搞定這些重復性的模塊,讓項目啟動不再繁瑣。下面讓我們一起來啟動一個新項目。

安裝 OSharp 的 dotnet new 項目模板

安裝項目模板的前提,是已經按照前面的要求下載安裝好了 .NetCore SDK。>>飛機票

在任意空白文件夾,打開 cmdpowershell 命令行窗口,執行如下命令安裝或更新 OSharp .NetCore CLI 項目模板

dotnet new -i OSharpNS.Template.Mvc_Angular

執行后,將能看到 osharp_xxx 系列的命令已安裝到 .NetCore CLI 列表中

Name Command Language Path
OSharp Build Command File osharp [C#] Web/MVC/OSHARP
OSharp Solution Project osharp_sln [C#] Web/MVC/OSHARP
OSharp Service Core Project osharp_core [C#] Web/MVC/OSHARP
OSharp EntityConfiguration Project osharp_entityconfig [C#] Web/MVC/OSHARP
OSharp MVC Project osharp_mvc [C#] Web/MVC/OSHARP
OSharp Angular Project osharp_ng Angular Web/MVC/OSHARP

其中 osharp 是個一鍵命令,可通過此命令創建一個完整的項目啟動解決方案。下面,我們以創建一個 博客系統 為例,完整的步驟如下:

  1. 執行 osharp 命令,得到一個 osharp.cmd 腳本文件

    dotnet new osharp

    輸出:

    已成功創建模板“OSharp Build Command File”。
  1. 打開 osharp.cmd 腳本文件,進行解決方案生成

    ./osharp.cmd

    輸出:

    -------------------------
    - 歡迎使用 OSharp一鍵模板 命令
    - http://www.osharp.org
    - Copyright @ 2014 - 2019 OSHARP.ORG
    -------------------------
    請輸入項目名稱,推薦形如 “公司.項目”的模式:
  1. 按要求的格式 公司.項目 輸入項目名稱,即生成項目的主命名空間。

    例如,公司的代碼為 Liuliu,要創建一個博客系統,則輸入 Liuliu.Blogs

    Liuliu.Blogs

    輸出:

    已成功創建模板“OSharp Solution Project”。
    已成功創建模板“OSharp Service Core Project”。
    已成功創建模板“OSharp EntityConfiguration Project”。
    已成功創建模板“OSharp MVC Project”。
    已成功創建模板“OSharp Angular Project”。
    項目代碼生成完成

至此,一個完整的項目啟動解決方案創建完成。
完整的創建過程演示如下:

打開項目,讓項目跑起來

使用VS2019打開后端 .NetCore 解決方案

使用 VS2019 打開 解決方案文件 Liuliu.Blogs.sln,可以看到各個工程之間的引用關系已經配置好了,OSharp框架的各個依賴類庫也已引用了 nuget.org 上的相應版本,並將自動完成類庫還原。

解決方案項目結構如下:

Liuliu.Blogs                                # 解決方案根目錄
└─src                                       # 源代碼
    ├─Liuliu.Blogs.Core                     # 業務層
    │  ├─Common                             # 通用業務服務
    │  ├─Identity                           # 身份認證模塊業務服務
    │  │  ├─Dtos                            # 身份認證模塊傳輸DTO
    │  │  ├─Entities                        # 身份認證模塊數據實體
    │  │  └─Events                          # 身份認證模塊事件處理器
    │  ├─Security                           # 權限安全模塊業務服務
    │  └─Systems                            # 系統模塊業務服務
    ├─Liuliu.Blogs.EntityConfiguration      # 實體類數據庫映射配置工程
    │  ├─Identity                           # 身份認證模塊實體類配置
    │  ├─Security                           # 權限安全模塊實體類配置
    │  └─Systems                            # 系統模塊實體類配置
    └─Liuliu.Blogs.Web                      # Web工程
       ├─Areas                              # 區域文件夾
       │  └─Admin                           # 管理區域
       │      └─Controllers                 # 管理API控制器
       │          ├─Identity                # 身份認證模塊API
       │          ├─Security                # 權限安全模塊API
       │          └─Systems                 # 系統模塊API
       ├─Controllers                        # 前台API
       ├─Hangfire                           # Hangfire后台工作
       ├─Migrations                         # 數據庫遷移
       └─Startups                           # 啟動相關代碼
  • Liuliu.Demo.Core: 業務核心工程,頂層文件夾以業務模塊內聚,每個文件夾按職責划分文件夾,通常可包含傳輸對象Dtos、實體類型Entities、事件處理Events等,業務接口IXXXContract與業務實現IXXXService放在外邊,如果文件數量多的話也可以建文件夾存放。
  • Liuliu.Demo.EntityConfiguration: EFCore實體映射工程,用於配置各個業務實體映射到數據庫的映射細節。文件夾也推薦按模塊內聚。
  • Liuliu.Demo.Web: 網站的Hosting項目,按常規方式使用即可

我們仍需做一點小工作,才能讓后端工程跑起來:

  1. 將 Web 工程 Liuliu.Blogs.Web 設置為啟動項目
  2. 打開配置文件 appsettings.Development.json,啟用相應數據庫連接配置,並將數據庫連接用戶名和密碼改為本地環境的用戶名和密碼
    "SqlServer": {
      "DbContextTypeName": "OSharp.Entity.DefaultDbContext,OSharp.EntityFrameworkCore",
      "ConnectionString": "Server=.;Database=Liuliu.Blogs-dev;User Id=sa;
          Password=Abc123456!;MultipleActiveResultSets=true",
      "DatabaseType": "SqlServer",
      "LazyLoadingProxiesEnabled": true,
      "AuditEntityEnabled": true,
      "AutoMigrationEnabled": true
    }

特別注意:

數據庫配置中,同一上下文(相同的 DbContextTypeName)只能配置一種數據庫類型(DatabaseType),並且要保持在 appsettings.jsonappsettings.Development.json 范圍內 全局唯一,否則將會引發異常無法正常啟動。

完成配置后,在 VS2019 上按 Ctrl+F5 啟動項目,將看到項目正常啟動(前提是你已經安裝好了相應版本的 .NetCore SDK)。我們將在瀏覽器看到 Swagger 的API頁面:

打開相應的數據庫管理軟件(本次使用MSSQL,這里使用VS2019自帶的 SQL Server 對象資源管理器),可以看到數據庫已經自動生成,並且必要基礎數據已經初始化完成:

使用VSCode打開前端 Angular 項目

使用 VS Code 打開 src/ui/ng-alain 文件夾,前端項目是基於 NG-ALAIN,項目結構如下:

   ├── _mock                                       # Mock 數據規則
   ├── src
   │   ├── app
   │   │   ├── core                                # 核心模塊
   │   │   │   ├── i18n
   │   │   │   ├── net
   │   │   │   │   └── default.interceptor.ts      # 默認HTTP攔截器
   │   │   │   ├── services
   │   │   │   │   └── startup.service.ts          # 初始化項目配置
   │   │   │   └── core.module.ts                  # 核心模塊文件
   │   │   ├── layout                              # 通用布局
   │   │   ├── routes
   │   │   │   ├── **                              # 業務目錄
   │   │   │   ├── routes.module.ts                # 業務路由模塊
   │   │   │   └── routes-routing.module.ts        # 業務路由注冊口
   │   │   ├── shared                              # 共享模塊
   │   │   │   └── shared.module.ts                # 共享模塊文件
   │   │   ├── app.component.ts                    # 根組件
   │   │   └── app.module.ts                       # 根模塊
   │   │   └── delon.module.ts                     # @delon模塊導入
   │   ├── assets                                  # 本地靜態資源
   │   ├── environments                            # 環境變量配置
   │   ├── styles                                  # 樣式目錄
   └── └── style.less                              # 樣式引導入口

Ctrl + ~ 快捷鍵,調出 VS Code 的命令行控制台,輸入 NodeJS 包安裝命令:

npm install

依賴包安裝完成之后,輸入項目啟動命令

npm start

此命令將會執行如下命令:ng serve --port 4201 --proxy-config proxy.config.json --open,其中--proxy-config proxy.config.json對前端項目發起的API請求進行了代理,所有以 /api/開頭的請求,都會轉發到服務端項目中進行處理,代理的實際配置如下:

{
  "/api": {
    "target": "http://localhost:7001",
    "secure": false
  }
}

至此,項目啟動完成,將進入登錄界面,如下圖所示:

需要注冊一個用戶,才能進入系統。

第一個注冊用戶將自動擁有 最高權限超級管理員 角色身份。

注冊界面:

后台主頁:

功能管理:

數據實體管理:


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM