Angular 單頁面應用後端

在ASP.NET Zero的後端是一個單頁面的AngularJs的應用。登錄時，會被重定向至 ApplicationController。它會返回應用的佈局視圖。

注意：也有一個用ASP.NET MVC和JQuery構造的多頁的版本的相同的應用程序

Application 文件夾

所有視圖，腳本和樣式文件都存放在App文件夾中

有三個主要文件夾：
- common: 存放租戶和管理員的通用資源文件
- host: 存放管理員的資源文件
- tenant: 存放租戶的資源文件

租戶和管理員都需要用到的view, direcitve，service，image都放在common文件夾下面。管理員或租戶各自的文件資源需放在各自對應的文件夾下。如果開發的是單租戶應用，可以把文件都放在租戶文件夾下。

主菜單

應用的主菜單在 AppNavigationProvider 類中定義。查看ABP的導航幫助文檔可以讓你更深入的理解怎樣創建菜單。

路由

app.js是應用程序的入口。你可以在文件中定義app angular module和angular routes。Angular ui-router 被用來路由，根據當前用戶的權限，動態的定義路由。例如：

if (abp.auth.hasPermission('Pages.Administration.Tenant.Settings')) {
    $stateProvider.state('tenant.settings', {
        url: '/settings',
        templateUrl: '~/App/tenant/views/settings/index.cshtml',
        menu: 'Administration.Settings.Tenant'
    });
}

路由定義防止用戶通過在瀏覽器地址欄中輸入URL來訪問未經授權的頁面。menu 的設置讓我們在激活該路由時讓菜單進行高亮顯示。

如你所見，.cshtml是視圖文件。同時，.html文件也可以使用。.cshtml文件可以允許我們利用Razor來創建視圖。

佈局

應用佈局文件放在common/views/layout文件夾下。在App文件夾下的所有的腳本和樣式都進行了打包處理（參見 AppBundleConfig 類）。你放在該文件夾下的任何腳本和樣式將自動被添加到Layout中。

如上圖所示，佈局包含幾個部分。主菜單呈現在siderbar。

版本管理

如果你不是開發的多租戶應用，那麼你可以跳過這部分。

大多數 SaaS（多租戶）應用版本包含不同的功能集。那麼我們怎麼根據不同的價格向租戶提供不同選擇呢。Editions page （管理員登錄可見）就是用來管理應用程序版本的。

版本用於組合不同的功能然後提供給租戶。當點擊操作/修改時，可以看到該版本的功能

當前項目僅包含Chat功能，他們可以針對版本/租戶進行啓用或禁用。所有的功能都在 AppFeatureProvider 類裏面定義。功能的值被存放在 AbpFeatures 表裏。功能不僅可以是布爾值（禁用/啓用），它還包含了很多不同的類型，如下圖：

查看功能管理和版本管理文檔瞭解更多內容。

租戶管理

如果你不是開發的多租戶應用，那麼你可以跳過這部分。

如果是多租戶應用，管理員登錄後可以看到租戶管理頁面：

租戶由 Tenant 表示。租戶類可以通過添加新的屬性進行擴展。最初，只有一個 Default 的租戶。每一個租戶的租戶編碼是唯一的。租戶可以是激活或非激活的，如果沒有激活，那麼該租戶的所有用戶將不能登錄該應用。

當點擊添加租戶按鈕，將顯示下面的彈出框：

租戶名稱必須是唯一的，且不能包含空格或其他特殊字符，因爲它可能被使用爲子域名稱（如，tenancyname.mydomian.com）。名字可以是任意字符。管理員郵箱作爲該租戶管理員的郵箱地址。Admin用戶將被自動的添加到新的租戶下面。你可以爲admin設置隨機密碼併發一封激活郵件。當admin用戶第一次登錄時，會修改密碼。你也可以不選擇使用隨機密碼，而指定一個密碼。

當創建租戶時，你需要選擇或創建一個數據庫來存放新租戶的數據。你可以選擇Use host database，將租戶的數據庫存放至host的數據庫中（單數據庫模式）或者爲新租戶指定一個連接字符串去創建/使用單獨的數據庫。ASP.NET Zero支持混合模式，意思是可以讓一些租戶使用host數據庫，而讓另一些租戶使用單獨的數據庫。甚至可以在分離的數據庫中組合一些租戶。

所有租戶的行爲都是由 TenantAppService 類來處理。例如（刪除租戶）：

[AbpAuthorize(AppPermissions.Pages_Tenants_Delete)]
public async Task DeleteTenant(EntityRequestInput input)
{
    var tenant = await TenantManager.GetByIdAsync(input.Id);
    CheckErrors(await TenantManager.DeleteAsync(tenant));
}

TenantAppService 大多使用 TenantManager 領域服務來提供租戶的操作。

租戶版本和功能

當租戶被創建或被編輯時可以指定一個版本給該租戶，租戶將繼承指定版本的所有功能。你可以爲租戶重設一些屬性和值。點擊操作/修改參數列表來爲租戶自定義功能。

租戶模擬

作爲管理員，你可能想代表某個租戶進行一些操作。在這種情況下，你可以點擊一個租戶的操作按鈕並選擇“Login as this tenant”選項

當你點擊後，會彈出一個選擇用戶的彈出框。你可以選擇任何用於並執行該用於所允許的操作。在本章中查看用戶模擬瞭解更多。

使用租戶名字作爲子域名

多租戶應用通常用子域名來確定當前租戶，tenant1.mydomain.com, tenant2.mydomain.com 等。ASP.NET Zero自動識別並從子域名中得當租戶的名字。

組織單位

組織單位（Organization units, OU）用於分組用戶和實體。然後你可以根據OUs找到用戶或實體。當點擊管理/Organization units將會跳轉到下面的頁面

在這裏，你可以管理你的OUs（創建，編輯，刪除，移動）和成員（添加，刪除）

在代碼裏 OrganizationUnitManager 用於管理OUs，UserManager 用來管理OU的成員。OrganizationUnitAppService 執行應用的邏輯。

在左邊的OU樹裏，可以右鍵點擊一個OU（或者左鍵點擊右側的箭頭）打開OU操作的上下文菜單。當你嘗試添加一個成員，會出現一個彈出框讓你選擇用戶。

這其實是一個通用的查詢模塊用來查詢任何類型的實體（見 App/common/views/common/lookup.js 和 corresponding view）。爲了選擇用戶，你在CommonLookupAppService 裏創建了一個 FindUser的方法，然後配置模態窗口和該方法一起工作（見 organizationUnits/index.js 文件裏使用lookupModal.open）

查看組織單元管理文檔瞭解更多內容。

角色管理

當點擊管理/角色菜單時，將會跳轉到角色管理頁面：

角色用於組權限。當用戶擁有一個角色，他/她將擁有該角色的所有權限。

角色由Role類來表示，角色類可以通過添加新的屬性來進行擴展。

RoleManager 執行領域層邏輯；RoleAppService 執行角色的應用層邏輯。

角色可以是動態的或靜態的：
- 靜態角色：靜態角色有一個明確的名稱（如 Admin）並且你不能修改（可以修改顯示名字）。它在系統啓動時就被創建且不能被刪除，從而使我們能在代碼裏依賴不變的靜態角色名。
- 動態角色：當應用程序部署後你可以創建動態角色。然後，你可以授權該角色的權限，將該角色分配給用戶，並且可以刪除它。顯然，在開發的時候不能依賴動態角色的名稱。

一個或多個角色可以被設置爲默認。默認角色將被默認的賦予新添加或註冊的用戶。這不是開發階段需要設計的，可以在部署後進行設置或修改。

在啓動項目中，管理員用戶有一個靜態的 Admin 角色（多租戶應用）。此外，每個租戶也有一個靜態admin 和 user 角色。Admin 角色默認擁有所有的權限。User 角色默認沒有任何權限，且會被賦予每一個新用戶。這些都很容易就行修改，所有靜態角色查看 StaticRoleNames 類，改變靜態角色查看AppRoleConfig 。

角色權限

由於角色用於分組權限，您可以在創建或編輯時設置角色的權限，如下所示：

（上圖並沒有完全展示所有權限）

每一個租戶擁有其自己的權限，並且改變後不會影響其他的租戶。當然，管理員也擁有獨立的權限。

用戶管理

當點擊管理/用戶菜單時，將會跳轉到用戶管理頁面：

用戶可以登錄到應用程序，並根據其權限進行一些操作。

用戶由 User 類進行表示，用戶類可以通過添加新的屬性來進行擴展。

UserManager 執行領域層邏輯; UserAppService 執行用戶的應用層邏輯。

一個用戶可以擁有0個或多個角色。如果一個用戶擁有一個以上角色，他/她繼承所分配角色的所有權限。此外，你也可以爲用戶設置特定的權限。特定的用戶權限將覆蓋此角色的權限設置。用戶權限對話框的截圖（沒顯示完）

創建或編輯用戶的對話框：

你可以修改用戶的密碼，讓用戶激活或非激活等等。用戶自己可以上傳個人的頭像。Admin 用戶不能被刪除。如果你不想使用Admin用戶，你可以讓其非激活。

用戶模擬

作爲管理員（或其他允許的用戶），在不知道對方密碼的情況下，你可能想代表某個用戶登錄並進行一些操作。你可以點擊一個用戶的操作按鈕並選擇“Login as this user”選項

