Wyświetlanie zawartości internetowej i interakcja z nią

Użyj funkcji WebSlate, aby wyświetlić interaktywną zawartość internetową w środowisku usługi 3D Mesh. Uzyskaj pełne środowisko przeglądania na komputerze PC lub Quest 2 z intuicyjnymi danymi wejściowymi, dostosowywaniem, zabezpieczeniami i wydajnością.

Możesz użyć funkcji WebSlates w celu:

• Interakcja z mapami, diagramami i danymi

• Wyświetlanie pulpitów nawigacyjnych, stron internetowych, zdjęć i wideo

• Pokazywanie zawartości, która wyróżnia produkty i usługi, historie klientów i tożsamość marki

Funkcje webSlate

• Określ domyślny adres URL: Wybierz lokalizację, a następnie przeciągnij i upuść prefab, a następnie dodaj adres URL. Powtórz, jeśli chcesz, aby w scenie było wiele obiektów WebSlate.

• Wbudowane wejście & audio: Nawigacja internetowa użytkownika końcowego, interakcja z aplikacjami i wyświetlanie filmów wideo stają się dostępne w usłudze Mesh.

• Bezpieczna nawigacja: Zablokuj adresy URL przekierowania, aby uniemożliwić złośliwe przekierowania i niezamierzone nawigacje hiperlinków.

• Dostosowywanie wizualizacji: Zmodyfikuj jakość, aby zoptymalizować urządzenia użytkowników. Przyciągaj użytkowników z odległości dzięki łatwej do wyświetlenia zawartości.

• Scriptable: Za pomocą skryptów wizualnych i skryptów w chmurze można włączyć przełączanie między stronami za pomocą przycisku.

• Integracja narzędzi Analizator wydajności zawartości: zmierz średni czas renderowania plików WebSlates w ramce i znajdź problemy z ładowaniem zawartości.

• Testowanie w trybie emulacji siatki: Interakcja z zawartością jako użytkownik bezpośrednio z poziomu edytora aparatu Unity.

• Ręczne uwierzytelnianie w środowisku: Uzyskaj dostęp do bezpiecznej zawartości z poziomu środowiska, logując się do konta i wyświetlając zawartość w czasie wykonywania.

Jak działa usługa WebSlate

Jeśli masz skonfigurowany projekt aparatu Unity w celu utworzenia środowisk usługi Mesh, dodanie składnika WebSlate do środowiska jest prostym procesem.

W usłudze Mesh usługa WebSlate ładuje interaktywną stronę za pośrednictwem podanego adresu URL. Adres URL podany w środowisku będzie taki sam jak adres URL załadowany w usłudze Mesh. W zestawie narzędzi Mesh prefab WebSlate zawiera parametr adresu URL, który deweloperzy mogą określić, aby kontrolować zawartość wyświetlaną w środowisku usługi Mesh.

• Po załadowaniu aplikacji mesh dla komputerów PC i quest strony internetowe ładowane przez usługę WebSlate są wchodzić w interakcje za pomocą myszy, klawiatury i danych wejściowych kontrolera Quest XR.

• Rozmiar i kształt obiektu WebSlate będą zgodne z rozmiarem czworokąta obiektu GameObject, na który został umieszczony. Zazwyczaj jest to czworokąt pieczony wewnątrz prefab WebSlate.

• Do sceny można dodać wiele obiektów WebSlate. Liczba użytkowników w środowisku usługi Mesh nie ma wpływu na wydajność usługi WebSlate; Zasoby webSlate są inicjowane lokalnie na komputerze użytkownika.

• Funkcje WebSlate można skonfigurować za pomocą skryptów wizualnych lub w chmurze w celu dodania interaktywnych zachowań i synchronizacji między użytkownikami.

• Usługa WebSlate może wyświetlać strony internetowe i obsługuje interakcje, ale nie działa jako przeglądarka i nie obsługuje zakładek, historii ani podróży z powrotem.

• Przed przekazaniem sceny do usługi Mesh możesz wyświetlić podgląd aplikacji WebSlate w projekcie aparatu Unity, naciskając przycisk Odtwórz.

Wymagania/zależności

