Yüklü PWA'ların, daha entegre bir deneyim için belirli bir protokol kullanan bağlantıları yönetmesine izin verin.
Şemalarla (protokol olarak da bilinir) ilgili arka plan bilgileri
Tekdüzen Kaynak Tanımlayıcısı (URI), bir soyut ya da fiziksel kaynak olabilir. Her URI şema adı bu şemadaki tanımlayıcıları atamak. Bu nedenle, URI söz dizimi birleşik ve genişletilebilir her şemanın spesifikasyonunun söz dizimini ve anlamını daha da kısıtlayabileceği bir adlandırma sistemi bu şemayı kullanan tanımlayıcılar. Şemalar, protokoller olarak da bilinir. Şunlara ilişkin bazı örnekler görebilirsiniz: daha fazla bilgi edineceksiniz.
tel:+1-816-555-1212
mailto:Jane.Doe@example.com
news:comp.infosystems.www.servers.unix
https://web.dev/
Tekdüzen Kaynak Konum Belirleyicisi (URL) terimi, bir kaynağı tanımlama, birincil erişimini açıklayarak kaynağın yerinin belirlenmesi için bir yöntem sağlama mekanizmasını (ör. ağ konumu) kontrol eder.
registerProtocolHandler()
yönteminin arka planı
Yalnızca güvenli içerik Navigator
yöntemi
registerProtocolHandler()
sitelerin, belirli URL şemalarını açma veya işleme yeteneklerini kaydetmesine olanak tanır. Bu nedenle, sitelerin
yöntemi şu şekilde çağırın: navigator.registerProtocolHandler(scheme, url)
. Bu iki parametre
şu şekilde tanımlanır:
scheme
: Sitenin işlemek istediği protokolü içeren bir dize.url
: İşleyicinin URL'sini içeren bir dize. Bu URL, yer tutucu olarak%s
ifadesini içermelidir çıkış karakterli URL ile değiştirilecek.
Şema, şunlardan biri olmalıdır:
güvenli listeye eklenmiş şemalar
(örneğin, mailto
, bitcoin
veya magnet
) ya da web+
ile başlayıp en az bir veya
web+
ön ekinden sonra daha küçük ASCII harfleri kullanılabilir. Örneğin, web+coffee
.
Bu durumu daha anlaşılır kılmak için akışla ilgili somut bir örnek verelim:
- Kullanıcı,
https://coffeeshop.example.com/
adresinde aşağıdaki çağrıyı yapan bir siteyi ziyaret eder:navigator.registerProtocolHandler('web+coffee', 'coffee?type=%s')
. - Daha sonra
https://randomsite.example.com/
ziyaret edilirken kullanıcı bir bağlantıyı tıklar (ör.<a href="web+coffee:latte-macchiato">All about latte macchiato</a>
). - Bu, tarayıcının aşağıdaki URL'ye gitmesine neden olur:
https://coffeeshop.example.com/coffee?type=web%2Bcoffee%3A%2F%2Flatte-macchiato
Arama URL'nin kodu çözülmüş dizesi ve?type=web+coffee://latte-macchiato
değeri okunur.
Protokol işleme konusu
Mevcut PWA'lar için URL protokol işleyici kaydı mekanizması, protokol işleyici sunmakla ilgilidir.
manifesti aracılığıyla PWA kurulumunun bir parçası olarak kabul edildi. PWA'yı
protokol işleyici; kullanıcı mailto
gibi belirli bir şemaya sahip bir köprüyü tıkladığında
bitcoin
veya bir tarayıcıdan ya da platforma özgü bir uygulamadan web+music
ayarlanırsa kayıtlı PWA açılır
ve URL'yi alır. Hem önerilen manifest tabanlı kaydın hem de
geleneksel registerProtocolHandler()
pratikte çok benzer roller oynar.
kullanıcılara yönelik aşağıdaki olanaklardan bahsedeceğiz:
- Benzerlikler arasında, kaydedilmesine izin verilen şemaların listesiyle ilgili şartlar ve parametrelerin adı ve biçimi vb.
- Manifest temelli kayıttaki farklar çok göze çarpmasa da deneyim sahibi olacaksınız. Örneğin, manifest tabanlı PWA kaydı kullanıcı tarafından başlatılan PWA yüklemesi dışında ek kullanıcı işlemi.
Kullanım alanları
- Kelime işlemci PWA'da, dokümandaki kullanıcı şuna benzer bir sunuya giden bir bağlantıyla karşılaşır:
web+presentations://deck2378465
Kullanıcı bağlantıyı tıkladığında, PWA (Progresif Web Uygulaması) sunusu otomatik olarak doğru kapsamda açılır ve slayt kümesini gösterir. - Platforma özel bir sohbet uygulamasında, sohbet mesajındaki kullanıcı
magnet
URL'sinin bağlantısını alır. Bağlantıyı tıkladığınızda, yüklü bir torrent PWA açılır ve indirme işlemi başlar. - Kullanıcıda müzik akışı PWA'sı yüklü olmalıdır. Bir arkadaşınız aşağıdaki gibi bir şarkının bağlantısını paylaştığında
web+music://songid=1234&time=0:13
ve kullanıcı tıkladığında müzik akışı PWA'sı otomatik olarak bağımsız bir pencerede başlatılır.
PWA'lar için URL protokol işleyici kaydını kullanma
URL protokol işleyici kaydı için API,
navigator.registerProtocolHandler()
Tam bu sefer bilgi, üzerinden beyanlı olarak aktarılıyor
web uygulaması manifest'ini "protocol_handlers"
adlı yeni bir mülkte düzenleyebilirsiniz.
nesneler ("protocol"
ve "url"
) gerekiyor. Aşağıdaki kod snippet'i,
web+tea
ve web+coffee
için kaydolun. Değerler,
çıkış karakterli URL için gerekli %s
yer tutucusu.
{
"protocol_handlers": [
{
"protocol": "web+tea",
"url": "/tea?type=%s"
},
{
"protocol": "web+coffee",
"url": "/coffee?type=%s"
}
]
}
Aynı protokol için kaydettirilen birden fazla uygulama
Birden fazla uygulama kendilerini aynı şema için işleyici olarak kaydederse (örneğin,
mailto
protokolü kullanılacaksa işletim sistemi, kullanıcıya bir seçici gösterir ve hangi
kayıtlı işleyicileri ekleyin.
Aynı uygulama birden fazla protokol için kaydoluyor
Yukarıdaki kod örneğinde görebileceğiniz gibi, aynı uygulama kendisini birden çok protokol için kaydedebilir.
Uygulama güncellemeleri ve işleyici kaydı
İşleyici kayıtları, uygulama tarafından sağlanan en son manifest sürümüyle senkronize edilir. Orada iki durum vardır:
- Yeni işleyiciler ekleyen bir güncelleme, işleyici kaydını tetikler (uygulama yüklemesinden ayrı).
- İşleyicileri kaldıran bir güncelleme, işleyici kaydının iptal edilmesini tetikler (uygulamadan ayrı olarak) kaldırma).
Geliştirici Araçları'nda protokol işleyici hata ayıklaması
Application (Uygulama) > üzerinden Protokol İşleyicileri (Protokol İşleyicileri) bölümüne gidin Manifest bölmesini açın. Şunları yapabilirsiniz: mevcut tüm protokolleri buradan görüntüleyip test edebilirsiniz.
Örneğin, bu demo PWA'yı yükleyin. Protokol İşleyicileri bölümü, "americano" yazın ve kahve sayfasını açmak için Protokolü test et'i tıklayın göz atabilirsiniz.
Demo
Glitch'te PWA'lar için URL protokol işleyici kaydının demosunu görebilirsiniz.
- https://protocol-handler.glitch.me/ adresine gidip
PWA'ya yükleyin ve yükleme işleminden sonra uygulamayı yeniden yükleyin. Tarayıcı PWA'yı
işleyicisi tarafından yürütülür.
web+coffee
- Yüklü PWA penceresinde bağlantıyı tıklayın
https://protocol-handler-link.glitch.me/. Bu,
üç bağlantı bulunan yeni bir tarayıcı sekmesi açın. Birinci veya ikinciyi (latte macchiato veya
americano) Tarayıcı şimdi size bir istem gösterecek ve uygulamanın uygun olup olmadığını soracaktır.
web+coffee
protokolü için protokol işleyicisi. Kabul ederseniz PWA açılır ve seçildi. navigator.registerProtocolHandler()
kullanılan geleneksel akışla karşılaştırmak için PWA'daki Protokol işleyiciyi kaydet düğmesi. Daha sonra, tarayıcı sekmesinde üçüncü bağlantıyı tıklayın (çai) tuşlarına basın. Benzer şekilde bir istem gösterilir ancak PWA'yı tarayıcı penceresinde değil, bir sekmede açar.- Windows'da Skype gibi platforma özgü bir uygulamada kendinize
<a href="web+coffee://americano">Americano</a>
ve tıklayın. Aynı şekilde PWA'yı yükleyebilirsiniz.
Güvenlikle ilgili olarak göz önünde bulundurulması gerekenler
PWA yüklemesi bağlamın güvenli olmasını gerektirdiğinden, protokol işleme bunu devralır kısıtlayın. Kayıtlı protokol işleyicilerin listesi hiçbir şekilde web'e sunulmaz. Dolayısıyla dijital parmak izi vektörü olarak kullanılamaz.
Kullanıcı tarafından başlatılmayan gezinme denemeleri
Kullanıcı tarafından başlatılmayan, ancak programatik olan gezinme denemeleri açılmayabilir Özel protokol URL'si yalnızca üst düzey tarama bağlamlarında kullanılabilir, örneğin kullanabilirsiniz.
İzin verilen protokoller listesi
registerProtocolHandler()
ürününde olduğu gibi, uygulamaların kaydedebileceği protokollerin bir izin verilenler listesi vardır
pek çok yolu vardır.
İzin istemi
Çağrılan bir protokol nedeniyle PWA'nın ilk başlatılmasında, kullanıcıya izin iletişim kutusu. Bu iletişim kutusunda, uygulama adı ile uygulamanın kaynağı görüntülenir ve kullanıcıya Uygulamanın protokolden bağlantıları işlemesine izin verilir. Bir kullanıcı izin iletişim kutusunu reddederse kayıtlı protokol işleyici, işletim sistemi tarafından yoksayılır. Protokolün kaydını iptal etmek için işleyicisi tarafından kaydettirilen PWA'nın kaldırılması gerekir. Tarayıcı, kaydı da iptal eder. kullanıcı "Seçimimi hatırla"yı seçerse protokol işleyici ve "İzin verme"yi seçer.
Geri bildirim
Chromium ekibi, şunun için URL protokol işleyici kaydıyla ilgili deneyimlerinizi öğrenmek istiyor: PWA'lar.
Bize API tasarımı hakkında bilgi verin
API'de beklediğiniz gibi çalışmayan bir şeyler mi var? Veya eksik yöntemler mi var? gereken özellikler veya özellikler neler olabilir? Menkul kıymetle ilgili bir sorunuz veya yorumunuz varsa modeli nedir? İlgili GitHub deposunda bir spesifikasyon sorunu bildirin veya düşüncelerinizi neden olabilir.
Uygulamayla ilgili bir sorunu bildirin
Chromium'un uygulanmasıyla ilgili bir hata buldunuz mu? Yoksa uygulama, spesifikasyondan farklı mı?
new.crbug.com adresinden hata bildiriminde bulunun. Açıklamalarınızı mümkün oldukça detaylandırmaya çalışın.
oluşturmaya ilişkin basit talimatları uygulayın ve Bileşenler alanına UI>Browser>WebAppInstalls
yazın.
seçin. Glitch, hızlı ve kolay yeniden oluşturmalar paylaşmak için idealdir.
API'ye desteğinizi gösterin
PWA'lar için URL protokol işleyici kaydını kullanmayı planlıyor musunuz? Herkese açık desteğiniz, Chromium ekibi özellikleri önceliklendirir ve diğer tarayıcı tedarikçilerine Google Chrome'u desteklemenin ne kadar önemli olduğunu gösterir gerekir.
Bu özelliği nasıl kullanmayı planladığınızı WICG Discourse ileti dizisinde paylaşın. Tweet gönder:
@ChromiumDev hashtag'ini kullanarak
#ProtocolHandler
ve nerede ve nasıl kullandığınızı bize bildirin.
Faydalı bağlantı
Teşekkür
PWA'lar (Progresif Web Uygulaması) için URL protokol işleyici kaydı Fabio Rocha, Diego González, Connor Moody ve Microsoft Edge ekibinden Samuel Tang. Bu makale Joe Medley ve Fabio Rocha tarafından incelendi. Hero görseli JJ Ying, Unsplash'te.