适用于:
MongoDB
本教程包含多个部分,演示了如何通过 Express 和 Angular 创建以 Node.js 编写的新应用,然后将其连接到
使用 Azure Cosmos DB 的 API for MongoDB 配置的 Azure Cosmos DB 帐户
。
本教程的第 2 部分基于
简介
,涵盖以下任务:
安装 Angular CLI 和 TypeScript
使用 Angular 创建新项目
使用 Express 框架生成应用
在 Postman 中测试应用
在开始教程的此部分之前,请确保已观看
简介视频
。
本教程还需要:
Node.js
8.4.0 或更高版本。
Postman
Visual Studio Code
或你喜欢用的代码编辑器。
本教程介绍生成应用程序的各个步骤。 若要下载完成的项目,可从 GitHub 上的
angular-cosmosdb 存储库
获取完成的应用程序。
安装 Angular CLI 和 TypeScript
打开 Windows 命令提示符或 Mac Terminal 窗口并安装 Angular CLI。
npm install -g @angular/cli
在提示符处输入以下命令,安装 TypeScript。
npm install -g typescript
使用 Angular CLI 创建新项目
在命令提示符处转到需在其中创建新项目的文件夹,然后运行以下命令。 此命令创建名为 angular-cosmosdb 的新文件夹和项目,并安装新应用所需的 Angular 组件。 它会使用最低设置 (--minimal),并指定该项目使用 Sass(一种带 --style scss 标志的类似 CSS 的语法)。
ng new angular-cosmosdb --minimal --style scss
完成该命令后,将目录转到 src/client 文件夹。
cd angular-cosmosdb
然后在 Visual Studio Code 中打开该文件夹。
code .
使用 Express 框架生成应用
在 Visual Studio Code 的“资源管理器”窗格中,右键单击 src 文件夹,单击“新建文件夹”,然后将新文件夹命名为“server”。
在“资源管理器”窗格中,右键单击“server”文件夹,单击“新建文件”,然后将新文件命名为“index.js”。
回到命令提示符处,使用以下命令安装正文分析器。 这有助于应用分析通过 API 传入的 JSON 数据。
npm i express body-parser --save
将以下代码复制到 Visual Studio Code 的 index.js 文件中。 此代码:
引用 Express
拉入 body-parser,用于读取请求正文中的 JSON 数据
使用称为 path 的内置功能
设置根变量,方便查找代码所处位置
启动 Express
告知应用如何使用可以为服务器提供服务的中间件
提供 dist 文件夹中将会成为静态内容的所有内容
为应用程序提供服务,为服务器上找不到的任何 GET 请求提供 index.html(用于深层链接)
通过 app.listen 启动服务器
使用 arrow 函数来记录端口处于活动状态这一情况
const express = require('express');
const bodyParser = require('body-parser');
const path = require('path');
const routes = require('./routes');
const root = './';
const port = process.env.PORT || '3000';
const app = express();
app.use(bodyParser.json());
app.use(bodyParser.urlencoded({ extended: false }));
app.use(express.static(path.join(root, 'dist/angular-cosmosdb')));
app.use('/api', routes);
app.get('*', (req, res) => {
res.sendFile('dist/angular-cosmosdb/index.html', {root});
app.listen(port, () => console.log(`API running on localhost:${port}`));
在 Visual Studio Code 的“资源管理器”窗格中,右键单击 server 文件夹,然后单击“新建文件”。 将新文件命名为 routes.js。
将以下代码复制到 routes.js 中。 此代码:
引用 Express 路由器
获取 hero
发送回适用于已定义 hero 的 JSON
const express = require('express');
const router = express.Router();
router.get('/heroes', (req, res) => {
res.send(200, [
{"id": 10, "name": "Starlord", "saying": "oh yeah"}
module.exports=router;
保存所有修改过的文件。
在 Visual Studio Code 中,单击“调试”按钮 ,单击“齿轮”按钮。 此时会在 Visual Studio Code 中打开新的 launch.json 文件。
在 launch.json 文件的第 11 行将 "${workspaceFolder}\\server"
更改为 "program": "${workspaceRoot}/src/server/index.js"
,然后保存文件。
单击“启动调试”按钮 运行该应用。
应用应该正常运行。
使用 Postman 来测试应用
现在请打开 Postman,将 http://localhost:3000/api/heroes
置于 GET 框中。
单击“发送”按钮,从应用获取 JSON 响应。
该响应显示应用在本地启动并运行。
尝试为迁移到 Azure Cosmos DB 进行容量规划? 可以使用有关现有数据库群集的信息进行容量规划。
如果只知道现有数据库群集中的 vCore 和服务器数量,请阅读使用 vCore 或 vCPU 估算请求单位
若知道当前数据库工作负载的典型请求速率,请阅读使用 Azure Cosmos DB 容量计划工具估算请求单位