Megosztás a következőn keresztül:


Fabric API a GraphQL-szerkesztőhöz

A GraphQL-hez készült Fabric API grafikus, böngészőn belüli GraphQL-fejlesztési környezetet biztosít, amely lehetővé teszi, hogy egy interaktív játszótér a GraphQL-lekérdezések és -mutációk élő eredményeit írja, tesztelje és tekintse meg.

A szerkesztő megnyitásához nyissa meg az API-t a GraphQL-elemhez a Fabricben, és válassza a Lekérdezés lehetőséget a portál képernyőjének bal alsó sarkában.

Képernyőkép arról, hogy hol jelenik meg a Lekérdezés lehetőség a Háló képernyő bal alsó sarkában.

A GraphQL-lekérdezéseket közvetlenül a Lekérdezés lapon gépelheti be és hajthatja végre. Az Intellisense funkciói billentyűparancsokkal érhetők el: CTRL + Szóköz (Windows) vagy Command + Space (macOS). Válassza a Futtatás lehetőséget a lekérdezés végrehajtásához, és ennek megfelelően kérje le az adatokat az adatforrásból.

Képernyőkép az API-szerkesztő képernyőjéről, amelynek Lekérdezés lapja Futtatás, Lekérdezés változók és Eredmények panelre van osztva.

Kód létrehozása

A kívánt GraphQL-művelet tesztelése és prototípusa után az API-szerkesztő létrehozhat egy Python-sablont vagy Node.js kódot a szerkesztőben végrehajtott lekérdezés vagy mutáció alapján. A létrehozott kódot helyileg futtathatja tesztelési célokra, és újra felhasználhatja annak részeit az alkalmazásfejlesztési folyamat során.

Fontos

A létrehozott kód interaktív böngészőbeli hitelesítő adatokat használ, és csak tesztelési célokra használható. Éles környezetben mindig regisztráljon egy alkalmazást a Microsoft Entra-ban, és használja a megfelelő client_id és hatóköröket. A Connect Applications mintakódjával egy végpontok közötti példát találhat.

Első lépésként hajtsa végre a lekérdezést, válassza a Kód létrehozása gombot, és ennek megfelelően válassza ki a nyelvet:

Képernyőkép az API-szerkesztő képernyőről a Kód létrehozása lehetőség megnyitása után.

Ezután átmásolhatja a létrehozott kódot, és fájlként mentheti egy helyi mappába. A választott nyelvtől függően kövesse az egyszerű lépéseket a helyi teszteléshez:

Python
  1. Virtuális környezet létrehozása a paranccsal python -m venv .venv
  2. A következő aktiválása:venv .venv\Scripts\activatesource .venv/bin/activate
  3. Telepítse a szükséges függőséget a paranccsal pip install azure.identity
  4. A kód végrehajtása a következővel: python <filename.py>
Node.JS
  1. A mentett fájllal megegyező mappában hozzon létre egy package.json fájlt a következő tartalommal:
{
  "type": "module",
  "dependencies": { 
  }
}
  1. Futtassa npm install --save @azure/identity vagy hasonló parancsot a választott csomagkezelőben az identitástár legújabb verziójának telepítéséhez.
  2. A kód végrehajtása a következővel: node <filename>.js

Lekérdezések és mutációk fejlesztése

Tekintse át a következő rövid GraphQL-sémát, amely egyetlen Post típust határoz meg lekérdezésekkel egyetlen bejegyzés olvasásához vagy az összes bejegyzés listázásához. Emellett az összes CRUDL-használati esetet (létrehozás, olvasás, frissítés, törlés, lista) támogató bejegyzések létrehozására, frissítésére vagy törlésére vonatkozó mutációkat is definiál.

type Post {
  id: ID!
  title: String!
  content: String!
  author: String!
  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
}

A GraphQL-en keresztül közzétett adatokat a sémában definiált lekérdezésekkel olvashatja el. A getPost lekérdezésnek az alábbi példához hasonlóan kell kinéznie.

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

Válasz:

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

Írjon adatokat mutációkkal, például createPost hozzon létre egy bejegyzést a szükséges paraméterekkel.

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

Válasz:

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

Lekérdezési változók

A Lekérdezés lap jobb oldalán található Lekérdezés változók panelen bármilyen paramétert átadhat változóként a lekérdezéseknek vagy a mutációknak. A változók ugyanúgy működnek, mint bármely más programozási nyelv változói. Minden változót olyan névvel kell deklarálni, amely a benne tárolt érték elérésére szolgál. Az előző mutációs példában kissé módosíthatja a lekérdezési változók használatára.

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

Definiálja a változókat a panelen az alábbi példához hasonlóan.

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

A változók tisztábbá teszik a mutációs kódot, és könnyebben olvashatók, tesztelhetők és módosíthatók a paraméterek.