Samouczek: Uzyskiwanie dostępu do portalu deweloperów i dostosowywanie go

DOTYCZY: Developer | Podstawowa | Podstawowa wersja 2 | Standardowa | Standardowa, wersja 2 | Premium

Portal dla deweloperów to automatycznie generowana, w pełni dostosowywalna witryna internetowa z dokumentacją interfejsów API. W tym miejscu użytkownicy interfejsu API mogą odnajdywać interfejsy API, uczyć się ich używania i żądać dostępu.

Z tego samouczka dowiesz się, jak wykonywać następujące czynności:

  • Uzyskiwanie dostępu do zarządzanej wersji portalu dla deweloperów
  • Nawigowanie po interfejsie administracyjnym
  • Dostosowywanie zawartości
  • Publikowanie zmian
  • Wyświetlanie opublikowanego portalu

Aby uzyskać więcej informacji na temat funkcji i opcji portalu dla deweloperów, zobacz Omówienie portalu deweloperów usługi Azure API Management.

Zrzut ekranu przedstawiający portal deweloperów usługi API Management — tryb administratora.

Wymagania wstępne

Uzyskiwanie dostępu do portalu jako administrator

Wykonaj następujące kroki, aby uzyskać dostęp do zarządzanej wersji portalu deweloperów.

  1. W witrynie Azure Portal przejdź do wystąpienia usługi API Management.

  2. Jeśli wystąpienie zostało utworzone w warstwie usługi w wersji 2 obsługującej portal dla deweloperów, najpierw włącz portal deweloperów.

    1. W menu po lewej stronie w obszarze Portal deweloperów wybierz pozycję Ustawienia portalu.
    2. W oknie Ustawienia portalu wybierz pozycję Włączone. Wybierz pozycję Zapisz.

    Włączenie portalu deweloperów może potrwać kilka minut.

  3. W menu po lewej stronie w obszarze Portal deweloperów wybierz pozycję Przegląd portalu. Następnie wybierz przycisk Portal deweloperów na górnym pasku nawigacyjnym. Zostanie otwarta nowa karta przeglądarki z wersją administracyjną portalu.

Omówienie interfejsu administracyjnego portalu

Jako administrator możesz dostosować zawartość portalu przy użyciu edytora wizualizacji.

Zrzut ekranu przedstawiający edytor wizualizacji w portalu dla deweloperów.

  • Użyj opcji menu po lewej stronie, aby utworzyć lub zmodyfikować strony, multimedia, układy, menu, style lub ustawienia witryny internetowej.

  • W górnej części przełącz się między portami widoków (dla ekranów o różnych rozmiarach) lub wyświetl elementy portalu widoczne dla użytkowników w różnych grupach. Na przykład możesz wyświetlić niektóre strony tylko do grup skojarzonych z określonymi produktami lub do użytkowników, którzy mogą uzyskiwać dostęp do określonych interfejsów API.

  • Ponadto zapisz lub cofnij wprowadzone zmiany lub opublikuj witrynę internetową.

Dodawanie obrazu do biblioteki multimediów

Aby odzwierciedlić znakowanie organizacji, użyj własnych obrazów i innych treści multimedialnych w portalu dla deweloperów. Jeśli obraz, którego chcesz użyć, nie znajduje się jeszcze w bibliotece multimediów portalu, dodaj go w portalu dla deweloperów:

  1. W menu po lewej stronie edytora wizualizacji wybierz pozycję Multimedia.
  2. Wykonaj jedną z następujących czynności:
    • Wybierz pozycję Przekaż plik i wybierz lokalny plik obrazu na komputerze.
    • Wybierz pozycję Połącz plik. Wprowadź adres URL odwołania do pliku obrazu i inne szczegóły. Następnie wybierz pozycję Pobierz.
  3. Wybierz pozycję Zamknij , aby zamknąć bibliotekę multimediów.

Napiwek

Możesz również dodać obraz do biblioteki multimediów, przeciągając go i upuszczając bezpośrednio w oknie edytora wizualizacji.

Zamień domyślne logo na stronie głównej

Logo symbolu zastępczego znajduje się w lewym górnym rogu paska nawigacyjnego. Możesz zastąpić go własnym logo, aby pasować do znakowania organizacji.

  1. W portalu deweloperów wybierz domyślne logo firmy Contoso w lewym górnym rogu paska nawigacyjnego.
  2. Zaznacz Edytuj.
  3. W oknie podręcznym Obraz w obszarze Główny wybierz pozycję Źródło.
  4. W oknie podręcznym Multimedia wybierz jedną z następujących opcji:
    • Obraz już przekazany w bibliotece multimediów
    • Przekazywanie pliku w celu przekazania nowego pliku obrazu do biblioteki multimediów
    • Brak , jeśli nie chcesz używać logo
  5. Logo jest aktualizowane w czasie rzeczywistym.
  6. Wybierz poza oknami podręcznym, aby zamknąć bibliotekę multimediów.
  7. Na górnym pasku wybierz pozycję Zapisz.

