Ecosyste.ms: Awesome
An open API service indexing awesome lists of open source software.
https://github.com/avin/fake-api-middleware
Express/Connect middleware for returning dummy reponses
https://github.com/avin/fake-api-middleware
connect dummies express fake middleware mock-server
Last synced: about 2 hours ago
JSON representation
Express/Connect middleware for returning dummy reponses
- Host: GitHub
- URL: https://github.com/avin/fake-api-middleware
- Owner: avin
- Created: 2023-01-06T16:51:30.000Z (almost 2 years ago)
- Default Branch: master
- Last Pushed: 2023-12-04T09:40:58.000Z (12 months ago)
- Last Synced: 2024-04-26T17:23:13.371Z (7 months ago)
- Topics: connect, dummies, express, fake, middleware, mock-server
- Language: TypeScript
- Homepage:
- Size: 212 KB
- Stars: 10
- Watchers: 2
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
# Fake-Api-Middleware
This is an [Express](https://github.com/expressjs/express)+[Connect](https://github.com/senchalabs/connect) middleware for mocking API responses. It can be used with [Vite](https://github.com/vitejs/vite), [Webpack DevServer](https://github.com/webpack/webpack-dev-server), [CreateReactApp](https://github.com/facebook/create-react-app), and many other frameworks that are based on the NodeJS Connect/Express server.
- 🔩 Compatible with [Express](https://github.com/expressjs/express)+[Connect](https://github.com/senchalabs/connect)
- 🛠️ Write dummy responses with JavaScript/TypeScript
- 🔥 Hot reloading of dummy responses
## Install
```sh
npm install fake-api-middleware
```
## Usage
Create a file for storing response dummies. The file can be either in _JavaScript_ or _TypeScript_.
`./apiDummies/index.ts`:
```ts
import { delay } from 'fake-api-middleware';
import type { ResponseFunctionParams } from 'fake-api-middleware';
export default {
// The response can be in the form of a normal JavaScript object, which will be returned as JSON with a status code of 200
'POST /test': {
foo: 'bar'
},
// The response can be an object, array, string, number or null
'GET /api/users': [
{id: 1, name: 'Bob'},
{id: 2, name: 'Jack'},
{id: 3, name: 'Mike'},
],
// The response can also be a function that returns a JavaScript object, which will be returned as a JSON response with a status code of 200
'POST /api/createUser': ({ body, query, headers, params, req, res }: ResponseFunctionParams) => {
return {
message: `User ${body.name} created`
};
},
// It is possible to change the response status code using the `res` object
'GET /api/unknown': ({ body, query, headers, params, req, res }: ResponseFunctionParams) => {
res.statusCode = 404;
return {
message: `Route does not exist`
};
},
// The API path can contain special regular expression syntax.
// For more information, please see https://www.npmjs.com/package/path-to-regexp
'GET /api/users/:id': ({ body, query, headers, params, req, res }: ResponseFunctionParams) => {
return {
message: `User with id ${params.id} is here`
};
},
// It is possible to use asynchronous response functions
'GET /api/async': async ({ body, query, headers, params, req, res }: ResponseFunctionParams) => {
await delay(1000);
return {
message: `Hello!`
};
},
// Alternatively, the response can be a function that manually prepares an HTTP response.
// For more information, please see https://nodejs.org/api/http.html#class-httpserverresponse
'POST /api/processData': ({ body, query, headers, params, req, res }: ResponseFunctionParams) => {
res.statusCode = 200;
res.setHeader('Content-Type', 'application/json');
return res.end(
JSON.stringify({
additional: {
body,
query,
headers,
params
},
message: 'It is response made with ServerResponse',
}),
);
},
};
```
Set up the middleware for the HTTP server with the path to the file containing the response dummies. The following example demonstrates using the Connect server, but please check the setup examples below for more options.
`./server.js`:
```js
var connect = require('connect');
var http = require('http');
const { middleware: fakeApiMiddleware } = require('fake-api-middleware');
var app = connect();
app.use(
fakeApiMiddleware({
responsesFile: './apiDummies/index.ts',
watchFiles: ['./apiDummies/**/*'],
responseDelay: 250,
enable: true,
}),
);
http.createServer(app).listen(3000);
```
## API
Options for the middleware:
* `responsesFile`: `string` - Path to the API dummies file.
* `responses`: `Record` - Pre-defined dummies object (default: `{}`).
* `watchFiles`: `string|string[]` - Folders/files to watch for updates to reload dummies file (by default, it only watches the single `responsesFile`).
* `responseDelay`: `number` - Delay in milliseconds for each dummy response (default: `0`).
* `enable`: `boolean` - Enable/disable middleware (default: `true`).
Options for the dummy response function:
* `body`: `Record` - Object with parsed body from request.
* `query`: `Record` - Object with parsed query parameters of the requested URL.
* `headers`: `Record` - Object with request headers.
* `params`: `Record` - Object with URL regular expression values.
* `req`: `IncomingMessage` - Raw Node.js HTTP [IncomingMessage](https://nodejs.org/api/http.html#class-httpincomingmessage) object.
* `res`: `ServerResponse` - Raw Node.js HTTP [ServerResponse](https://nodejs.org/api/http.html#class-httpserverresponse) object.
## Examples of how to set up the middleware
### Express
```js
const express = require('express');
const { middleware: fakeApiMiddleware } = require('fake-api-middleware');
const app = express();
app.use(
fakeApiMiddleware({
responsesFile: './apiDummies/index.js',
}),
);
app.listen(8080);
```
### Vite
Use the built-in plugin for vite in the `vite.config.js` file:
```ts
import { defineConfig } from 'vite';
import { vitePlugin as fakeApiVitePlugin } from 'fake-api-middleware';
export default defineConfig({
plugins: [
fakeApiVitePlugin({
responsesFile: './apiDummies/index.ts',
}),
],
});
```
### Create React App
Create `setupProxy.js` file in the `src` folder with the following content (note that the `apiDummies` folder should be in the root of the project):
```js
const { middleware: fakeApiMiddleware } = require('fake-api-middleware');
module.exports = function (app) {
app.use(
fakeApiMiddleware({
responsesFile: './apiDummies/index.js',
}),
);
};
```
### Webpack
To set up the middleware in a webpack configuration, create or modify the `devServer` section and add a `before` rule:
```js
const { middleware: fakeApiMiddleware } = require('fake-api-middleware');
module.exports = {
// ...
devServer: {
// ...
before(app) {
app.use(
fakeApiMiddleware({
responsesFile: './apiDummies/index.js',
}),
);
},
},
// ...
};
```