Udostępnij za pomocą


Interfejs API sieci szkieletowej dla edytora GraphQL

Interfejs API Fabric dla GraphQL udostępnia graficzne środowisko programistyczne, które umożliwia interaktywne tworzenie, testowanie i wyświetlanie wyników zapytań i mutacji GraphQL.

Aby przejść do edytora, otwórz API dla elementu GraphQL w jego obszarze roboczym w Fabric i wybierz pozycję Zapytanie w lewym dolnym rogu ekranu portalu.

Zrzut ekranu przedstawiający miejsce wyświetlania opcji Zapytanie w lewym dolnym rogu ekranu Fabric.

Wpisz i wykonaj zapytania GraphQL bezpośrednio na karcie Zapytanie . Funkcje intellisense są dostępne za pomocą skrótu klawiaturowego: CTRL + Spacja (Windows) lub Command + Space (macOS). Wybierz pozycję Uruchom , aby wykonać zapytanie i pobrać dane ze źródła danych.

Zrzut ekranu edytora interfejsu API przedstawiający kartę Zapytanie podzieloną na okienka Uruchom, Zmienne zapytania i Wyniki.

Generowanie kodu

Po przetestowaniu i prototypowaniu żądanej operacji GraphQL, edytor interfejsu API generuje przykładowy kod w Pythonie lub Node.js na podstawie zapytania lub mutacji wykonanej w edytorze. Wygenerowany kod można uruchomić lokalnie na potrzeby testowania i ponownie użyć ich części w procesie tworzenia aplikacji.

Ważne

Wygenerowany kod używa poświadczeń przeglądarki interakcyjnej i powinien być używany tylko do celów testowych. W środowisku produkcyjnym zawsze zarejestruj aplikację w Microsoft Entra i użyj odpowiednich client_id oraz zakresów. Możesz znaleźć kompletny przykład z przykładowym kodem na stronie Connect Applications.

Aby rozpocząć, wykonaj zapytanie, wybierz przycisk Generuj kod i odpowiednio wybierz język:

Zrzut ekranu edytora interfejsu API przedstawiający opcję generowania kodu.

Następnie możesz skopiować wygenerowany kod i zapisać go jako plik w folderze lokalnym. W zależności od wybranego języka wykonaj następujące proste kroki, aby przetestować lokalnie:

Python

  1. Utwórz środowisko wirtualne, uruchamiając polecenie python -m venv .venv.

  2. Aktywuj venv, uruchamiając .venv\Scripts\activate lub source .venv/bin/activate.

  3. Zainstaluj wymaganą zależność, uruchamiając polecenie pip install azure.identity.

  4. Wykonaj kod za pomocą polecenia python <filename.py>.

Node.JS

  1. W tym samym folderze co zapisany plik utwórz package.json plik o następującej zawartości:

    {
      "type": "module",
      "dependencies": {}
    }
    
  2. Uruchom npm install --save @azure/identity lub podobne polecenie w wybranym menedżerze pakietów, aby zainstalować najnowszą wersję biblioteki tożsamości.

  3. Wykonaj kod za pomocą polecenia node <filename>.js.

Opracowywanie zapytań i mutacji

Przejrzyj ten krótki schemat GraphQL. Definiuje pojedynczy Post typ z zapytaniami do odczytu pojedynczego wpisu lub wyświetlania wszystkich wpisów oraz mutacjami do tworzenia, aktualizacji lub usunięcia wpisów, obsługującymi wszystkie przypadki użycia CRUDL (tworzenie, odczyt, aktualizacja, usunięcie, wyświetlenie listy).

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

Odczytywanie danych uwidocznionych za pośrednictwem języka GraphQL przy użyciu dowolnego zapytania zdefiniowanego w schemacie. Zapytanie getPost wygląda podobnie do tego przykładu.

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

Odpowiedź:

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

Użyj mutacji, takich jak createPost, do zapisywania danych i tworzenia wpisu z wymaganymi parametrami.

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

Odpowiedź:

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

Zmienne zapytania

Użyj okienka Zmienne zapytania po prawej stronie karty Zapytanie , aby przekazać parametry jako zmienne do zapytań lub mutacji. Zmienne działają jak zmienne w innych językach programowania. Każda zmienna jest zadeklarowana przy użyciu nazwy używanej do uzyskiwania dostępu do przechowywanej w niej wartości. Korzystając z poprzedniego przykładu mutacji, zmodyfikujesz go nieznacznie, aby używać zmiennych zapytania.

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

Zdefiniuj zmienne w okienku przy użyciu poniższego przykładu.

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

Zmienne ułatwiają odczytywanie, testowanie i modyfikowanie kodu mutacji.