mock api

通过三个快速步骤，使用Node.js创建一个逼真的模拟API (Create a realistic mock API with Node.js in three quick steps)

In this era of service-oriented development, you need to get JSON to and from the server to make your front-end come alive. So an API is a necessity.

在这个面向服务的开发时代，您需要将JSON与服务器之间来回传递，以使前端活跃起来。 因此，API是必需的。

But, great news: You don’t need to create real web services to get started. Instead, just set up a mock API.

但是，好消息是：您无需创建真正的Web服务即可上手。 相反，只需设置一个模拟API。

Note: I’m saying API for brevity. Related terms include Web API, Web service, JSON API, and RESTful API.

注意：我说的是API的简洁性。 相关术语包括Web API，Web服务，JSON API和RESTful API。

为什么要使用模拟API？ (Why a Mock API?)

Here are four reasons to use a mock API:

这是使用模拟API的四个原因：

1. No API yet — Maybe you haven’t created an API yet. A mock API allows you to begin development without waiting for the API team to build the services you need. And if you haven’t decided how to design your web services, mocking allows you to rapidly prototype different potential response shapes to see how they work with your app.

   尚无API-也许您尚未创建API。 模拟API使您无需等待API团队构建所需的服务即可开始开发。 而且，如果您还没有决定如何设计Web服务，则可以通过模拟来快速制作出不同的潜在响应形状的原型，以了解它们如何与您的应用程序一起使用。

2. Slow or unreliable API — Are the existing APIs in your dev or QA environment slow, unreliable, or expensive to call? If so, a mock API offers consistent, instantaneous responses for rapid feedback development. And if your existing web services go down, a mock API allows you to keep working.

   慢速或不可靠的API-开发或QA环境中现有的API调用速度慢，不可靠或昂贵吗？ 如果是这样，则模拟API将提供一致的即时响应，以快速开发反馈。 并且，如果您现有的Web服务出现故障，则可以使用模拟API继续工作。

3. Eliminate inter-team dependencies — Is a separate team creating your app’s web services? A mock API means you can start coding immediately and switch to the real web services when they’re ready. Just agree on the API’s proposed design and mock it accordingly.

   消除团队之间的依存关系 -是否有一个单独的团队来创建您应用程序的Web服务？ 模拟API意味着您可以立即开始编码，并在准备就绪时切换到实际的Web服务。 只需就API的建议设计达成一致，然后进行相应的模拟即可。

4. Work offline — Finally, maybe you need to work on a plane, on the road, or in other places where connectivity is poor. Mocking allows you to work offline because your calls remain local.

   脱机工作 -最后，也许您需要在飞机上，路上或在连通性较差的其他地方工作。 模拟功能使您可以脱机工作，因为您的通话保持在本地。

让我们创建一个模拟API (Let’s Create a Mock API)

The simplest way I’ve found to get this done uses Node.js. Here is my three step process to create a realistic mock API:

我发现完成此工作的最简单方法是使用Node.js。 这是创建真实的模拟API的三步过程：

1. Declare the schema声明架构
2. Generate random data产生随机数据
3. Serve random data提供随机数据

Let’s walk through the three steps.

让我们逐步完成这三个步骤。

第1步-声明架构 (Step 1 — Declare the Schema)

First, let’s declare the schema for our mock API using JSON Schema Faker. This will allow us to declare what our fake API should look like. We’ll declare the objects and properties it will expose including the datatypes. There’s a handy online REPL that makes it easy to learn.

首先，让我们使用JSON Schema Faker声明模拟API的模式 。 这将使我们能够声明假API的外观。 我们将声明将公开的对象和属性，包括数据类型。 有一个方便的在线REPL ，使它易于学习。

JSON Schema faker supports generating realistic random data via three open source libraries. Faker.js, chance.js, and randexp.js. Faker and chance are very similar. Both offer a wide variety of functions for generating random data including realistic names, address, phone numbers, emails, and much more. Randexp creates random data based on regular expressions. JSON Schema faker allows us to use faker, chance, and randexp within our schema definitions. This way, you can declare exactly how each property in your mock API should be generated.

JSON Schema伪造者支持通过三个开源库生成现实的随机数据。 Faker.js ， 偶然机会js和randexp.js 。 法克和机会非常相似。 两者都提供了用于生成随机数据的各种功能，包括真实姓名，地址，电话号码，电子邮件等。 Randexp根据正则表达式创建随机数据。 JSON模式伪造者允许我们在模式定义中使用伪造者，机会和randexp。 这样，您可以准确声明应如何生成模拟API中的每个属性。

Here’s an example schema for generating realistic, randomized user data. I save this file as mockDataSchema.js:

这是用于生成现实的随机用户数据的示例架构。 我将此文件另存为mockDataSchema.js：

This schema uses faker.js to generate an array of users with realistic names and emails.

该模式使用faker.js生成具有真实名称和电子邮件的用户数组。

第2步-生成随机数据 (Step 2 — Generate Random Data)

Once we’ve defined our schema, it’s time to generate random data. To automate build tasks, I prefer to use npm scripts instead of Gulp and Grunt. Here’s why.

定义架构后，就该生成随机数据了。 为了自动执行构建任务，我更喜欢使用npm脚本而不是Gulp和Grunt。 这就是为什么 。

I create an npm script in package.json that calls a separate Node script:

我在package.json中创建一个npm脚本，该脚本调用一个单独的Node脚本：

