nginx + express：优雅实现前端项目本地 mock

引言
在前端开发过程中，我们经常需要与后端接口进行交互以获取数据。但是，当后端接口服务出错或尚未开发完成时，前端开发者立即就会面临无米下炊的窘境。

解决方案
借助 nginx，我们可以实现一种完全无侵入性的 mock 套壳开发。这种方法的主要思想是使用 nginx 将请求重定向到一个本地运行的 express 服务器上，该服务器将提供模拟的 API 响应。

步骤

1. 安装 nginx 和 express

npm install -g nginx express

2. 创建一个新的 express 项目

mkdir my-mock-server
cd my-mock-server
npm init -y

3. 在项目中安装 express

npm install express

4. 在项目中创建服务器文件

touch server.js

5. 在 server.js 文件中添加以下代码：

const express = require('express');
const app = express();

app.get('/api/v1/users', (req, res) => {
  res.json([
    {
      id: 1,
      name: 'John Doe'
    },
    {
      id: 2,
      name: 'Jane Doe'
    }
  ]);
});

app.listen(3000, () => {
  console.log('Mock server is listening on port 3000');
});

6. 启动 express 服务器

npm start

7. 在 nginx 配置文件中添加以下代码：

server {
  listen 80;
  server_name localhost;

  location /api/ {
    proxy_pass http://localhost:3000;
  }
}

8. 保存 nginx 配置文件并重新加载 nginx 服务

sudo nginx -s reload

测试
现在，您可以使用浏览器或其他工具访问 http://localhost/api/v1/users 来测试模拟的 API 响应。您应该会看到以下输出：

[
  {
    id: 1,
    name: 'John Doe'
  },
  {
    id: 2,
    name: 'Jane Doe'
  }
]

总结
使用 nginx 和 express 实现前端项目本地 mock是一种简单而有效的方法。这种方法无需对前端代码进行任何修改，也不需要额外的工具或库。无论何时后端接口服务出错或尚未开发完成，前端开发者都能立即启动并运行项目。