Simule uma API CRUD assegurada com uma chave API

De relance
Objetivo: Simule API CRUD com autenticação de chave API
Tempo: 10 minutos
Plugins:CrudApiPlugin
Pré-requisitos:Configurar o Proxy de Desenvolvimento

Ao criar aplicativos, você geralmente interage com APIs de back-end. Às vezes, essas APIs ainda não estão disponíveis ou outras equipes estão atualizando-as para atender aos requisitos mais recentes. Para evitar esperar, você normalmente cria uma API simulada que retorna os dados necessários. Embora essa abordagem desbloqueie você, ela exige que você gaste tempo na criação de uma API que você eventualmente substitui pela real. Torna-se ainda mais complicado quando precisas de proteger a tua API com uma chave de API. Para evitar perder tempo, você pode usar o Dev Proxy para simular uma API CRUD e acelerar o desenvolvimento.

Usando o CrudApiPlugin, você pode simular uma API CRUD (Criar, Ler, Atualizar, Excluir) com um armazenamento de dados na memória. Usando um arquivo de configuração simples, você pode definir quais URLs sua API simulada suporta e quais dados ela retorna. O plugin também suporta CORS para uso entre diferentes domínios a partir de aplicações do lado do cliente. O plugin também suporta autenticação de chaves API, por isso pode proteger a sua API simulada com uma chave API e testar se a sua aplicação envia a chave corretamente.

Scenario

Digamos que você esteja criando um aplicativo que permite que os usuários gerenciem clientes. Para obter os dados, precisas de chamar o /customers endpoint da API de back-end. A API é protegida com uma chave API. Para evitar esperar que a equipe de back-end termine seu trabalho, você decide usar o Dev Proxy para simular a API e retornar os dados necessários.

Antes de começares

Você começa criando uma API CRUD simulada com dados do cliente. Depois de confirmares que a API funciona, podes protegê-la com uma chave API.

Exemplo 1: Simular uma API CRUD assegurada com uma chave API num cabeçalho

No primeiro exemplo, protege toda a API com uma chave de API que os clientes enviam num cabeçalho HTTP.

No customers-api.json ficheiro, adicione informações sobre autenticação de chaves API.

Ficheiro:customers-api.json

{
  "$schema": "https://raw.githubusercontent.com/dotnet/dev-proxy/main/schemas/v3.0.0/crudapiplugin.apifile.schema.json",
  "baseUrl": "https://api.contoso.com/v1/customers",
  "dataFile": "customers-data.json",
  "auth": "apiKey",
  "apiKeyAuthConfig": {
    "apiKey": "my-secret-key",
    "headerName": "X-API-Key"
  },
  "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})]"
    }
  ]
}

Ao definir a propriedade auth como apiKey, especifica que a API é protegida por uma chave de API. Na propriedade apiKeyAuthConfig, especifica os detalhes da configuração. A apiKey propriedade especifica a chave API válida, e a headerName propriedade especifica o cabeçalho HTTP onde o plugin procura a chave.

Se tentar chamar a API sem o X-API-Key cabeçalho definido para my-secret-key, recebe uma 401 Unauthorized resposta.

Exemplo 2: Simular uma API CRUD assegurada com uma chave API num parâmetro de consulta

Em algumas APIs, os clientes enviam a chave da API como um parâmetro de sequência de consulta. Pode simular este comportamento configurando a queryParameterName propriedade.

Atualize o customers-api.json arquivo da seguinte maneira:

Ficheiro:customers-api.json

{
  "$schema": "https://raw.githubusercontent.com/dotnet/dev-proxy/main/schemas/v3.0.0/crudapiplugin.apifile.schema.json",
  "baseUrl": "https://api.contoso.com/v1/customers",
  "dataFile": "customers-data.json",
  "auth": "apiKey",
  "apiKeyAuthConfig": {
    "apiKey": "my-secret-key",
    "queryParameterName": "api_key"
  },
  "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})]"
    }
  ]
}

Neste exemplo, o plugin procura a chave API no api_key parâmetro query-string. Por exemplo, chamar https://api.contoso.com/v1/customers?api_key=my-secret-key tem sucesso, enquanto chamar https://api.contoso.com/v1/customers devolve uma 401 Unauthorized resposta.

Exemplo 3: Simular uma API CRUD que aceita uma chave API tanto do cabeçalho como do parâmetro de consulta

Também pode configurar o plugin para aceitar a chave da API tanto num cabeçalho como num parâmetro de consulta. O plugin verifica primeiro o cabeçalho. Se o cabeçalho não contiver a chave API, o plugin verifica o parâmetro da consulta.

Atualize o customers-api.json arquivo da seguinte maneira:

Ficheiro:customers-api.json

{
  "$schema": "https://raw.githubusercontent.com/dotnet/dev-proxy/main/schemas/v3.0.0/crudapiplugin.apifile.schema.json",
  "baseUrl": "https://api.contoso.com/v1/customers",
  "dataFile": "customers-data.json",
  "auth": "apiKey",
  "apiKeyAuthConfig": {
    "apiKey": "my-secret-key",
    "headerName": "X-API-Key",
    "queryParameterName": "api_key"
  },
  "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})]"
    }
  ]
}

Neste exemplo, um pedido que inclua a chave API no X-API-Key cabeçalho ou no api_key parâmetro de consulta é autorizado.

Próximo passo

Saiba mais sobre o CrudApiPlugin.

Samples

Consulte também os exemplos relacionados de Dev Proxy: