Angular SPA Web API 项目搭建与使用指南
项目简介
Angular SPA Web API 是一个采用 Angular v7 搭配 ASP.NET Core WebAPI 构建的单页面应用程序(Single Page Application)示例。本项目实现了令牌认证机制,并整合了 IdentityServer4 与 ASP.NET Core Identity 用于安全管理,数据存储则依赖 SQLite。
目录结构及介绍
以下是项目的主要目录结构及其简要说明:
├── ClientApp # Angular 应用程序所在目录
│ ├── src # 主要的 Angular 源代码文件
│ │ ├── app # Angular 应用的核心模块,包含组件和服务
│ │ ├── assets # 静态资源如图片、字体文件等
│ │ ├── environments # 不同环境(如 dev、prod)的配置文件
│ │ └── ...
│ ├── angular.json # Angular CLI 配置文件
│ ├── package.json # Node.js 依赖列表
│ └── ...
├── Server # ASP.NET Core Web API 项目
│ ├── Controllers # Web API 控制器,处理HTTP请求
│ ├── Models # 数据模型类定义
│ ├── appsettings.*.json # 应用配置文件,区分开发和生产环境
│ ├── Program.cs # 应用程序入口点
│ ├── Startup.cs # 应用初始化配置,如服务注册、中间件配置
│ └── ...
├── README.md # 项目说明文档
└── ...
项目的启动文件介绍
客户端(ClientApp)
- main.ts: Angular 应用的入口点,负责启动应用。
- index.html: 浏览器加载的第一个HTML文件,设置Angular应用的基础。
服务器端(Server)
- Program.cs: ASP.NET Core 应用程序的启动脚本,配置宿主并运行Web服务器。
- Startup.cs: 应用配置中心,包括服务注册、管道配置(MVC、路由、中间件等)和JWT认证配置。
项目的配置文件介绍
客户端配置
- angular.json: 此文件包含了构建和开发流程的配置,比如开发服务器端口、输出目录、构建目标等。
- environments/*: 分为
environment.ts
(开发环境)和environment.prod.ts
(生产环境),用来设定根据不同环境的应用变量。
服务器端配置
- appsettings.json 和 appsettings.Development.json, appsettings.Production.json: 分别用于不同部署阶段的配置,如数据库连接字符串、API密钥等。
- launchSettings.json: VS中定义的项目启动配置,包括IIS Express或Kestrel的端口号和环境变量。
本指南概述了Angular SPA Web API项目的基本结构,启动文件和配置文件的作用。深入学习时,还需查阅项目内的具体文件注释和官方文档,以便全面理解项目细节与实际操作步骤。