Sdílet prostřednictvím


Rozhraní Fabric API pro editor GraphQL

Rozhraní Fabric API pro GraphQL poskytuje grafické vývojové prostředí GraphQL přímo v prohlížeči, které umožňuje interaktivní prostředí pro skládání, testování a zobrazení živých výsledků vašich GraphQL dotazů a mutací.

Pokud chcete přejít do editoru, otevřete v prostředcích infrastruktury položku rozhraní API pro GraphQL a v levém dolním rohu obrazovky portálu vyberte Dotaz .

Snímek obrazovky znázorňující, kde se v levém dolním rohu obrazovky Fabric zobrazí možnost Dotaz

Zadejte a spusťte dotazy GraphQL přímo na kartě Dotaz . Funkce IntelliSense jsou dostupné pomocí klávesové zkratky: CTRL + Mezerník (Windows) nebo Command + Mezerník (macOS). Výběrem možnosti Spustit spustíte dotaz a načtete data ze zdroje dat.

Snímek obrazovky editoru rozhraní API, na které je karta Dotaz rozdělená na podokna Spustit, Proměnné dotazu a Výsledky

Generování kódu

Po otestování a vytváření prototypů požadované operace GraphQL vygeneruje editor rozhraní API často používaný python nebo Node.js kód založený na dotazu nebo vyměněného kódu spuštěného v editoru. Vygenerovaný kód můžete spustit místně pro účely testování a znovu použít jeho části v procesu vývoje aplikací.

Důležité

Vygenerovaný kód používá interaktivní přihlašovací údaje prohlížeče a měl by se používat jenom pro účely testování. V produkčním prostředí vždy zaregistrujte aplikaci v Microsoft Entra a použijte odpovídající client_id a rozsahy. Kompletní příklad s ukázkovým kódem najdete na webu Connect Applications.

Začněte tím, že spustíte dotaz, vyberete tlačítko Generovat kód a odpovídajícím způsobem zvolíte jazyk:

Snímek obrazovky editoru rozhraní API znázorňující způsob generování možnosti kódu

Pak můžete vygenerovaný kód zkopírovat a uložit ho jako soubor v místní složce. V závislosti na zvoleném jazyce proveďte místní testování podle těchto jednoduchých kroků:

Python

  1. Spuštěním příkazu python -m venv .venvvytvořte virtuální prostředí .

  2. venv Aktivace spuštěním .venv\Scripts\activate nebo source .venv/bin/activate.

  3. Nainstalujte požadovanou závislost spuštěním pip install azure.identitypříkazu .

  4. Spusťte kód pomocí python <filename.py>příkazu .

Node.JS

  1. Ve stejné složce jako soubor, který jste uložili, vytvořte package.json soubor s následujícím obsahem:

    {
      "type": "module",
      "dependencies": {}
    }
    
  2. Spuštěním npm install --save @azure/identity nebo podobným příkazem ve zvoleném správci balíčků nainstalujte nejnovější verzi knihovny identit.

  3. Spusťte kód pomocí node <filename>.jspříkazu .

Vývoj dotazů a mutací

Projděte si toto krátké schéma GraphQL. Definuje jeden typ s dotazy pro čtení jednoho Post příspěvku nebo výpisu všech příspěvků a mutací pro vytvoření, aktualizaci nebo odstranění příspěvků, které podporují všechny případy použití CRUDL (vytvoření, čtení, aktualizace, odstranění, výpis).

{
  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
  }
}

Čtení dat vystavených prostřednictvím GraphQL pomocí libovolného dotazu definovaného ve schématu Dotaz getPost vypadá jako v tomto příkladu.

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

Odpověď:

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

Pomocí mutací createPost můžete zapsat data a vytvořit příspěvek s požadovanými parametry.

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

Odpověď:

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

Proměnné dotazu

Pomocí podokna Proměnné dotazu na pravé straně karty Dotaz můžete předávat parametry jako proměnné dotazům nebo mutacím. Proměnné fungují jako proměnné v jiných programovacích jazycích. Každá proměnná je deklarována názvem použitým pro přístup k hodnotě uložené v ní. V předchozím příkladu s mutací ji upravíte mírně tak, aby používala proměnné dotazu.

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

Pomocí následujícího příkladu definujte proměnné v podokně.

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

Proměnné usnadňují čitelnost, testování a úpravu kódu s proměnlivým kódem.