當你點擊後，你將自動重定向並作爲此用戶登錄，這就叫“用戶模擬”。當你模擬一個用戶時，“Back to my account”將被添加到用戶配置菜單裏。

當你模擬一個賬號時，你只能執行該賬號所允許的操作。這意味着，如果你就和本人登錄完全一樣。唯一不同的是，審計日誌將表明操作由其他人執行。注意，有一個紅色的返回按鈕表示你正模擬另一個用戶。

模擬是在 AccountController 中完成的。

語言管理

語言管理頁面用於管理（添加/編輯/刪除）應用程序的多語言和修改本地化文本。

你可以創建新的語言，編輯/刪除已經存在的語言並且設置默認語言。當你點擊“改變文本信息”時，你會跳轉到新的視圖去編輯你的本地化文本：

你可以選擇任何語言作爲基準（參考），並改變目標語言的文本。因爲可能有不同的本地化來源，你選擇源來進行翻譯。當點擊修改圖標時，將會彈出以下模式框：

管理員可以編輯語言和本地化文本，並在多租戶應用中默認將這些這些語言提供給所有租戶使用。租戶繼承語言和本地化文本，並可以覆蓋本地化文本或者添加新的語言。

兩個頁面都用 LanguageAppService 類作爲應用層服務。它提供了方法來管理語言和本地化文本。IApplicationLanguageManager 和 IApplicationLanguageTextManager 接口用來實現領域層邏輯。

查看語言管理文檔瞭解跟多信息

審計日誌

審計日誌頁面顯示所有用戶的操作。

所有的應用服務方法和MVC 控制器的操作自動被記錄，並且可以在這裏進行查看。查看審計日誌文檔瞭解如何配置。當你點擊放大鏡圖標，你可以查看每條日誌的消息信息。

審計日誌報告由 AuditLogAppService 類提供。

管理員設置

管理員設置頁面用來配置一些系統設置：

Timezone 在這個頁面裏是一個重要設置。ASP.NET Zero 可以在多個時區運行。修改很簡單，默認啓動的解決方案沒有啓用UTC時區。查看時區文檔瞭解如何修改。

當你切換至UTC日期時間，所有日期時間將默認按照UTC來存儲，但每個用戶可以在自己的時區裏查看日期和時間。在這個頁面裏時區設置允許你的應用程序，包括所有的租戶和用戶設置默認時區。租戶和用戶可以在自己的設置裏面修改時區。

在管理員設置頁面裏，也包含其他的設置項。點擊保存全部按鈕來保存所有更改。HostSettingAppService 用來檢索和保存設置。

Security 標籤頁包含密碼複雜度的設置。在這個標籤頁裏管理員可以定義系統範圍內密碼的複雜度。每個租戶可以在租戶設置裏更改該設置。PasswordComplexityChecker 類負責檢查密碼是否滿足密碼複雜度的設置。

租戶設置

在多租戶應用裏，租戶設置如下圖所示：

如果禁用多租戶，一些管理員設置也會顯示到該頁面上（由於沒有管理員設置頁面）。租戶也可以爲他的用戶定義密碼複雜度或者直接使用管理員所定義的密碼複雜度。

TenantSettingAppService 用於獲取/設置租戶的設置。

啓用LDAP（活動目錄，AD）認證

LDAP（活動目錄，AD）認證默認被禁用。爲了使它工作，需要禁用多租戶模式，因爲AD認證不能在多租戶模式下正常使用。在.Core項目下的CoreModule類裏面，你可以通過下面的代碼啓用它。

Configuration.Modules.ZeroLdap().Enable(typeof(AppLdapAuthenticationSource));

然後你可以在該頁面中看到LDAP設置

你可以點擊“Enable LDAP Authentication”啓用它。如果服務器在域模式下，而應用程序使用域用戶或本地系統運行，則通常不需要設置域名，用戶名及密碼。你可以註銷，然後登錄你的用戶名和密碼。如果沒有，你可以設置此信息。

維護

維護頁面只對管理員可用：

在 Cache 標籤頁裏，你可以清空一些或所有緩存。如果手動更改數據庫並希望刷新應用程序緩存，則可能需要清除緩存。在服務端CachingAppService 用來清除緩存。

Website Log 標籤頁用來查看或下載日誌：

WebLogAppService 用來從服務端獲取日誌。

租戶儀表板

ASP.NET Zero 啓動項目中包含了一個儀表板的示例。它只是用於演示，你可以以它作爲其他實現你的儀表板：

這裏，MEMBER ACTIVITY 的數據是從服務器上獲取的（通過 TenantDashboardAppService），你可以點擊REFRESH按鈕重新生成隨機圖表。

通知

通知圖標位於語言選擇按鈕旁邊。在紅色的圈數顯示未讀通知數。

點擊這個圖標用戶可以看到三個最近的通知。

用戶可以通過點擊“設置爲所有讀”來標記所有的通知，或者通過單擊每個通知旁邊的“設置爲已讀”來標記一個通知。

通知設置

點擊設置將打開以下對話框

在這個對話框中有一個全局設置，用戶啓用/禁用接收通知。如果啓用此設置，則用戶可以單獨啓用/禁用每個通知。

你也可以在 AppNotificationProvider 類裏面自定義通知。例如，新用戶註冊通知

context.Manager.Add(
     new NotificationDefinition(
        AppNotificationNames.NewUserRegistered,
        displayName: L("NewUserRegisteredNotificationDefinition"),
        permissionDependency: new SimplePermissionDependency(AppPermissions.Pages_Administration_Users)
    )
);

參見通知定義瞭解更多。

通知列表

所有用戶消息都在下面的列表中

對話

聊天圖標位於頁面右上角的用戶頭像的旁邊。在紅色的圈數顯示未讀消息總計數。

當用戶單擊此圖標時，頁面右側會出現一個聊天面板。此面板包含用戶的朋友列表和阻止用戶的列表。

用戶可以通過在好友列表上方輸入用戶名來添加新的好友。如果“Chat with other tenant”功能爲啓用了，通過輸入[租戶名\用戶名]（如：Default\admin）,那麼租戶之間的用戶也可以互相添加成爲好友。如果“Chat with host user” 功能啓用了，通過輸入.\用戶名，管理員也可以被添加成爲好友。

在線的好友/用戶在他們的頭像左下角有一個綠色的圓圈；離線的則是灰色的圓圈。

用戶通過點擊聊天面板上右上角的大頭針圖標，進行固定或解除固定聊天。應用程序將記住聊天面板的最後狀態，並在用戶登錄到應用程序時還原它。

當好友/用戶被選中時，對話框將會被打開。

用戶可以在這裏阻止或解除阻止好友或其他用戶。在選定的用戶名右側有一個扳手圖標。點擊這個圖標打開一個菜單，根據目標用戶的是否被阻止情況會顯示“阻止用戶”或“解除阻止用戶”的選項。

聊天消息通過使用了ChatMessageManager 領域類的ChatHub SignalR hub 類進行分發。

ChatUserStateWatcher 類負責監聽聊天用戶的在線/離線狀態變化。當用戶從在線變爲離線，或相反。這個類就會通知這個用戶的好友。

FriendshipAppService 和 FriendshipManager 類負責管理加好友的請求。如果聊天信息來自於被阻止的用戶，那麼該消息不會被傳遞給目標用戶。

因爲聊天是一種實時操作，應用將爲每個用戶緩存在線好友和未讀信息的數量。UserFriendsCache 類用來管理這些緩存操作。

UserFriendCacheSyncronizer 類負責保持到目前爲止的好友緩存。爲了做到這一點，它將監聽 FriendShip 和 ChatMessage 實體的一些事件。

聊天功能

在這個系統裏有三個聊天功能。”Chat”，”Chat with host”，”Chat with other tenants”。這些功能可以爲每個版本或租戶，啓用或禁用。通過使用這些功能，管理員可以啓用或禁用跟其他租戶的用戶或管理用戶聊天。

用戶菜單

用戶可以通過點擊右上角的頭像打開用戶菜單。

關聯賬號

關聯賬號用於關聯彼此的多個賬號。用戶可以通過使用此功能輕鬆的瀏覽他/她的賬號。

用戶可以點擊 Manage accounts 來添加新的賬號或刪除賬號。

爲了添加一個新的賬號，用戶必須輸入相關帳戶的登錄憑據。

UserLinkAppService 類用來管理用戶關聯的應用層邏輯。UserLinkManager 類用來管理用戶關聯的領域層邏輯。

用戶設置

我的設置用來修改用戶自己的基本信息設置。

如圖所示，admin用戶的名字是不能被修改的。它被認爲是一個特殊的用戶名，因爲它被適用於數據庫遷移的種子。其他用戶可以修改他們的用戶名。ProfileAppService 用來獲取/更改設置

登錄嘗試

所有登錄嘗試（成功或失敗）都記錄到應用程序中。用戶可以看到他/她的帳戶最後的登錄嘗試的記錄。UserLoginAppService 用來獲取服務端的登錄嘗試記錄。

修改頭像

用戶可以修改自己的頭像。ProfileController 用於上傳或獲取他們的頭像。Angular file upload 模塊用於選擇和上傳頭像至服務器。目前，支持JPG，JPEG，GIF和PNG文件，也可以擴展允許上傳的文件擴展名。

更改密碼

ProfileAppService 用於更改密碼。

註銷

AccountController 用於提供用戶註銷操作並跳轉至登錄頁。

ASP.NET ZERO 學習 —— (5) 開發手冊之ANGULAR後臺單頁面應用