Sdílet prostřednictvím

Testujte JavaScriptovou webovou aplikaci na straně klienta, která volá Microsoft Graph

  • Článek

V tomto kurzu se dozvíte, jak pomocí dev proxy otestovat ukázkovou webovou aplikaci na straně klienta JavaScriptu, která volá Microsoft Graph.

Požadavky

V této části kurzu se předpokládá, že jste na počítači nainstalovali a nakonfigurovali Dev Proxy. Pokud ne, udělejte to nyní.

Pokud chcete postupovat podle tohoto kurzu, potřebujete:

Spropitné

Doporučujeme používat tenanta Microsoftu 365 pro vývojáře s nainstalovanými balíčky obsahu. Získejte svého bezplatného tenanta registrací do programu Microsoft 365 Developer Program.

Klonování a konfigurace ukázkové aplikace

  • Stažení ukázkové aplikace
  • Nakonfigurujte aplikaci podle instrukcí a.

Spuštění dev proxy serveru

Dev Proxy obsahuje přednastavenou konfiguraci pro testování aplikací, které odesílají požadavky do rozhraní Microsoft Graph a rozhraní API SharePointu Online.

  • Otevřete příkazový řádek, zadejte devproxy --config-file "~appFolder/presets/m365.json" a stiskněte Enter a spusťte Dev Proxy s konfigurací Pro Microsoft 365.

Spuštění ukázkové aplikace

  • Otevřete příkazový řádek a přejděte do adresáře samples.
  • Zadejte npx lite-server a stisknutím klávesy Enter spusťte webový server ukázkové aplikace.

Snímek obrazovky s ukázkovou aplikací spuštěnou v prohlížeči Microsoft Edge v systému macOS Aplikace zobrazuje velké logo Microsoftu se dvěma tlačítky pod ním. Primární tlačítko s textem With SDK a sekundárním tlačítkem s textem Bez sady SDK.

Testování ukázkové aplikace

  1. V běžící aplikaci vyberte tlačítko Without SDK.

Opatrnost

Pokud jste po kliknutí na tlačítko Without SDK dostali prázdnou stránku, zkontrolujte, zda jste nakonfigurovali registraci aplikace Azure AD pro. K tomuto problému dochází, když chybí soubor .env obsahující Client ID registrace vaší aplikace.

  1. Vyberte tlačítko Login a dokončete tok přihlášení.

snímek obrazovky ukázkové aplikace spuštěné v prohlížeči Microsoft Edge ve Windows 11 Aplikace zobrazuje velké logo Microsoftu se dvěma tlačítky pod ním. Primární tlačítko s textem Login (Přihlášení) a sekundárním tlačítkem s textem Back (Zpět).

Dev Proxy zavádí do vaší aplikace chyby tím, že zachytí požadavky na Microsoft Graph. Využívá 50% šanci na neúspěšné požadavky s náhodným podporovaným stavovým kódem chyby HTTP.

Prohlédněte si výstup proxy serveru a chvíli aktualizujte ukázkovou aplikaci. Podívejte se, jak ukázková aplikace zpracovává (nebo ne) chyby zavedené proxy serverem.

snímek obrazovky ukázkové aplikace spuštěné v Microsoft Edgi V aplikaci se nezobrazují avatary uživatelů. Vývojářské nástroje Microsoft Edge jsou otevřené na straně s chybami zobrazenými v protokolu konzoly.

  1. Stisknutím kláves Ctrl + C zastavte dev proxy server.

Další krok

Prozkoumejte návody