"generate-mock-data": "node buildScripts/generateMockData"

The script above is calling a Node script called generateMockData. Here’s what’s inside generateMockData.js:

上面的脚本正在调用一个称为generateMockData的Node脚本。 这是generateMockData.js内部的内容：

I’m calling json-schema-faker on line 11, and passing it the mock data schema we set up in step 1. This ultimately writes JSON to db.json, as specified on line 13 above.

我在第11行调用json-schema-faker ，并将在步骤1中设置的模拟数据模式传递给它。这最终将JSON写入db.json，如上面第13行所指定。

第3步-提供随机数据 (Step 3 — Serve Random Data)

Now that we have written randomized, realistic data to db.json, let’s serve it up! JSON server creates a realistic API using the static JSON file we created. So let’s point JSON server at the mock dataset that we dynamically generated in step 2.

现在我们已经将随机的，现实的数据写入db.json，让我们为它服务！ JSON服务器使用我们创建的静态JSON文件创建了一个现实的API。 因此，让我们将JSON服务器指向我们在步骤2中动态生成的模拟数据集。

"start-mockapi": "json-server --watch src/api/db.json --port 3001"

This starts json-server and serves up the data in db.json on port 3001. Each top-level object is exposed on an HTTP endpoint.

这将启动json-server并在端口3001上的db.json中提供数据。每个顶级对象都在HTTP端点上公开。

Here’s the awesome part: JSON Server simulates a real database by saving the changes to the db.json file we created in step 2.

这是很棒的部分：JSON Server通过将更改保存到我们在步骤2中创建的db.json文件中来模拟真实的数据库。

The beauty of JSON server: it handles create, reads, updates, and deletes, so it feels totally real.

JSON服务器的优点：它处理创建，读取，更新和删除，因此感觉很真实。

The mock API operates just like a real API, but without having to make an actual HTTP call or stand up a real database! Slick.

模拟API的运行方式类似于真实的API，但无需进行实际的HTTP调用或建立真实的数据库！ 光滑

This means we can do development without creating a real API first. We just need to agree on the calls and data shape, then the UI team can move ahead without having to wait on the service team to create the associated services.

这意味着我们无需先创建真正的API就可以进行开发。 我们只需要在调用和数据形状上达成共识，然后UI团队就可以继续前进，而不必等待服务团队创建关联的服务。

In summary, to make all this come together, you need 3 lines in package.json:

总而言之，要使所有这些组合在一起，在package.json中需要3行：

"generate-mock-data": "node buildScripts/generateMockData",
"prestart-mockapi": "npm run generate-mock-data",
"start-mockapi": "json-server --watch src/api/db.json --port 3001"

The start-mockapi script runs json-server and tells it to watch the db.json we generated in step 2. Before the mock API is started, mock data is generated. The prestart-mockapi script is called before start-mockapi because it’s prefixed by “pre”. This is npm script convention. With this setup, every time we start the app, new realistic mock data is generated!

start-mockapi脚本运行json-server，并告诉它监视我们在步骤2中生成的db.json。在启动模拟API之前，将生成模拟数据。 prestart-mockapi脚本在start-mockapi之前被调用，因为它的前缀是“ pre”。 这是npm脚本约定。 通过此设置，每次我们启动应用程序时，都会生成新的逼真的模拟数据！

Alright, we’re ready to roll.

好了，我们准备开始了。

Type this:

输入：

npm run start-mockapi

And load this:

并加载此：

http://localhost:3001/users.

http：// localhost：3001 / users 。

You should see a list of users returned as JSON. Success!

您应该看到以JSON返回的用户列表。 成功！

To see how this all comes together, here’s a working demo of this setup on GitHub.

要了解所有这些如何结合在一起，请在GitHub上进行此设置的工作演示 。

Also, my new “Building a JavaScript Development Environment” course builds this and much more from scratch. (free trial)

另外，我新开设的“ 构建JavaScript开发环境 ”课程从零开始构建了这一点，甚至更多。 ( 免费试用 )

Finally, consider mocky.io or fakejson.com for simple alternatives that require no setup.

最后，考虑对无需设置的简单替代方法进行模拟或模仿 。

冰山一角… (The Tip of An Iceberg…)

This article discusses just one of over 40 decisions you need to make to create a new JavaScript development environment from scratch:

本文仅讨论从头开始创建新JavaScript开发环境所需做出的40多个决策之一：

I walk through all of these decisions and build a rich JavaScript development environment from scratch here.

我将仔细研究所有这些决定，并在此处从头开始构建一个丰富JavaScript开发环境。

Are you generating mock APIs today? Have an alternative set up to share? I’d love to hear about your experiences in the comments.

您今天要生成模拟API吗？ 是否有其他共享设置？ 我希望在评论中听到您的经历。

Cory House is the author of many courses on Pluralsight, and principal consultant at reactjsconsulting.com. He is a Software Architect at VinSolutions, Microsoft MVP, and trains software developers internationally on software practices like front-end development and clean coding.

科里府是作者对Pluralsight很多课程 ，并在首席顾问reactjsconsulting.com 。 他是VinSolutions的Microsoft MVP的软件架构师，并在软件开发方面对国际软件开发人员进行了培训，例如前端开发和简洁编码。

翻译自: https://www.freecodecamp.org/news/rapid-development-via-mock-apis-e559087be066/

mock api