Hinweis
Für den Zugriff auf diese Seite ist eine Autorisierung erforderlich. Sie können versuchen, sich anzumelden oder das Verzeichnis zu wechseln.
Für den Zugriff auf diese Seite ist eine Autorisierung erforderlich. Sie können versuchen, das Verzeichnis zu wechseln.
Auf einen Blick
Ziel: Simulieren der CRUD-API mit API-Schlüsselauthentifizierung
Zeit: 10 Minuten
Plugins:CrudApiPlugin
Voraussetzungen:Einrichten des Dev-Proxys
Beim Erstellen von Apps interagieren Sie häufig mit Back-End-APIs. Manchmal sind diese APIs noch nicht verfügbar, oder andere Teams aktualisieren sie, um die neuesten Anforderungen zu erfüllen. Um das Warten zu vermeiden, erstellen Sie in der Regel eine simulierte API, die die benötigten Daten zurückgibt. Dieser Ansatz hilft Ihnen zwar dabei, die Blockade zu überwinden, Sie müssen jedoch Zeit darauf verwenden, eine API zu erstellen, die Sie später durch die tatsächliche ersetzen. Es wird noch komplizierter, wenn Sie Ihre API mit einem API-Schlüssel sichern müssen. Um zeitaufwendige Zeit zu vermeiden, können Sie Dev Proxy verwenden, um eine CRUD-API zu simulieren und die Entwicklung zu beschleunigen.
Mit der CrudApiPlugin können Sie eine CRUD-API (Create, Read, Update, Delete) simulieren, die einen In-Memory-Datenspeicher verwendet. Mithilfe einer einfachen Konfigurationsdatei können Sie definieren, welche URLs Ihre Simuliert-API unterstützt und welche Daten zurückgegeben werden. Das Plug-In unterstützt auch CORS für die domänenübergreifende Nutzung von clientseitigen Anwendungen. Das Plug-In unterstützt auch die API-Schlüsselauthentifizierung, sodass Sie Ihre simulierte API mit einem API-Schlüssel sichern und testen können, dass Ihre App den Schlüssel richtig sendet.
Szenario
Angenommen, Sie erstellen eine App, mit der Benutzer Kunden verwalten können. Um die Daten abzurufen, müssen Sie den /customers Endpunkt der Back-End-API aufrufen. Die API wird mit einem API-Schlüssel gesichert. Um nicht darauf warten zu müssen, dass das Back-End-Team seine Arbeit abschließt, entscheiden Sie sich dafür, Dev Proxy zu verwenden, um die API zu simulieren und die von Ihnen benötigten Daten zurückzuliefern.
Bevor Sie anfangen
Zunächst erstellen Sie eine simulierte CRUD-API mit Kundendaten. Nachdem Sie bestätigt haben, dass die API funktioniert, können Sie sie mit einem API-Schlüssel sichern.
Beispiel 1: Simulieren einer CRUD-API, die mit einem API-Schlüssel in einem Header gesichert ist
Im ersten Beispiel sichern Sie die gesamte API mit einem API-Schlüssel, den Clients in einem HTTP-Header senden.
Fügen Sie in der customers-api.json Datei Informationen zur API-Schlüsselauthentifizierung hinzu.
Datei: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})]"
}
]
}
Durch Festlegen der auth Eigenschaft auf apiKey Sie geben Sie an, dass die API mit einem API-Schlüssel gesichert ist. In der apiKeyAuthConfig Eigenschaft geben Sie die Konfigurationsdetails an. Die apiKey Eigenschaft gibt den gültigen API-Schlüssel an, und die headerName Eigenschaft gibt den HTTP-Header an, in dem das Plug-In nach dem Schlüssel sucht.
Wenn Sie versuchen, die API aufzurufen, ohne den X-API-Key-Header auf my-secret-key zu setzen, erhalten Sie eine 401 Unauthorized-Antwort.
Beispiel 2: Simulieren einer CRUD-API, die mit einem API-Schlüssel in einem Abfrageparameter gesichert ist
In einigen APIs senden Clients den API-Schlüssel als Abfragezeichenfolgenparameter. Sie können dieses Verhalten simulieren, indem Sie die queryParameterName Eigenschaft konfigurieren.
Aktualisieren Sie die customers-api.json Datei wie folgt:
Datei: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})]"
}
]
}
In diesem Beispiel sucht das Plug-In im Abfragezeichenfolgenparameter nach dem api_key API-Schlüssel. Beispielsweise ist der Aufruf von https://api.contoso.com/v1/customers?api_key=my-secret-key erfolgreich, während der Aufruf von https://api.contoso.com/v1/customers eine 401 Unauthorized-Antwort zurückgibt.
Beispiel 3: Simulieren einer CRUD-API, die einen API-Schlüssel aus Header und Abfrageparameter akzeptiert
Sie können das Plug-In auch so konfigurieren, dass er den API-Schlüssel sowohl aus einem Header als auch einem Abfrageparameter akzeptiert. Das Plug-In überprüft zuerst die Kopfzeile. Wenn der Header nicht den API-Schlüssel enthält, überprüft das Plug-In den Abfrageparameter.
Aktualisieren Sie die customers-api.json Datei wie folgt:
Datei: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})]"
}
]
}
In diesem Beispiel wird eine Anforderung, die den API-Schlüssel in den X-API-Key Header oder den api_key Abfrageparameter enthält, autorisiert.
Nächster Schritt
Erfahren Sie mehr über crudApiPlugin.
Samples
Siehe auch die zugehörigen Dev Proxy-Beispiele: