Με εμπιστεύεσαι?
Για αρκετό καιρό τώρα οι εφαρμογές ιστού θα μπορούσαν να μετατραπούν σε εγγενή εφαρμογή με λίγη προσπάθεια, ανάλογα με την πολυπλοκότητα της εφαρμογής. Για παράδειγμα, πλαίσια όπως το Capacitor.js ή το Cordova προσφέρουν τέτοια λειτουργικότητα και είναι επίσης λογισμικό ανοιχτού κώδικα. Για να προσφέρετε μια εφαρμογή ιστού ως εγγενής, πρέπει να δημιουργήσετε την εφαρμογή ιστού τοπικά, να πείτε το πλαίσιο όπου βρίσκεται αυτή η έξοδος δημιουργίας και βασικά να περιμένετε μέχρι να δημιουργηθούν οι εφαρμογές. Η βασική ιδέα είναι ότι ο ιστότοπός σας λειτουργεί μόνο σε μια ενσωματωμένη προβολή ιστού. Λοιπόν, τα πράγματα πρόκειται να αλλάξουν τώρα για άλλη μια φορά εισάγοντας την "Έμπιστη δραστηριότητα Ιστού" από την Google.
PWA ++
Τι είναι η «Αξιόπιστη δραστηριότητα Ιστού» (TWA); Εδώ είναι η ουσία:
- Μια "Αξιόπιστη δραστηριότητα Ιστού" χρησιμοποιείται στο πλαίσιο του Google Play Store και μια εγγενής εφαρμογή Android που δημιουργείται από PWA
- Μπορείτε να επαληθεύσετε την ιδιοκτησία του PWA σας για την εφαρμογή Android δημιουργώντας μια πιστοποίηση που ονομάζεται "assetlinks" - εδώ είναι που απαιτείται το Google Play
- ανεβάζοντας αυτόν τον "σύνδεσμο περιουσιακών στοιχείων" - αρχείο στον δημόσιο κατάλογο της εφαρμογής ιστού σας, η Google μπορεί να επαληθεύσει την ιδιοκτησία του PWA όταν η εγγενής εφαρμογή Android λαμβάνει έτσι κανένας, αλλά μπορείτε να το δημιουργήσετε
Εντάξει, αυτή ήταν μια σύντομη επισκόπηση της ιδέας πίσω από το TWA. Για να ανακεφαλαιώσετε, το μέρος «εμπιστοσύνη» σχετίζεται με την επαλήθευση της ιδιοκτησίας του PWA σας.
Ένα νέο TWA, παρακαλώ!
Εντάξει, αλλά πώς λειτουργεί πραγματικά; Η ρύθμιση είναι πραγματικά απλή και δεν θα διαρκέσει περισσότερο από μία ώρα. Δείτε πώς γίνεται:
Πρώτα, βεβαιωθείτε ότι το PWA έχει ρυθμιστεί σωστά:
- Το manifest.json είναι διαθέσιμο και επικυρωμένο
- το εικονίδιο + το όνομα είναι σωστά
- μπορείτε να ελέγξετε αυτές τις αλλαγές γρήγορα στο DevTools
Η κύρια βιβλιοθήκη που θα αναλάβει όλη τη βαριά ανύψωση ονομάζεται "bubblewrap", ένα πακέτο Node.js που παρέχει ένα CLI, το οποίο θα χρησιμοποιηθεί καθ 'όλη τη διάρκεια του σεμιναρίου.
Αρχικά, δημιουργήστε έναν νέο κατάλογο για το TWA που ονομάζεται "twa". Στο εσωτερικό του "twa" θα δημιουργήσουμε έναν ακόμη κατάλογο που ονομάζεται "android". Το "twa" θα περιέχει το node_modules και το "android" την πραγματική εγγενή εφαρμογή Android.
Βεβαιωθείτε ότι βρίσκεστε τώρα στο "twa" για να ξεκινήσετε ένα νέο έργο npm:
npm init -y
Τώρα ας προσθέσουμε το CLI ως εξάρτηση απόκλισης:
npm i -D @bubblewrap/cli
Αυτό είναι το μόνο που χρειαζόμαστε τώρα. Ας ξεκινήσουμε τότε το έργο "bubblewrap". Απλώς αντικαταστήστε τον τομέα με τον δικό σας και ελέγξτε πού βρίσκεται το "manifest.json". Θα σας ζητηθεί οι τοποθεσίες Java SDK + Android SDK, τις οποίες μπορείτε να χρησιμοποιήσετε ξανά εάν είναι ήδη εγκατεστημένες:
npx bubblewrap init --manifest=https://your-pwa.com/manifest.json
Προχωρώντας, ήρθε η ώρα να εξετάσετε μερικές ερωτήσεις και απαντήσεις με το CLI "bubblewrap". Ανάλογα με τα διαθέσιμα μεταδεδομένα στο PWA σας, τα περισσότερα από τα πεδία θα έχουν ήδη προπληρωθεί:
npx bubblewrap build
Τώρα που αναγνωρίστηκε το PWA και δημιουργήθηκε η εφαρμογή Android, ήρθε η ώρα για μια γρήγορη δοκιμή καπνού. Ξεκινήστε έναν εξομοιωτή ή χρησιμοποιήστε την πραγματική συσκευή δοκιμής της επιλογής σας:
npx bubblewrap install
Εάν όλα λειτουργούν καλά, θα δείτε την εφαρμογή ιστού σας ως εγγενή εφαρμογή Android. Τέλεια, το πιο δύσκολο κομμάτι έχει ήδη γίνει!
Αυτό που απομένει είναι η δημιουργία του αρχείου επαλήθευσης που ονομάζεται "assetlinks.json". Καθώς υποθέτω ότι θέλετε να ανεβάσετε το πακέτο εφαρμογών στο Google Play, είναι σημαντικό να σημειώσετε πώς διαχειρίζεται πραγματικά η υπογραφή:
- Το Google Play θα διαχειρίζεται τα κλειδιά υπογραφής για εσάς, πράγμα που σημαίνει ότι πρέπει να αναζητήσουμε την αντίστοιχη τιμή SHA-256 στο Google Play Console
- Το "bubblewrap" ενδέχεται να έχει δημιουργήσει ένα αρχείο "assetlinks" - ήδη με μία καταχώριση, η οποία περιέχει διαφορετικό κατακερματισμό SHA-256 - μην ανησυχείτε, θα χρησιμοποιήσουμε και τα δύο κλειδιά από το Google Play και το δημιουργημένο
Εάν δεν έχει δημιουργηθεί κανένα αρχείο "assetlinks", ο τρόπος που προχώρησα ήταν να κατεβάσω το "Asset Links Tool" (συνιστάται από την Google, σύνδεσμος σε προσθήκη) στη συσκευή δοκιμής μου και να διαβάσω το SHA-256 από την εγκατεστημένη υπογεγραμμένη δοκιμαστική εφαρμογή που δημιουργήθηκε και εγκαταστάθηκε από το "bubblewrap". Αυτό το json μπορεί στη συνέχεια να χρησιμοποιηθεί από εσάς. Απλά φροντίστε να αντιγράψετε την πρώτη καταχώριση και να αντικαταστήσετε το SHA-256 με αυτό από το Google Play, με αποτέλεσμα ένα αρχείο "assetlinks" με 2 καταχωρίσεις, που διαφέρουν μόνο στα κλειδιά υπογραφής τους.
Σχεδόν τελείωσε, τώρα πρέπει απλώς να δημιουργήσετε έναν νέο κατάλογο στον υπάρχοντα δημόσιο φάκελο του PWA και να ανεβάσετε την εφαρμογή μία φορά:
.well-known/assetlinks.json
Τώρα η Google μπορεί να το διαβάσει και να επαληθεύσει την ιδιοκτησία.
Ένα… περισσότερα… βήμα…
Το μόνο που μένει τώρα είναι να ανεβάσετε το πακέτο κυκλοφορίας στο Google Play και να το απελευθερώσετε! Ναι, είναι πραγματικά τόσο απλό. Η Google προωθεί ό, τι είναι δυνατό στον ιστό και δεν φοβάται να δοκιμάσει νέα πράγματα. Η "Αξιόπιστη Δραστηριότητα Ιστού" είναι ένας νέος τρόπος να γεφυρωθεί ακόμη περισσότερο το χάσμα μεταξύ ιστού και εγγενών, αν και προς το παρόν περιορίζεται στο Android.
Ω, και ναι: φυσικά αυτή η εφαρμογή ιστού είναι PWA και TWA. Μπορείτε να δείτε την εφαρμογή Android στο Google Play, ο σύνδεσμος βρίσκεται παρακάτω στο προσάρτημα.
- Tom