Funkcja WebSlate zależy od pakietów Unity.InputSystem i Unity.XR.Interaction.Toolkit Unity znajdujących się w zestawie narzędzi Mesh.

Dodawanie prefabrykatu WebSlate do projektu aparatu Unity

W zestawie narzędzi mesh dostępne są dwa smaki prefabrykatów WebSlate, które można dodać do sceny. Jeśli wolisz czysty plik WebSlate bez dodatkowych składników, dodaj prefab webSlate. Jeśli chcesz, aby obiekt WebSlate zawarty w stylizowanej ramce z dodatkowymi funkcjami, dodaj prefab webSlateFramed .

Dodawanie prefabrykatu WebSlate z menu

Aby dodać jeden z prefabrykatów do sceny:

1. Kliknij prawym przyciskiem myszy w hierarchii, a następnie w menu kontekstowym wykonaj jedną z następujących czynności:

   Aby dodać czysty składnik WebSlate bez dodatkowych składników:
   Wybierz pozycjęWebSlatezestawu narzędzi> mesh.

   Aby dodać element WebSlate ze stylizowaną ramką i dodatkowymi funkcjami:
   Wybierz pozycjęWebSlateFramedzestawu narzędzi> mesh.

2. Dodaj adres URL do aplikacji WebSlate, aby wyświetlić zawartość.

   Porada: możesz również kliknąć przycisk "+" w lewym górnym rogu okna Hierarchia, aby wyświetlić to samo menu.

   

   

Wyszukaj i dodaj prefab webSlate

Możesz również wyszukać i dodać prefab webSlate.

1. W polu Wyszukaj wpisz ciąg "WebSlate". Upewnij się, że wybrano filtr Wszystkie .

   

2. Przeciągnij prefab, który chcesz wyświetlić w widoku sceny lub w hierarchii.

   

3. W inspektorze przejdź do składnika WebSlate, a następnie dodaj adres URL, który chcesz wyświetlić w usłudze WebSlate :

   

Upewnij się, że usługa WebSlate jest czytelna

Ważne jest, aby wszyscy uczestnicy w środowisku usługi Mesh mogli wygodnie odczytywać całą zawartość w usłudze WebSlate. Zalecamy utworzenie pustego miejsca na podłodze przed witryną WebSlate, aby uczestnicy mogli zbliżyć się do niego i dostosować ich położenie w celu uzyskania lepszego widoku. Jeśli twoje środowisko zawiera miejsca, wyświetl dane WebSlate z każdego miejsca, aby upewnić się, że uczestnik siedzący na tym siedzeniu może odczytać tekst w witrynie WebSlate. Jeśli masz kontrolę nad zawartością, która będzie wyświetlana w usłudze WebSlate, poeksperymentuj z różnymi rozmiarami czcionek dla tekstu, aby określić optymalny rozmiar wyświetlania. W poniższym przykładzie tekst "Microsoft Teams" w środku tabeli WebSlate jest na tyle duży, aby wygodnie wyświetlać, ale znacznie mniejszy tekst w rogach jest trudny do odczytania. W tym typie scenariusza nie będziesz mieć kontroli nad tekstem w wideo przesyłanym strumieniowo, więc należy rozważyć przeniesienie miejsc bliżej. Ponadto miejsca, które są bardziej wyśrodkowane i patrząc prosto na WebSlate zapewni lepszy widok niż miejsca, które są wyłączone po bokach.

Podgląd funkcji WebSlate w trybie emulacji siatki

Aby szybciej wyświetlić adres URL wyświetlany w usłudze WebSlate, możesz użyć trybu emulacji siatki. Oprócz testowania w tym trybie jedynym sposobem wyświetlania aplikacji WebSlate jest przekazanie go przy użyciu modułu przekazywania zestawu narzędzi mesh i wyświetlenie go w środowisku usługi Mesh.

Aby dodać tryb emulacji siatki do projektu, postępuj zgodnie z instrukcjami w artykule Mesh Emulator.

Aby wyświetlić stronę sieci Web w usłudze WebSlate:
Naciśnij przycisk Odtwarzania edytora aparatu Unity.

Włączanie interakcji webSlate dla trybu emulacji siatki

Aby włączyć interakcję w usłudze WebSlate, należy skonfigurować kilka rzeczy.

1. Dodaj emulator usługi Mesh do sceny, aby włączyć tryb emulacji siatki.

2. Utwórz nowy obiekt Plane GameObject. Będzie to twoja podłoga. Upewnij się, że obiekt GameObject jest umieszczony w miejscu pochodzenia (0,0,0):

   

3. Umieść element WebSlate tak, aby znajduje się przed znakiem MeshEmulatorSetup :

   

4. Kliknij przycisk Odtwórz, a następnie kliknij dwukrotnie, aby wchodzić w interakcję ze stroną sieci Web wyświetlaną w usłudze WebSlate:

   

Dobra robota! Dodano niestandardową bazę danych WebSlate do sceny aparatu Unity i przetestowano interakcję w trybie emulacji siatki.

Teraz możesz przekazać środowisko do usługi Mesh i udostępnić swoje tworzenie światu.

WebSlate in Visual Scripting

Dzięki skryptom wizualnym deweloperzy mogą implementować funkcje i zachowanie webSlate bez konieczności wpisywania kodu. Zamiast tego udostępnia się interfejs wizualny oparty na węźle, umożliwiając użytkownikom definiowanie i łączenie różnych akcji i zdarzeń w scenie. Niektórzy deweloperzy uważają, że może to uprościć proces dodawania interakcyjności i zachowania.

Aby włączyć tworzenie skryptów wizualnych przy użyciu funkcji WebSlate, należy skonfigurować kilka elementów.

1. Przejdź do pozycji Edytuj>ustawienia projektu.

2. Na liście po lewej stronie wybierz pozycję Visual Scripting (Tworzenie skryptów wizualnych).

   

3. Rozwiń węzeł Biblioteka węzłów. Spowoduje to wyświetlenie listy zestawów.

4. W dolnej części listy zestawów po prawej stronie kliknij przycisk Dodaj (+). Spowoduje to dodanie nowego elementu do listy zawierającej ciąg "(Brak zestawu)".

5. Kliknij nowy wpis zestawu, a następnie w polu Wyszukaj wpisz "Webslate". Spowoduje to zawężenie listy do pliku Microsoft.Mesh.WebSlate. Wybierz ten element, aby dodać go do listy Zestaw .

   

   Tworzenie skryptów wizualnych dodaje plik Microsoft.Mesh.WebSlate i jego węzły do biblioteki węzłów. Aby użyć węzłów w projekcie, wybierz przycisk Wygeneruj ponownie węzły .

   

   Załaduj adres URL

   Deweloperzy mogą teraz dynamicznie zmieniać zawartość internetową w czasie rzeczywistym, ładując nowe adresy URL za pomocą skryptów wizualnych. Ta funkcja rozszerza zakres różnych aplikacji, w tym zmianę zawartości internetowej na podstawie preferencji użytkownika lub aktualizowanie jej w odpowiedzi na dane w czasie rzeczywistym.

   

   Ładowanie zawartości HTML

   Ta nowa funkcja w usłudze WebSlate umożliwia deweloperom usuwanie plików HTML jako elementów tekstowych do sceny aparatu Unity przy niskim wysiłku. Ta integracja nie tylko upraszcza przepływ pracy, ale także umożliwia natychmiastowe opinie w trybie odtwarzania aparatu Unity, zwiększając edytowanie i debugowanie w czasie rzeczywistym. Ponadto obsługuje dynamiczne przełączanie zawartości, oferując elastyczność i bardziej interaktywne środowisko użytkownika.

   

   Utwórz nowy lub ponownie użyj istniejącego kodu HTML do wyświetlania/interakcji w środowisku usługi Mesh: jeśli nie chcesz hostować zawartości HTML lub masz bezpieczne pliki offline, możesz dodać kod HTML na miejscu i dołączyć go jako część zasobu w scenie.

   Dynamiczne ładowanie w czasie wykonywania: ładowanie kodu HTML z plików umożliwia deweloperom wprowadzanie zmian w czasie rzeczywistym przy użyciu skryptów wizualnych. Ta dynamiczna funkcja zwiększa środowisko użytkownika.

   Szybka pętla opinii w trybie odtwarzania aparatu Unity: dzięki zawartości HTML ładowanej z plików deweloperzy mogą natychmiast zobaczyć skutki zmian w trybie odtwarzania aparatu Unity.

