Simular una API CRUD
Al compilar aplicaciones, a menudo interactúa con las API de back-end. A veces, estas API aún no están disponibles u otros equipos los están actualizando para cumplir los requisitos más recientes. Para evitar esperar, normalmente se crea una API ficticia que devuelve los datos que necesita. Aunque este enfoque le desbloquea, requiere que dedique tiempo a crear una API que finalmente reemplace por la real. Para evitar perder el tiempo, puede usar dev Proxy para simular una API CRUD y acelerar el desarrollo.
CrudApiPlugin
Con , puede simular una API CRUD (Crear, Leer, Actualizar, Eliminar) con un almacén de datos en memoria. Con un archivo de configuración simple, puede definir qué direcciones URL admite la API ficticia y qué datos devuelve. El complemento también admite CORS para el uso entre dominios desde aplicaciones del lado cliente.
MockResponsePlugin
Donde permite definir respuestas ficticias estáticas, CrudApiPlugin
permite definir una API ficticia dinámica que puede usar para interactuar con los datos y ver los cambios reflejados en el conjunto de datos ficticio.
Escenario
Supongamos que va a crear una aplicación que permita a los usuarios administrar clientes. Para obtener los datos, debe llamar al /customers
punto de conexión de la API de back-end. Para evitar esperar a que el equipo back-end finalice su trabajo, decide usar el proxy de desarrollo para simular la API y devolver los datos que necesita.
Empiece por habilitar CrudApiPlugin
y configurarlo para usar el customers-api.json
archivo.
{
"name": "CrudApiPlugin",
"enabled": true,
"pluginPath": "~appFolder/plugins/dev-proxy-plugins.dll",
"configSection": "customersApi"
}
{
"customersApi": {
"apiFile": "customers-api.json"
}
}
En el customers-api.json
archivo, se define la API de clientes ficticios.
{
"$schema": "https://raw.githubusercontent.com/microsoft/dev-proxy/main/schemas/v0.14.1/crudapiplugin.schema.json",
"baseUrl": "https://api.contoso.com/v1/customers",
"dataFile": "customers-data.json",
"actions": [
{
"action": "getAll"
},
{
"action": "getOne",
"url": "/{customer-id}",
"query": "$.[?(@.id == {customer-id})]"
},
{
"action": "create"
},
{
"action": "merge",
"url": "/{customer-id}",
"query": "$.[?(@.id == {customer-id})]"
},
{
"action": "delete",
"url": "/{customer-id}",
"query": "$.[?(@.id == {customer-id})]"
}
]
}
En la baseUrl
propiedad , se define la dirección URL base de la API ficticia. En la dataFile
propiedad , se define el archivo que contiene datos ficticios del cliente. En la actions
propiedad , se definen las acciones admitidas y cómo se asignan a los métodos y direcciones URL HTTP. Quiere usar la API para:
- obtener todos los clientes, llamando a
GET /v1/customers
- obtener un solo cliente mediante una llamada a
GET /v1/customers/{customer-id}
- agregue un nuevo cliente mediante una llamada a
POST /v1/customers
, - actualizar un cliente, llamando a
PATCH /v1/customers/{customer-id}
, - eliminar un cliente mediante una llamada a
DELETE /v1/customers/{customer-id}
En las direcciones URL, se usa el {customer-id}
parámetro , que el complemento reemplaza por el identificador de cliente real de la dirección URL. El complemento también usa el {customer-id}
parámetro en una consulta JSONPath para buscar al cliente en el archivo de datos.
En el customers-data.json
archivo, se definen los datos ficticios del cliente.
[
{
"id": 1,
"name": "Contoso",
"address": "4567 Main St Buffalo, NY 98052"
},
{
"id": 2,
"name": "Fabrikam",
"address": "4567 Main St Buffalo, NY 98052"
}
]
Inicie el proxy de desarrollo y llame al https://api.contoso.com/v1/customers
punto de conexión. Dev Proxy intercepta la solicitud y devuelve los datos ficticios del cliente.
[
{
"id": 1,
"name": "Contoso",
"address": "4567 Main St Buffalo, NY 98052"
},
{
"id": 2,
"name": "Fabrikam",
"address": "4567 Main St Buffalo, NY 98052"
}
]
Paso siguiente
Obtenga más información sobre CrudApiPlugin.
Ejemplos
Consulte también los ejemplos relacionados del proxy de desarrollo: