Visa och interagera med webbinnehåll

Använd WebSlate för att visa interaktivt webbinnehåll i din 3D Mesh-miljö. Få en fullständig surfupplevelse på PC eller Quest 2 med intuitiva indata, anpassningsbarhet, säkerhet och prestandahantering.

Du kan använda WebSlates för:

• Interagera med kartor, diagram och data

• Visa instrumentpaneler, webbsidor, foton och videor

• Visa innehåll som visar produkter och tjänster, kundberättelser och varumärkesidentitet

WebSlate-funktioner

• Ange en standard-URL: Välj din plats, dra och släpp prefab och lägg sedan till en URL. Upprepa om du vill ha flera WebSlates i din scen.

• In- och ljudinbyggt: Slutanvändares webbnavigering, interaktion med appar och visning av videor blir tillgängliga i Mesh.

• Säker navigering: Lås omdirigerings-URL:er för att förhindra skadliga omdirigeringar och oavsiktliga hyperlänknavigeringar.

• Visuell anpassning: Ändra kvalitet för att optimera för användarnas enheter. Locka användare på avstånd med lätt att visa innehåll.

• Skriptbar: Med visuella skript och molnskript kan du aktivera växling mellan sidor med en knapp.

• Integrering av innehåll Analizator performansi verktyg: Mät den genomsnittliga tid det tar för URP att återge WebSlates i en ram och hitta problem med innehållsinläsning.

• Testning i uppspelningsläge med Mesh-emulering: Interagera med ditt innehåll som en användare skulle göra direkt från Unity-redigeraren.

• Autentisera in-experience manuellt: Få åtkomst till säkert innehåll inifrån upplevelsen genom att logga in på ditt konto och visa innehåll vid körning.

Så här fungerar WebSlate

Om du har konfigurerat ett Unity-projekt för att skapa Mesh-miljöer är det enkelt att lägga till en WebSlate i din miljö.

I Mesh läser WebSlate in en interaktiv sida via en angivet URL. Url:en som ges till den i miljön kommer att vara samma som den som läses in i Mesh. I Mesh-verktygslådan innehåller WebSlate-prefab en URL-parameter som utvecklare kan ange för att styra innehållet som visas i meshmiljön.

• När de läses in i Mesh-appen för PC och Quest kan webbsidor som läses in av en WebSlate interagera via mus, tangentbord och Quest XR-styrenhetsindata.

• Storleken och formen på WebSlate matchar storleken på den quad GameObject som den är placerad på. Detta är vanligtvis den quad som bakas inuti WebSlate-prefab.

• Flera WebSlates kan läggas till i en scen. Antalet användare i din Mesh-miljö påverkar inte WebSlate-prestanda. WebSlate-resurser initieras lokalt på användarens dator.

• WebSlates kan konfigureras med visuella skript eller molnskript för att lägga till interaktiva beteenden och synkronisering mellan användare.

• WebSlate kan visa webbsidor och stöder interaktion men fungerar inte som en webbläsare och stöder inte bokmärke, historik eller resor fram och tillbaka.

• Du kan förhandsgranska din WebSlate i Unity-projektet innan du laddar upp scenen till Mesh genom att trycka på Spela upp.

Krav/beroenden

WebSlate är beroende av Unity.InputSystem - och Unity.XR.Interaction.Toolkit Unity-paketen som finns i Mesh-verktygslådan.

Lägga till en WebSlate-prefab i ditt Unity-projekt

Det finns två varianter av WebSlate-prefabs i Mesh-verktygslådan som du kan lägga till i din scen. Om du föredrar en ren WebSlate utan extra komponenter lägger du till WebSlate-prefab. Om du vill ha en WebSlate som finns i en stiliserad ram med extra funktioner lägger du till webSlateFramed-prefab .

Lägg till WebSlate-prefab från en meny

Så här lägger du till någon av prefaberna i din scen:

1. Högerklicka i hierarkin och gör sedan något av följande i snabbmenyn:

   Så här lägger du till den rena WebSlate utan extra komponenter:
   Välj Mesh Toolkit>WebSlate.

   Så här lägger du till WebSlate med den stiliserade ramen och extra funktioner:
   Välj Mesh Toolkit>WebSlateFramed.

2. Lägg till en URL till WebSlate för att visa innehåll.

   Tips: Du kan också klicka på knappen "+" längst upp till vänster i hierarkifönstret för att se samma meny.

   

   

Sök efter och lägg till WebSlate-prefab

Du kan också söka efter och lägga till en WebSlate-prefab.

1. I fältet Sök skriver du "WebSlate". Kontrollera att filtret Alla är markerat.

   

2. Dra den prefab som du vill ha till scenvyn eller hierarkin.

   

3. I Inspector navigerar du till WebSlate-komponenten och lägger sedan till den URL som du vill visa på WebSlate:

   

Kontrollera att WebSlate är läsbart

Det är viktigt att se till att alla deltagare i en Mesh-upplevelse kan läsa allt innehåll på en WebSlate bekvämt. Vi rekommenderar att du skapar en tom golvyta framför en WebSlate så att deltagarna kan komma närmare den och justera sin position för en bättre vy. Om din upplevelse innehåller platser kan du visa WebSlate från varje plats för att se till att en deltagare som sitter på den platsen kan läsa texten på WebSlate. Om du har kontroll över innehållet som ska visas på en WebSlate experimenterar du med olika teckenstorlekar för texten för att fastställa den optimala storleken för visning. I exempelupplevelsen nedan är "Microsoft Teams"-texten i mitten av WebSlate mer än tillräckligt stor för bekväm visning, men den mycket mindre texten i hörnen är svår att läsa. I den här typen av scenario skulle du inte ha kontroll över texten i den strömmande videon, så du bör överväga att flytta platserna närmare. Dessutom kommer säten som är mer centrerade och tittar rakt på WebSlate att ge en bättre utsikt än platser som är av till sidorna.

Förhandsgranska WebSlate i uppspelningsläge med mesh-emulering

Om du vill visa en URL som visas i WebSlate snabbare kan du använda Uppspelningsläge med Mesh-emulering. Förutom att testa i det här läget är det enda andra sättet att se din WebSlate att ladda upp den med mesh toolkit Uploader och visa den i en Mesh-upplevelse.

Om du vill lägga till Uppspelningsläge med Mesh-emulering i projektet följer du anvisningarna i meshemulatorns artikel.

Så här visar du webbsidan i WebSlate:
Tryck på knappen Spela upp i Unity-redigeraren.

Aktivera WebSlate-interaktion för uppspelningsläge med mesh-emulering

Om du vill aktivera interaktion i WebSlate måste du konfigurera några saker.

1. Lägg till Mesh-emulatorn i din scen för att aktivera uppspelningsläge med Mesh-emulering.

2. Skapa ett nytt Plan GameObject. Det här är ditt golv. Kontrollera att GameObject är placerad vid ursprunget (0,0,0):

   

3. Placera WebSlate så att den sitter framför MeshEmulatorSetup-tecknet :

   

4. Klicka på knappen Spela upp och dubbelklicka sedan för att interagera med webbsidan som visas i WebSlate:

   

Bra jobbat! Du har lagt till en anpassad WebSlate i Unity-scenen och testat interaktionen i uppspelningsläge med Mesh-emulering.

Nu är du redo att ladda upp miljön till Mesh och dela ditt skapande med världen!

WebSlate i visualiseringsskript

Med visualiseringsskript kan utvecklare implementera WebSlate-funktioner och beteende utan att behöva skriva kod. I stället tillhandahålls ett nodbaserat visuellt gränssnitt som gör det möjligt för användare att definiera och ansluta olika åtgärder och händelser i en scen. Vissa utvecklare tycker att detta kan förenkla processen med att lägga till interaktivitet och beteende.

Om du vill aktivera visuella skript med WebSlate måste du konfigurera några saker.

1. Gå till Redigera>projektinställningar.

2. I listan till vänster väljer du Visuellt skript.

   

3. Expandera Nodbibliotek. Då visas sammansättningslistan.

4. Längst ned i listan med sammansättningar till höger klickar du på knappen Lägg till (+). Detta lägger till ett nytt objekt i listan som visar "(Ingen sammansättning)".

5. Klicka på den nya sammansättningsposten och skriv sedan "Webslate" i fältet Sök. Detta begränsar listan till Microsoft.Mesh.WebSlate. Välj det här objektet om du vill lägga till det i sammansättningslistan.

   

   Visual Scripting lägger till Microsoft.Mesh.WebSlate och dess noder i Nodbiblioteket. Om du vill använda noderna i projektet väljer du knappen Återskapa noder .

   

   Läs in URL

   Utvecklare kan nu dynamiskt ändra webbinnehåll i realtid genom att läsa in nya URL:er via Visual Scripting. Den här funktionen breddar omfånget för olika program, inklusive att ändra webbinnehåll baserat på användarinställningar eller uppdatera det som svar på realtidsdata.

   

   Läsa in HTML-innehåll

   Med den här nya funktionen i WebSlate kan utvecklare släppa HTML-filer som TextAssets till Unity-scenen med låg ansträngning. Den här integreringen förenklar inte bara arbetsflödet utan möjliggör även omedelbar feedback i Unity Play Mode, vilket förbättrar redigering och felsökning i realtid. Dessutom har den stöd för dynamisk innehållsväxling, vilket ger flexibilitet och en mer interaktiv användarupplevelse.

   

   Skapa ny eller återanvänd befintlig HTML för att visa/interagera i din Mesh-miljö: Om du inte vill vara värd för HTML-innehåll eller om du har säkra offlinefiler kan du lägga till HTML på plats och inkludera det som en del av tillgången i din scen.

   Dynamisk inläsning vid körning: Genom att läsa in HTML från filer kan utvecklare göra ändringar i realtid med hjälp av visuella skript. Den här dynamiska funktionen förbättrar användarupplevelsen.

   Snabbfeedbacksloop i Unity Play-läge: När HTML-innehållet läses in från filer kan utvecklare omedelbart se effekterna av sina ändringar i Unity Play Mode.

WebSlate i molnskript

Utvecklare kan också lägga till en WebSlate i Miljöer med hjälp av Mesh-molnskript. Det innebär att en WebSlate kan navigeras av ett Mesh-molnskript och sedan synkroniseras mellan användare. Du kan till exempel skapa ett Mesh-molnskript som innehåller en WebSlate-nod och en eller flera interagerande noder. Sedan kan du konfigurera din InteractableNodes klickhändelsehanterare för att navigera WebSlate till en annan URL. Genom att lägga till ett Mesh-molnskript tillsammans med WebSlate kan användarna uppdatera WebSlate-innehållet interaktivt.

Mer information om noden WebSlate i Mesh Apps finns i Översikt över visuella skript.

Allmänna tips

• Du kan placera en WebSlate på Andra GameObjects än en Quad genom att lägga till WebSlate.cs som en skriptkomponent direkt till ditt 3D-objekt och lägga till UnlitWebSlate.mat i MeshRenderer Materials. Observera att detta kan leda till att den visuella strukturen sträcker sig, blir inversion och/eller rotation.

• En WebSlate läser in en standard-URL. Du bör ersätta den här URL:en med en som du föredrar för varje WebSlate som används. Parametern ljusstyrka är inställd på 1,0 (100 % av webbläsarens ljusstyrka).

• WebSlates pausar sig automatiskt efter att ha varit utanför skärmen för länge. Om du behöver se till att en viss skiffer alltid körs (till exempel en livestream eller kontinuerlig ljuduppspelning) kontrollerar du knappen "Förhindra avstängning" på associationen WebSlate. Se nedan för prestandakonsekvenser.

• Om du vill storleksanpassa bild-URL:en till storleken på WebSlate omsluter du URL:en i HTML. Använd WebSlate LoadHTML-API:et via visuella skript för att återge HTML-innehållet på din WebSlate. Lägg till den konstruerade HTML-koden i egenskapen HTMLContent. Du kan också använda LoadHTMAsset-API:et och skicka HTML som en tillgång. Ersätt bild-URL:en med din bild-URL.

  Exempel på HTML med bild-URL:en och visualiseringsskriptdiagrammet med hjälp av API:et LoadHTML och 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>

  

  

Prestanda

• Eftersom en WebSlate är en inläst webbsida är det viktigt att tänka på prestandakonsekvenser:

  • Scener utförs vanligtvis på 60fps med upp till 10 aktiva WebSlates. Framerate och allmän prestandaförsämring kan observeras i förhållande till antalet WebSlates som placeras i en scen, oavsett innehåll.

  • Innehållet läses in och körs i WebSlate på en tråd som är separat från scenens uppdaterings- och återgivningstrådar, och det är därför osannolikt att det påverkar bildrutefrekvensen direkt. Det är dock fortfarande viktigt att tänka på kostnaden för JavaScript som körs på en webbsida både när det gäller körningskomplexitet och minnesanvändning.

  • För att spara på prestanda pausas WebSlates som är utanför skärmen för över 30-talet automatiskt. De återupptas snabbt när de kommer tillbaka på skärmen, men detta kan påverka tjänster som körs aktivt på den värdbaserade sidan. Om det här är ett problem kan utvecklare inaktivera avstängning med kryssrutan "Förhindra avstängning". Observera att detta kan leda till att scenen förbrukar fler resurser eftersom dessa WebSlates alltid är aktiva.

  

• Eftersom WebSlates inte har något externt navigeringsgränssnitt som standard är det bästa sättet att bara läsa in anpassade URL:er, där webbplatsnavigeringen är cyklisk och kan göras på sidan. Detta kan göras med ett sidofält i navigeringsfältet eller länkar till en hubbsida, till exempel.

• Verktyget Content Analizator performansi (CPA) innehåller en WebSlate-analysator som mäter den genomsnittliga tid det tar för Unitys återgivningspipeline att återge WebSlates i en ram.

  • Mätningarna baseras på Unitys profilerare och kräver uppspelningsläge. Analysatorn flyttar kameran över varje WebSlate för att samla in tillräckligt många profilerarexempel och beräknar den genomsnittliga återgivningstiden.

  • Detta ger en analys på den första nivån av WebSlate-återgivningstider i kontexten för Unitys återgivningspipeline. Den tillhandahåller inte bildhastigheten för själva WebSlate-innehållet.

  • Om Unitys återgivningspipeline överskrider tröskelvärdet för att återge WebSlates (för närvarande 10 ms) ger CPA-verktyget en varning.

  • Samma mått är också tillgängliga för Prestandaprofiler. Gruppen på Prestandaprofiler ändrar vanligtvis färger från grönt till rött när budgetbidraget för en kategori överskrids. För tillfället visas WebSlate-gruppen bara som grön tills en rimlig budget för återgivningstid rationaliseras för WebSlates.

  

Säkerhetsbegränsningar

• WebSlates är låsta till de URL:er som de navigerar till, vilket förhindrar skadliga omdirigeringar. Alla oavsiktliga hyperlänknavigeringar till externa domäner blockeras, såvida de inte uttryckligen anges som en tillåten domän (se nedan).

• WebSlates är begränsade till navigering inom den ursprungliga domänen eller de angivna URL:erna och serverns omdirigeringar.

• Navigeringen i en WebSlate är exklusivt begränsad till HTTPS.

• Enhetsåtkomst till webbkamera, mikrofon och geoplats blockeras.

Lista över tillåtna webslate-domäner

För att säkerställa säkerhet mot oavsiktliga URL-baserade attackvektorer, till exempel nätfiske, begränsar WebSlates som standard navigeringen till URL:erna som ingår under domänen för den första sidan som läses in i WebSlate. Till exempel navigerar en WebSlate som startas på https://www.microsoft.com/ endast till sidor vars URL börjar med "www.microsoft.com". Även om detta säkerställer att användarna inte oavsiktligt avviker från det avsedda navigeringsflödet, kan det vara en alltför restriktiv standard för vissa användningsfall, till exempel användarautentisering, under vilka det kan finnas omdirigeringar till underdomäner eller tredjepartsautentiseringsproviders.

Sättet att hantera dessa användningsfall är genom att lägga till domäner i WebSlates lista över tillåtna.

Lägg automatiskt till domäner (rekommenderas)

När du arbetar med WebSlates i Unity-redigeraren har du möjlighet att aktivera "Samla in tillåtna domäner". Detta tar bort begränsningen för domännavigering så att du kan navigera fritt när du kör i Uppspelningsläge för att testa ditt scenario. När du navigerar i Uppspelningsläge loggar WebSlate de domäner som du besöker i bakgrunden.

I det här fallet utökar vi navigeringen från microsoft.com till att även inkludera learn.microsoft.com.

När du avslutar uppspelningsläget hittar du en tillgång med namnet "WebViewAllowedDomains.asset" i mappen Tillgångar på den översta nivån.

Om du klickar på den här tillgången får du en lista över extra domäner som du har besökt utanför domänen för din ursprungliga URL. Du kan högerklicka, kopiera och sedan klistra in värdena i fältet Tillåtna domäner i WebSlate-komponenten.

Kommentar

Det här alternativet är omöjligt att aktivera i uppladdade scener. Om du lämnar "Samla in tillåtna domäner" aktiverat tas inte begränsningen bort i slutscenen. Listan över tillåtna domäner bevaras dock och tillåter navigering så länge domänerna läggs till i WebSlate.

Lägga till domäner manuellt

Om du redan vet vilka domäner du behöver kan du manuellt lägga till dem i WebSlate genom att expandera listrutan "Tillåtna domäner" och lägga till dina kompletterande domäner i listan i Unity-gränssnittet.

Liveströmmar som drivs av WebSlate

Det gör du genom att integrera WebSlate Prefab i din miljö och ange livestream-URL:en. Om livestream-URL:en inte är tillgänglig i förväg kan du använda en URL-omdirigeringstjänst för att generera en URL och tillhandahålla den till WebSlate. Den här metoden ger flexibiliteten att uppdatera omdirigerings-URL:en i sista stund utan att behöva publicera den stora miljön igen med livestream-URL:en. Se till att du väljer alternativet Förhindra avstängning under WebSlate-installationen för att förhindra att den pausas efter 30 sekunder om någon inte aktivt visar WebSlate. WebSlates kräver inte konfiguration med värdverktygen, så värdlösa händelser kan skapas och fungera som drop-in-blanksteg med meningsfullt innehåll.

Begränsningar och kända problem

Allmänna begränsningar

• WebSlates stöds för närvarande i Mesh-programmet på fristående datorer och Quest-enheter. WebSlates är endast tillgängliga för förhandsversion i Unity-redigeraren i Windows.

• WebSlates i redigerarens förhandsversion saknar några indatafunktioner (dubbelklicka, dra).

• När du tittar på avstånd på Quest är läsbarheten låg.

• Ljud är inte rumsligt lokaliserat.

• Webbinnehållssynkronisering är begränsat till program som använder webb-API:er för att synkronisera innehåll.

Kända problem

Se avsnittet WebSlate i artikeln Om kända problem med Mesh-verktyg.

Feedback för webbinnehåll i Mesh

Vi älskar feedback och buggrapporter! Om du vill ge feedback använder du knappen Feedback i valfri Mesh-upplevelse. Detta säkerställer att din feedback och felrapportering granskas och införlivas snabbt. För WebSlate-feedback inkluderar du "[webbinnehåll]" eller ett omnämnande av WebSlate i din feedback.