WebSlate in Cloud Scripting

Deweloperzy mogą również dodawać usługę WebSlate do środowisk przy użyciu skryptów w chmurze usługi Mesh. Oznacza to, że usługa WebSlate może być nawigowana przez skrypt chmury usługi Mesh, a następnie synchronizowany między użytkownikami. Można na przykład utworzyć skrypt chmury usługi Mesh zawierający węzeł WebSlate i co najmniej jeden węzeł z możliwością interakcji. Następnie możesz skonfigurować procedurę obsługi zdarzeń click click interactableNode, aby nawigować po usłudze WebSlate do innego adresu URL. Dodając skrypt chmury usługi Mesh obok funkcji WebSlate, użytkownicy mogą interaktywnie aktualizować zawartość webSlate.

Aby uzyskać więcej wskazówek dotyczących węzła WebSlate w usłudze Mesh Apps, zobacz Omówienie obsługi skryptów wizualnych.

Ogólne porady

• Obiekt WebSlate można umieścić w obiekcie GameObjects innym niż Czworokąt, dodając WebSlate.cs jako składnik skryptu bezpośrednio do wybranego obiektu 3D i dodając element UnlitWebSlate.mat do meshRenderer Materials. Należy pamiętać, że może to spowodować rozciąganie, inwersję i/lub rotację tekstury wizualnej.

• Usługa WebSlate ładuje domyślny adres URL. Ten adres URL należy zastąpić jednym, który jest preferowany dla każdego obiektu WebSlate w użyciu. Parametr jasności jest ustawiony na 1,0 (100% jasności przeglądarki).

• Funkcja WebSlates automatycznie zawiesza się po wyłączeniu ekranu przez zbyt długi czas. Jeśli musisz upewnić się, że dana łupka jest zawsze uruchomiona (np. transmisja strumieniowa na żywo lub ciągłe odtwarzanie dźwięku), sprawdź przycisk "Zapobiegaj zawieszeniu" w asocjacji WebSlate. Zobacz poniżej, aby uzyskać implikacje dotyczące wydajności.

• Aby rozmiar adresu URL obrazu był większy niż webSlate, opakuj adres URL w kodzie HTML. Użyj interfejsu API LoadHTML webSlate za pomocą skryptów wizualnych, aby renderować tę zawartość HTML na platformie WebSlate. Dodaj skonstruowany kod HTML do właściwości HTMLContent. Alternatywnie możesz użyć interfejsu API loadHTMAsset i przekazać kod HTML jako zasób. Zastąp adres URL obrazu adresem URL obrazu.

  Przykładowy kod HTML z adresem URL obrazu i grafem tworzenia skryptów wizualizacji przy użyciu interfejsu API LoadHTML i LoadHTMLAsset:

  <!DOCTYPE html><html lang="en"><head><meta charset="UTF-8"><meta name="viewport" content="width=device-width initial-scale=1.0"><title>Microsoft</title></head><body style="margin: 0; height: 100vh; overflow: hidden; background-color: black;"><img src="https://learn.microsoft.com/en-us/mesh/media/webview-developer-guide/ArcadeWebSlate.png" loading="lazy" style="width: 100%; height: 100%;"></body></html>

  

  

Wydajność

• Ponieważ usługa WebSlate jest załadowaną stroną internetową, ważne jest, aby wziąć pod uwagę implikacje dotyczące wydajności:

  • Sceny są zwykle wykonywane na 60fps z maksymalnie 10 aktywnymi webSlates. Spadek wydajności ramek i ogólny spadek wydajności można zaobserwować proporcjonalnie do liczby obiektów WebSlate umieszczonych w scenie, niezależnie od zawartości.

  • Zawartość jest ładowana i wykonywana w elemecie WebSlate w wątku oddzielonym od aktualizacji i renderowania wątków sceny i dlatego jest mało prawdopodobne, aby bezpośrednio wpływać na szybkość klatek. Jednak nadal ważne jest, aby rozważyć koszt języka JavaScript uruchomiony na stronie internetowej zarówno pod względem złożoności środowiska uruchomieniowego, jak i użycia pamięci.

  • Aby pomóc zaoszczędzić na wydajności, webSlates, które są wyłączone z ekranu dla ponad 30s są automatycznie zawieszone. Szybko wznawiają powrót na ekranie, ale może to mieć wpływ na aktywne uruchamianie usług na stronie hostowanej. Jeśli jest to problem, deweloperzy mogą wyłączyć zawieszenie przy użyciu pola wyboru "Zapobiegaj zawieszeniu". Należy pamiętać, że może to spowodować, że scena zużywa więcej zasobów, ponieważ te dane WebSlate pozostają aktywne przez cały czas.

  

• Ponieważ bloki WebSlate nie mają domyślnie żadnego zewnętrznego interfejsu użytkownika nawigacji, najlepszym rozwiązaniem jest ładowanie tylko niestandardowych adresów URL, gdzie nawigacja po witrynie jest cykliczna i można to zrobić wewnątrz strony. Można to zrobić za pomocą paska bocznego nawigacji lub linków do strony piasty, na przykład.

• Narzędzie Content Analizator wydajności (CPA) zawiera analizator WebSlate, który mierzy średni czas renderowania potoku renderowania aparatu Unity w celu renderowania obiektów WebSlate w ramce.

  • Pomiary są oparte na rejestratorze profilera aparatu Unity i wymagają trybu odtwarzania. Analizator przenosi kamerę nad każdym elementem WebSlate, aby zebrać wystarczające próbki profilera i oblicza średni czas renderowania.

  • Zapewnia to pierwszoetapową analizę czasu renderowania webSlate na wysokim poziomie w kontekście potoku renderowania aparatu Unity. Nie zapewnia szybkości ramek samej zawartości WebSlate.

  • Jeśli potok renderowania aparatu Unity przekracza próg renderowania obiektów WebSlate (obecnie 10 ms), narzędzie CPA wyświetla ostrzeżenie.

  • Te same pomiary są również dostępne dla profilera wydajności. Grupa w profilerze wydajności zwykle zmienia kolory z zielonego na czerwony, gdy dodatek budżetowy dla kategorii zostanie przekroczony. Na razie grupa WebSlate jest wyświetlana tylko jako zielona, dopóki rozsądny budżet czasu renderowania zostanie zracjonalizowany dla funkcji WebSlates.

  

Ograniczenia zabezpieczeń

• Adresy WebSlate są zablokowane na adresach URL, do których przechodzą, uniemożliwiając złośliwe przekierowania. Wszystkie niezamierzone nawigacje hiperlinków do domen zewnętrznych są blokowane, chyba że jawnie wymienione jako dozwolona domena (zobacz poniżej).

• Dane WebSlate są ograniczone do nawigacji w domenie początkowej lub przekierowaniach określonego adresu URL i serwera.

• Nawigacja w usłudze WebSlate jest ograniczona wyłącznie do protokołu HTTPS.

• Dostęp urządzenia do kamery internetowej, mikrofonu i geolokalizacji jest zablokowany.

Lista dozwolonych domen webSlate

Aby zapewnić bezpieczeństwo niezamierzonych wektorów ataków opartych na adresach URL, takich jak wyłudzenie informacji, webSlates domyślnie ograniczają nawigację do adresów URL, które znajdują się w domenie pierwszej strony załadowanej do usługi WebSlate. Na przykład uruchomiona https://www.microsoft.com/ aplikacja WebSlate będzie przechodzić tylko do stron, których adres URL zaczyna się od "www.microsoft.com". Dzięki temu użytkownicy nie będą przypadkowo odbiegać od zamierzonego przepływu nawigacji, ale może to być zbyt restrykcyjne ustawienie domyślne dla niektórych przypadków użycia, takich jak uwierzytelnianie użytkowników, podczas których mogą istnieć przekierowania do domen podrzędnych lub dostawców uwierzytelniania innych firm.

Sposobem uwzględnienia tych przypadków użycia jest dodanie domen do listy dozwolonych aplikacji WebSlate.

Automatyczne dodawanie domen (zalecane)

Podczas pracy z usługą WebSlates w edytorze aparatu Unity możesz włączyć opcję "Zbieranie dozwolonych domen". Spowoduje to usunięcie ograniczenia nawigacji domeny, aby można było swobodnie przechodzić w trybie odtwarzania w celu przetestowania scenariusza. Podczas przechodzenia w trybie odtwarzania usługa WebSlate rejestruje domeny, które odwiedzasz w tle.

W tym przypadku rozszerzamy nawigację z microsoft.com , aby również uwzględnić learn.microsoft.com.

Po wyjściu z trybu odtwarzania znajdziesz element zawartości o nazwie "WebViewAllowedDomains.asset" w folderze Assets najwyższego poziomu.

Kliknięcie tego zasobu spowoduje wyświetlenie listy dodatkowych domen, które odwiedziłeś poza domeną początkowego adresu URL. Możesz kliknąć prawym przyciskiem myszy, skopiować, a następnie wkleić wartości do pola "Dozwolone domeny" składnika WebSlate.

Uwaga

Ta opcja jest niemożliwa do włączenia w przekazanych scenach. Pozostawienie włączonej opcji "Zbieranie dozwolonych domen" nie spowoduje usunięcia ograniczenia w końcowej scenie. Jednak lista dozwolonych domen będzie utrwalana i będzie zezwalać na nawigację tak długo, jak domeny są dodawane do usługi WebSlate.

Ręczne dodawanie domen

Jeśli już wiesz, które domeny są potrzebne, możesz je ręcznie dodać do aplikacji WebSlate, rozwijając listę rozwijaną "Dozwolone domeny" i dodając domeny uzupełniające do listy w graficznym interfejsie użytkownika aparatu Unity.

Strumienie na żywo obsługiwane przez usługę WebSlate

Aby to osiągnąć, należy zintegrować usługę WebSlate Prefab w środowisku i podać adres URL transmisji strumieniowej na żywo. W przypadku, gdy adres URL transmisji strumieniowej na żywo nie jest dostępny wcześniej, możesz użyć usługi przekierowania adresu URL w celu wygenerowania adresu URL i podania go w usłudze WebSlate. Takie podejście zapewnia elastyczność aktualizowania adresu URL przekierowania w ostatniej chwili bez konieczności ponownego publikowania dużego środowiska przy użyciu adresu URL transmisji strumieniowej na żywo. Upewnij się, że podczas konfigurowania usługi WebSlate wybrano opcję "Zapobiegaj zawieszeniu", aby uniemożliwić jej wstrzymanie po 30 sekundach, jeśli ktoś nie wyświetla aktywnie bazy danych WebSlate. Funkcje WebSlate nie wymagają konfiguracji z narzędziami hosta, dlatego zdarzenia bez hosta można tworzyć i służyć jako miejsca do pełnienia funkcji drop-in z zrozumiałą zawartością.

Ograniczenia i znane problemy

Ogólne ograniczenia

• Usługa WebSlates jest obecnie obsługiwana w aplikacji Mesh na urządzeniach autonomicznych pc i quest. Dane WebSlate są dostępne tylko w wersji zapoznawczej w Redaktor aparatu Unity w systemie Windows.

• W usłudze WebSlates w wersji zapoznawczej Redaktor brakuje kilku funkcji wejściowych (dwukrotne kliknięcie, przeciąganie).

• Podczas oglądania z dystansu na Quest, czytelność jest niska.

• Dźwięk nie jest zlokalizowany przestrzennie.

• Synchronizacja zawartości internetowej jest ograniczona do aplikacji, które używają internetowych interfejsów API do synchronizowania zawartości.

Znane problemy

Zobacz sekcje WebSlate w artykule Dotyczącym znanych problemów z zestawem narzędzi usługi Mesh.

Opinie dotyczące zawartości sieci Web w usłudze Mesh

Kochamy opinie i raporty o błędach! Jeśli chcesz przekazać opinię, użyj przycisku Opinie w dowolnym środowisku usługi Mesh. Dzięki temu twoja opinia i raportowanie usterek zostaną szybko przejrzene i włączone. W przypadku opinii o usłudze WebSlate dołącz tekst "[zawartość internetowa]" lub wzmiankę o usłudze WebSlate w opinii.