WebView og Brugerdefinerede Faner: In-App Browsing

Har du nogensinde klikket på et link i din yndlingsapp – det kunne være Facebook, Twitter eller en nyhedsfeed – og undret dig over, hvorfor det åbnede i en underlig, begrænset browser i stedet for din sædvanlige Chrome- eller Safari-browser? Denne "in-app browser" er typisk en WebView. Selvom WebView er et kraftfuldt værktøj for app-udviklere til at integrere webindhold direkte i deres applikationer, kommer det ofte med en række ulemper for brugeren. Fra langsom indlæsning til manglende funktioner som gemte logindetaljer og browserhistorik, kan oplevelsen være frustrerende. Men der findes alternativer, som forbedrer denne oplevelse markant, især de såkaldte Brugerdefinerede Chrome-faner. Denne artikel vil dykke ned i, hvad WebView er, hvordan det fungerer, dets begrænsninger, og hvordan du kan få en bedre browsingoplevelse i dine apps, selv når udviklerne ikke vil ændre deres standardadfærd.

Hver Android-bruger har utvivlsomt interageret med en WebView, selvom de måske ikke ved, hvad det er. Når du for eksempel åbner et link fra Facebook, Twitter eller en hvilken som helst tredjepartsapp, åbnes det ofte ikke i din primære browser som Chrome, men i en lille, isoleret browser inde i selve appen. Dette er en WebView. Disse indbyggede browsere er typisk meget basale, begrænsede og ofte langsomme. De mangler mange af de funktioner, vi forventer fra en fuldgyldig browser. De husker for eksempel ikke dine logindetaljer til websites, dine cookies, din browserhistorik eller dine bogmærker. Det betyder, at hver gang du åbner et link til en side, du tidligere har besøgt, skal du logge ind igen eller navigere fra bunden. Desuden har hver in-app browser ofte en lidt forskellig brugerflade, hvilket gør det svært at finde standardknapper som 'del' eller 'tilbage'. Denne mangel på konsistens og funktionalitet kan forringe brugeroplevelsen betydeligt.

Problemet med standard WebViews

Problemerne med standard WebViews strækker sig ud over blot bekvemmelighed. Den forringede ydeevne er et stort irritationsmoment. Sider indlæses langsommere, og navigationen føles klodset. Da WebViews ikke deler data med din primære browser, betyder det en fragmenteret browsingoplevelse. Du kan ikke nemt fortsætte din browsing fra appen til din desktopbrowser eller omvendt. Fra et sikkerhedsperspektiv kan det også være bekymrende, at WebViews ofte kører i en isoleret sandkasse, hvilket forhindrer dem i at dele data. Selvom dette kan være en fordel for at beskytte appen mod ondsindet webindhold, betyder det også, at den brugervenlighed, vi forventer, går tabt. Google har forsøgt at løse dette problem ved at introducere en funktion kaldet 'Brugerdefinerede Chrome-faner' (eller Chrome Custom Tabs), som giver apps mulighed for at integrere en ægte, fuldt funktionel Chrome-fane som en in-app browser. Det er en fremragende idé, da det kombinerer bekvemmeligheden ved en in-app løsning med kraften og funktionerne fra Chrome. Problemet er dog, at giganter som Facebook og Twitter sjældent vælger at implementere dette. Årsagen er simpel: De ønsker at bevare fuld kontrol over den in-app browseroplevelse, for at holde brugerne inden for deres eget økosystem, selvom det går ud over brugeroplevelsen.

Introduktion til Brugerdefinerede Chrome-faner (Custom Chrome Tabs)

Hvad gør en teknologientusiast, når de store spillere ikke vil spille med? De tager sagen i egen hånd! Mød Chromer – et smart lille værktøj, der erstatter enhver apps "elendige" indbyggede browser med Chrome Custom Tabs. Forestil dig det: Hver gang du trykker på et link fra Facebook, åbner det nu i en velkendt, lynhurtig og fuldt ud funktionel brugerdefineret Chrome-fane. Det er en utrolig simpel, men effektiv løsning, der udnytter Androids fleksibilitet. Chrome Custom Tabs er ikke bare hurtigere; de bringer også mange af de funktioner, du elsker fra din almindelige Chrome-browser, direkte ind i app-oplevelsen. Dette inkluderer dine gemte logindetaljer, adgang til dine bogmærker og en mere konsistent brugerflade. Det føles mere som en naturlig udvidelse af din browseroplevelse i stedet for en helt separat og begrænset enhed. Fordi det er en ægte Chrome-fane, drager du også fordel af Chromes sikkerhedsfunktioner og løbende opdateringer. Det er en win-win situation for brugeren, der ønsker en mere strømlinet og effektiv browsingoplevelse i deres apps.

Sådan bruger du Chrome Custom Tabs overalt med Chromer

Når du har downloadet Chromer-appen fra Google Play Butik, er det tid til at gøre den til standard for åbning af links fra apps. Processen er ligetil:

1. Fra appens startskærm trykker du på 'Set default browser'.
2. Fra den menu, der vises, vælger du 'Chromer' og derefter 'Altid'.

Dette sikrer, at Chromer nu fanger alle linkklik, der normalt ville åbne i en standard WebView, og i stedet dirigerer dem til en Chrome Custom Tab. Under denne indstilling kan du også specificere en sekundær browser, hvis du ønsker en fallback-mulighed.

Chromer tilbyder også en række tilpasningsmuligheder under sektionen 'Personalization'. Her kan du ændre farven på værktøjslinjen i den brugerdefinerede fane, så den matcher appens tema, eller du kan tilpasse animationerne for en mere flydende overgang.

En virkelig cool funktion, som Chromer tilbyder, er automatisk forudindlæsning af indhold i baggrunden. Hvis du har ubegrænset data og ikke bekymrer dig om baggrundsaktivitet, er dette en funktion, du absolut bør slå til. Denne funktion scanner din skærm for links og forudindlæser dataene, så når du trykker på linket, er siden der øjeblikkeligt. Dette eliminerer ventetider og giver en utrolig hurtig og responsiv browsingoplevelse. Det er endnu et eksempel på, hvordan små apps kan levere store forbedringer til din daglige mobilbrug.

Alternativer til in-app browsere

Selvom Chromer og Chrome Custom Tabs tilbyder en markant forbedring, er de ikke de eneste alternativer, hvis du ikke bryder dig om traditionelle in-app browsere. Har du for eksempel hørt om pop-up browsere? Disse innovative browsere fungerer lidt ligesom Facebooks Chat Heads. Når du trykker på et link, åbner de i flydende vinduer, som du kan minimere og flytte rundt på skærmen, mens du fortsætter med at bruge din primære app. Populære eksempler inkluderer Flynx, Link Bubble og tilsvarende apps. Fordelen ved disse er, at de giver dig mulighed for at multitaske mere effektivt. Du kan starte indlæsningen af en webside i et flydende vindue og derefter skifte tilbage til din chat eller dit feed, mens siden indlæses i baggrunden. Når siden er klar, kan du nemt maksimere vinduet for at læse indholdet. Denne tilgang tilbyder en anden form for fleksibilitet og kan være ideel for dem, der ofte åbner mange links på kort tid og ønsker at holde deres hovedapp åben. Det handler om at finde den 'browser-hack', der passer bedst til din egen arbejdsgang og præferencer på mobilen.

Hvordan fungerer WebView teknisk?

For app-udviklere er WebView et fundamentalt element til at vise webindhold. Spørgsmålet om, hvorvidt WebView fungerer, hvis man klikker på et link inden for en WebView, er centralt. Svaret er ja, men ikke altid som forventet, medmindre udvikleren eksplicit konfigurerer det. Standardadfærden for et link klikket i en WebView er at forsøge at åbne linket ved hjælp af systemets standardbrowser (f.eks. Chrome eller Safari). For at tilsidesætte denne adfærd og holde linket inden for WebView-konteksten skal udvikleren opsætte en WebViewClient.

Forestil dig, at du har din WebView deklareret i din app. For at styre linkadfærden skal du tilknytte en WebViewClient. Dette er det første skridt. Derefter skal du definere din egen tilpassede WebViewClient, der overskriver shouldOverrideUrlLoading-metoden. Denne metode kaldes, når en ny URL er ved at blive indlæst. Udvikleren kan så bestemme, om WebView skal håndtere URL'en internt, eller om den skal sendes videre til den eksterne browser.

For eksempel, hvis URL'en matcher et specifikt domæne (f.eks. "www.example.com"), kan udvikleren instruere WebView i at indlæse linket internt. Hvis URL'en derimod ikke matcher, kan appen starte en ny handling for at åbne linket i den eksterne browser. Dette giver udviklere granular kontrol over, hvordan links håndteres, og sikrer, at brugerne får den tilsigtede oplevelse – enten forbliver de i appen, eller de sendes videre til en fuld browseroplevelse. Denne opsætning er afgørende for at skabe en sammenhængende og brugervenlig oplevelse, hvor appen kan styre, om webindholdet forbliver 'in-app' eller åbnes eksternt.

Interaktion med en WebView

Udover at håndtere linkklik er der mange måder at interagere med en WebView på og integrere eksternt webindhold sikkert i din app. Chrome-apps (og Android-apps generelt) kan vise eksternt webindhold direkte til brugeren, samtidig med at de bevarer det inden for app-oplevelsen. Dette er især nyttigt for apps som nyhedsaggregatorer, der ønsker at inkorporere artikler fra kildesider med al original formatering, billeder og adfærd. Til disse og andre formål har Chrome-apps et tilpasset HTML-tag kaldet <webview>.

Det er vigtigt at forstå, at WebViews kører i sandkasseprocesser. Dette betyder, at den Chrome-app, der indeholder den (også kendt som 'embedder-siden'), ikke nemt kan få adgang til det indlæste DOM i WebView. Du kan kun interagere med WebView via dens dedikerede API. Denne sandkasse-model forbedrer sikkerheden markant, da den isolerer potentielt skadeligt webindhold fra appens kernefunktionalitet.

For at implementere en WebView i en app skal du ofte først anmode om den nødvendige tilladelse i appens manifestfil. Derefter skal du oprette en HTML-side eller en layoutfil, der skal fungere som 'embedder-siden' for din WebView. Denne side indeholder blot et <webview>-tag (eller tilsvarende komponent i Android-layout), som vil indeholde det eksterne webindhold. Dynamisk kan du derefter styre, hvilket indhold der vises i denne WebView. For eksempel, i en app, der viser opgavelister, kan du parse URL'er i opgaveteksten og gøre dem til klikbare links. Når et link klikkes, i stedet for at åbne en standardbrowser, kan det åbne et nyt app-vindue med den specifikke WebView-side, og WebView'ens kildeattribut sættes til den klikkede URL. Denne metode giver en fuld kontrol over den visuelle præsentation og sikrer, at brugeren forbliver inden for app-oplevelsen, selv når eksternt webindhold vises. Det handler om at skabe en flydende og integreret brugeroplevelse, hvor webindhold føles som en naturlig del af appen.

Hvornår skal man bruge Custom Tabs versus WebView?

Spørgsmålet om, hvorvidt man skal bruge en Custom Tab eller en WebView, er et afgørende designvalg for app-udviklere, og det afhænger primært af indholdets ejerskab. WebViews er fremragende til problemfrit at integrere dit eget webindhold i din app. Forestil dig, at du har en app, der også har en 'Om os'-side eller en 'Ofte Stillede Spørgsmål'-sektion, som vedligeholdes som en webside. Det giver god mening at vise dette indhold i en WebView, da det føles som en naturlig del af din app, og du har fuld kontrol over indholdet og dets adfærd. Det giver en sømløs integration, hvor webindholdet fremstår som en del af den native app.

Men når dit kildeindhold inkluderer links til websites, som du ikke ejer – altså tredjepartsindhold – giver det langt mere mening at åbne disse i en Brugerdefineret Fane (Custom Tab) i stedet for en WebView. Dette har to væsentlige fordele:

1. Klar adskillelse af UX: Brugeroplevelsen for dit eget indhold er tydeligt adskilt fra brugeroplevelsen for tredjeparts webindhold. Dette forhindrer forvirring og sikrer, at brugeren forstår, hvornår de navigerer væk fra din apps kerneindhold.
2. Deling af cookies og browserdata: Tredjepartswebsites drager fordel af, at cookies, logindetaljer og browserhistorik deles med brugerens standardbrowser (f.eks. Chrome). Dette betyder, at hvis en bruger allerede er logget ind på en hjemmeside i Chrome, forbliver de logget ind, når de åbner den samme side via en Custom Tab i din app. Dette forbedrer brugeroplevelsen markant, da det eliminerer behovet for at logge ind gentagne gange og giver en mere personlig browsingoplevelse.

For at implementere dette kan udviklere konfigurere en brugerdefineret onLoadResource-handler i deres WebViewClient. Denne handler kan tjekke URL'en for hvert ressourceindlæsning og afgøre, om den skal indlæses i WebView'en (hvis det er appens eget indhold) eller startes i en Custom Tab (hvis det er eksternt tredjepartsindhold). Denne strategiske tilgang sikrer den bedste balance mellem app-integration og en optimeret weboplevelse for brugeren.

Sammenligningstabel: WebView vs. Custom Tabs

For at opsummere forskellene mellem en standard WebView og Chrome Custom Tabs, se nedenstående tabel:

Ofte Stillede Spørgsmål (FAQ)

Her er nogle ofte stillede spørgsmål om WebView og in-app browsere:

Hvad er Android System WebView, og skal jeg afinstallere det?

Android System WebView er en systemkomponent drevet af Chrome, der gør det muligt for Android-apps at vise webindhold. Det er en kritisk del af Android-operativsystemet og bør ikke afinstalleres, da mange apps er afhængige af det for at fungere korrekt. Hold det altid opdateret via Google Play Butik for at sikre optimal ydeevne og de seneste sikkerhedsrettelser.

Hvorfor bruger nogle apps stadig WebView i stedet for Custom Tabs?

Som nævnt tidligere ønsker store apps som Facebook og Twitter at bevare fuld kontrol over brugeroplevelsen inden for deres økosystem. Ved at bruge deres egen WebView kan de tilføje specifikke funktioner (f.eks. tilpassede delingsknapper eller analyseværktøjer) og holde brugerne inde i appen, selvom det går ud over den generelle browsingoplevelse.

Er WebView sikker at bruge?

Ja, WebView er designet til at køre i en sandkasse, hvilket isolerer webindholdet fra appens kerne. Dette forbedrer sikkerheden. Dog afhænger den overordnede sikkerhed også af, hvordan app-udvikleren implementerer og konfigurerer WebView. Det er altid vigtigt at holde både din Android System WebView og dine apps opdaterede for at få de seneste sikkerhedsrettelser.

Kan jeg tvinge alle links til at åbne i min standardbrowser?

Ja, med værktøjer som Chromer kan du tvinge de fleste links, der normalt ville åbne i en in-app WebView, til at åbne i en Custom Chrome Tab, som er en udvidelse af din standard Chrome-browser. For apps, der ikke understøtter Custom Tabs, kan du ofte i appens indstillinger finde en mulighed for at åbne links i en ekstern browser.

Hvad er fordelene ved pop-up browsere som Flynx?

Pop-up browsere giver dig mulighed for at åbne links i flydende vinduer, der kan minimeres. Dette er ideelt til multitasking, da du kan fortsætte med at bruge din primære app, mens websiden indlæses i baggrunden. De tilbyder en unik form for fleksibilitet sammenlignet med traditionelle in-app browsere eller fuldskærmsbrowsere.

Hvis du vil læse andre artikler, der ligner WebView og Brugerdefinerede Faner: In-App Browsing, kan du besøge kategorien Mobilteknologi.