Edytowanie zawartości na stronie głównej

Domyślna strona główna i inne strony są dostarczane z tekstem zastępczym i innymi obrazami. Możesz usunąć całe sekcje zawierające tę zawartość lub zachować strukturę i dostosować elementy pojedynczo. Zastąp wygenerowany tekst i obrazy własnymi i upewnij się, że wszystkie linki wskazują żądane lokalizacje.

Edytuj strukturę i zawartość wygenerowanych stron na kilka sposobów. Na przykład:

  • Wybierz istniejące elementy tekstowe i nagłówki, aby edytować i sformatować zawartość.

  • Dodaj sekcję do strony, umieszczając wskaźnik myszy na pustym obszarze, a następnie kliknij niebieską ikonę z znakiem plus. Wybierz spośród kilku układów sekcji.

    Zrzut ekranu przedstawiający ikonę dodawania sekcji w portalu dla deweloperów.

  • Dodaj widżet (na przykład tekst, obraz, niestandardowy widżet lub listę interfejsów API), umieszczając wskaźnik myszy na pustym obszarze, a następnie kliknij szarą ikonę z znakiem plus.

    Zrzut ekranu przedstawiający ikonę dodawania widżetu w portalu dla deweloperów.

  • Zmień rozmieszczenie elementów na stronie przez przeciąganie i upuszczanie.

Edytowanie koloru podstawowego lokacji

Aby zmienić kolory, gradienty, typografię, przyciski i inne elementy interfejsu użytkownika w portalu deweloperów, edytuj style witryny. Na przykład zmień kolor podstawowy używany na pasku nawigacyjnym, przyciskach i innych elementach, aby pasować do znakowania organizacji.

  1. W portalu dla deweloperów w menu po lewej stronie edytora wizualizacji wybierz pozycję Style.
  2. W sekcji Kolory wybierz element stylu koloru, który chcesz edytować. Na przykład wybierz pozycję Podstawowa.
  3. Wybierz pozycję Edytuj kolor.
  4. Wybierz kolor z selektora kolorów lub wprowadź kod szesnastkowy koloru.
  5. Na górnym pasku wybierz pozycję Zapisz.

Zaktualizowany kolor jest stosowany do witryny w czasie rzeczywistym.

Napiwek

Jeśli chcesz, dodaj i nadaj innemu elementowi kolor, wybierając pozycję + Dodaj kolor na stronie Style .

Zmienianie obrazu tła na stronie głównej

Tło na stronie głównej portalu można zmienić na obraz lub kolor zgodny z marką organizacji. Jeśli jeszcze nie przekazano innego obrazu do biblioteki multimediów, możesz przekazać go przed zmianą obrazu tła lub zmianą.

  1. Na stronie głównej portalu dla deweloperów kliknij w prawym górnym rogu, aby górna sekcja jest wyróżniona w rogach i pojawi się menu podręczne.

  2. Po prawej stronie artykułu Edytuj w menu podręcznym wybierz strzałkę w górę w dół (Przełącz do elementu nadrzędnego).

  3. Wybierz pozycję Edytuj sekcję.

  4. W oknie podręcznym Sekcja w obszarze Tło wybierz jedną z ikon:

    Zrzut ekranu przedstawiający ustawienia w tle w portalu deweloperów.

    • Wyczyść tło, aby usunąć obraz tła
    • Obraz tła, aby wybrać obraz z biblioteki multimediów lub przekazać nowy obraz
    • Kolor tła, aby wybrać kolor z selektora kolorów lub wyczyścić kolor
    • Gradient tła, aby wybrać gradient ze strony stylów witryny lub wyczyścić gradient
  5. W obszarze Ustalanie rozmiaru tła ustaw odpowiedni wybór dla tła.

  6. Na górnym pasku wybierz pozycję Zapisz.

Zmienianie układu domyślnego

Portal deweloperów używa układów do definiowania typowych elementów zawartości, takich jak paski nawigacji i stopki na grupach powiązanych stron. Każda strona jest automatycznie dopasowywana do układu na podstawie szablonu adresu URL.

Domyślnie portal deweloperów zawiera dwa układy:

  • Strona główna — używana dla strony głównej (szablon adresu /URL)

  • Ustawienie domyślne — używane dla wszystkich innych stron (szablon adresu /*URL).

Zrzut ekranu przedstawiający domyślne układy w portalu dla deweloperów.

Możesz zmienić układ dowolnej strony w portalu dla deweloperów i zdefiniować nowe układy, aby zastosować je do stron pasujących do innych szablonów adresów URL.

Aby na przykład zmienić logo używane na pasku nawigacyjnym układu domyślnego, aby pasować do znakowania organizacji:

  1. W menu po lewej stronie edytora wizualizacji wybierz pozycję Strony.
  2. Wybierz kartę Układy i wybierz pozycję Domyślne.
  3. Wybierz obraz logo w lewym górnym rogu i wybierz pozycję Edytuj.
  4. W obszarze Main (Główne) wybierz pozycję Source (Źródło).
  5. W oknach podręcznych Multimedia wybierz jedną z następujących opcji:
    • Obraz już przekazany w bibliotece multimediów
    • Przekaż plik, aby przekazać nowy plik obrazu do pliku multimedialnego, który można wybrać
    • Brak , jeśli nie chcesz używać logo
  6. Logo jest aktualizowane w czasie rzeczywistym.
  7. Wybierz poza oknami podręcznym, aby zamknąć bibliotekę multimediów.
  8. Na górnym pasku wybierz pozycję Zapisz.

Edytowanie menu nawigacji

Możesz edytować menu nawigacji w górnej części stron portalu dla deweloperów, aby zmienić kolejność elementów menu, dodać elementy lub usunąć elementy. Możesz również zmienić nazwę elementów menu oraz adres URL lub inną zawartość, na którą wskazują.

Na przykład układy domyślne i główne portalu dla deweloperów wyświetlają dwa menu dla użytkowników-gości portalu dla deweloperów:

  • menu główne z linkami do strony głównej, interfejsów API i produktów
  • anonimowe menu użytkownika z linkami do stron logowania i tworzenia konta.

Możesz jednak dostosować je. Jeśli na przykład chcesz niezależnie zapraszać użytkowników do witryny, możesz wyłączyć link Zarejestruj się w menu użytkownika anonimowego.

Zrzut ekranu przedstawiający domyślne menu nawigacji w portalu deweloperów.

  1. W menu po lewej stronie edytora wizualizacji wybierz pozycję Menu witryny.
  2. Po lewej stronie rozwiń pozycję Anonimowe menu użytkownika.
  3. Wybierz ustawienia (ikona koła zębatego) obok pozycji Utwórz konto, a następnie wybierz pozycję Usuń.
  4. Wybierz pozycję Zapisz.

Edytowanie ustawień witryny

Edytuj ustawienia witryny portalu dla deweloperów, aby zmienić nazwę witryny, opis i inne szczegóły.

  1. W menu po lewej stronie edytora wizualizacji wybierz pozycję Ustawienia.
  2. W oknie podręcznym Ustawienia wprowadź metadane witryny, które chcesz zmienić. Opcjonalnie skonfiguruj favicon dla witryny z obrazu w bibliotece multimediów.
  3. Na górnym pasku zapisz.

Napiwek

Jeśli chcesz zmienić nazwę domeny witryny, musisz najpierw skonfigurować domenę niestandardową w wystąpieniu usługi API Management. Dowiedz się więcej o niestandardowych nazwach domen w usłudze API Management.

Publikowanie portalu

Aby udostępnić portal i jego najnowsze zmiany odwiedzającym, musisz go opublikować.

Aby opublikować z poziomu interfejsu administracyjnego portalu dla deweloperów:

  1. Upewnij się, że zmiany zostały zapisane, wybierając przycisk Zapisz .

  2. W menu u góry wybierz pozycję Publikuj witrynę. Ta operacja może potrwać kilka minut.

    Zrzut ekranu przedstawiający przycisk Publikuj witrynę internetową w portalu dla deweloperów.

Napiwek

Inną opcją jest opublikowanie witryny w witrynie Azure Portal. Na stronie Przegląd portalu wystąpienia usługi API Management w witrynie Azure Portal wybierz pozycję Publikuj.

Odwiedź opublikowany portal

Aby wyświetlić zmiany po opublikowaniu portalu, uzyskaj do niego dostęp pod tym samym adresem URL co panel administracyjny, na przykład https://contoso-api.developer.azure-api.net. Wyświetl ją w oddzielnej sesji przeglądarki (przy użyciu trybu przeglądania incognito lub prywatnego) jako zewnętrznego gościa.

Stosowanie zasad CORS dla interfejsów API

Aby umożliwić odwiedzającym portal testowanie interfejsów API za pomocą wbudowanej konsoli interaktywnej, włącz mechanizm CORS (współużytkowanie zasobów między źródłami) w interfejsach API, jeśli jeszcze tego nie zrobiono. Na stronie Przegląd portalu wystąpienia usługi API Management w witrynie Azure Portal wybierz pozycję Włącz mechanizm CORS. Dowiedz się więcej.

Następne kroki

W tym samouczku zawarto informacje na temat wykonywania następujących czynności:

  • Uzyskiwanie dostępu do zarządzanej wersji portalu dla deweloperów
  • Nawigowanie po interfejsie administracyjnym
  • Dostosowywanie zawartości
  • Publikowanie zmian
  • Wyświetlanie opublikowanego portalu

Przejdź do następnego samouczka:

Zobacz powiązaną zawartość portalu dla deweloperów: