Delen via

Fabric-API voor GraphQL-editor

De Fabric-API voor GraphQL biedt een grafische in-browser GraphQL-ontwikkelomgeving, waarmee een interactieve speeltuin de live resultaten van uw GraphQL-query's en mutaties kan opstellen, testen en bekijken.

Als u naar de editor wilt gaan, opent u de API voor GraphQL-item in de werkruimte in Fabric en selecteert u Query in de linkerbenedenhoek van het portalscherm.

Schermopname waarin de optie Query wordt weergegeven in de linkerbenedenhoek van het scherm Fabric.

Typ en voer GraphQL-query's rechtstreeks op het tabblad Query uit. Intellisense-mogelijkheden zijn beschikbaar met een sneltoets: Ctrl + Spatiebalk (Windows) of Command + Spatie (macOS). Selecteer Uitvoeren om de query uit te voeren en gegevens op te halen uit de gegevensbron.

Schermopname van het scherm API-editor, waarin een tabblad Query wordt weergegeven, onderverdeeld in het deelvenster Uitvoeren, Queryvariabelen en Resultaten.

Code genereren

Na het testen en prototypen van de gewenste GraphQL-bewerking genereert de API-editor standaard Python of Node.js code op basis van de query of mutatie die in de editor wordt uitgevoerd. U kunt de gegenereerde code lokaal uitvoeren voor testdoeleinden en delen ervan opnieuw gebruiken in het ontwikkelingsproces van de toepassing.

Important

De gegenereerde code maakt gebruik van interactieve browserreferenties en mag alleen worden gebruikt voor testdoeleinden. Registreer in productie altijd een toepassing in Microsoft Entra en gebruik de juiste client_id bereiken. U vindt een end-to-end-voorbeeld met voorbeeldcode in Connect Applications.

Als u aan de slag wilt gaan, voert u een query uit, selecteert u de knop Code genereren en kiest u de taal dienovereenkomstig:

Schermopname van het scherm API-editor waarin wordt getoond hoe u code kunt genereren.

Vervolgens kunt u de gegenereerde code kopiëren en opslaan als een bestand in een lokale map. Afhankelijk van de gekozen taal volgt u deze eenvoudige stappen om lokaal te testen:

Python

  1. Maak een virtuele omgeving door de opdracht python -m venv .venvuit te voeren.

  2. Activeer de venv door uit te voeren .venv\Scripts\activate of source .venv/bin/activate.

  3. Installeer de vereiste afhankelijkheid door uit te voeren pip install azure.identity.

  4. Voer de code uit met python <filename.py>.

Node.JS

  1. Maak in dezelfde map als het bestand dat u hebt opgeslagen een package.json bestand met de volgende inhoud:

    {
  "type": "module",
  "dependencies": {}
}

  2. Voer npm install --save @azure/identity of een vergelijkbare opdracht uit in uw gekozen pakketbeheer om de nieuwste versie van de identiteitsbibliotheek te installeren.

  3. Voer de code uit met node <filename>.js.

Ontwikkeling van query's en mutaties

Bekijk dit korte GraphQL-schema. Het definieert één Post type met query's voor het lezen van één bericht of lijst met alle berichten en mutaties voor het maken, bijwerken of verwijderen van berichten, waarbij alle CRUDL-gebruiksvoorbeelden (maken, lezen, bijwerken, verwijderen, lijst) worden ondersteund.

{
  type Post {
    id: ID!
    published: Boolean
  }

  type Query {
    getPost(id: ID!): Post
    getAllPosts: [Post]
  }

  type Mutation {
    createPost(title: String!, content: String!, author: String!): Post
    updatePost(id: ID!, title: String, content: String, author: String, published: Boolean): Post
    deletePost(id: ID!): Boolean
  }
}

Lees de gegevens die via GraphQL worden weergegeven met behulp van een query die in het schema is gedefinieerd. De getPost query ziet eruit als in dit voorbeeld.

query MyQuery {
  getPost(id: "1234") {
    title
    content
    author
  }
}

Response:

{
  "data": {
    "getPost": {
      "title": "First Post",
      "content": "This is my first post.",
      "author": "Jane Doe"
    }
  }
}

Gebruik mutaties zoals createPost het schrijven van gegevens en het maken van een post met de vereiste parameters.

mutation MyMutation {
  createPost(title: "Second post", content: "This is my second post", author: "Jane Doe", published: false) {
    id
    title
    content
    author
  }
}

Response:

{
  "data": {
    "createPost": {
      "id": "5678",
      "title": "Second Post",
      "content": "This is my second post.",
      "author": "Jane Doe"
    }
  }
}

Queryvariabelen

Gebruik het deelvenster Queryvariabelen aan de rechterkant van het tabblad Query om parameters als variabelen door te geven aan uw query's of mutaties. Variabelen werken als variabelen in andere programmeertalen. Elke variabele wordt gedeclareerd met een naam die wordt gebruikt voor toegang tot de waarde die erin is opgeslagen. Met behulp van het vorige mutatievoorbeeld wijzigt u deze enigszins om queryvariabelen te gebruiken.

mutation MyMutation ($title: String!, $content: String!, $author: String!){
  createPost(title: $title, content: $content, author: $author) {
    id
    title
    content
    author
  }
}

Definieer variabelen in het deelvenster met behulp van het volgende voorbeeld.

{
  "id": "5678",
  "title": "Second Post",
  "content": "This is my second post.",
  "author": "Jane Doe"
}

Variabelen maken de mutatiecode schoner, gemakkelijker te lezen, te testen en te wijzigen.

Verwante inhoud

  • Last updated on