原文地址
新的安卓版本8，名字是奥利奥，“热量”比较高，终于有了PWAs（progressive web apps）的味道。安卓奥利奥除了图标改进，画中画外，还提供了更安全的功能：让所有的公共WiFi热点连接都通过VPN。而进一步整合Chrome以后，终于可以实现一部分PWAs功能了，这对许多开发者是非常好的消息，因为意味着Web应用和混血Web应用将更加像本地应用，无论从应用的外表到内部机制。
虽然安卓奥利奥的模拟器里包括了Chrome，极大地便利了开发者，但是仍然有一些很酷的安卓本地功能没有提供给PWAs，比如通知点，可变图标，通知通道等等。
抄录：
Android Oreo takes a bite out of Progressive Web Apps
On August, 21st after the solar eclipse, Google released the final version of Android 8 now known as Android Oreo. The sun wasn’t the only thing that was hidden for a while today, as Progressive Web Apps have acquired new problems.
I’ve installed Android 8 on my Google Pixel, and I’ve tested a couple of things regarding websites and PWAs and then I have a couple of bad news to share.
Android Instant Apps are the only mention to something related to the Web or browser in the Android Oreo website. It seems to repeat last Google IO keynote, where Android Instant Apps appeared as more important than PWAs from an Android’s perspective.
But let me start with good news: software updates can solve most of the problems. The issue is that nobody seemed to care enough about it to do it before the Android release that is currently being delivered to users.
Broken Add to Home Screen
Let’s start stating the worst problems: on Opera Mobile, Samsung Internet, and Firefox the “Add to the Home screen” feature is not working. While Firefox is not supporting Web App Manifest yet for standalone display, it supports bookmarks to the Home Screen.
No icon appears after Adding on the Home screen on Samsung Internet and Opera using Oreo
On these browsers when you add a website or PWA to the Home screen, nothing happens. Nothing. No icon appears, and the browsers seem to understand everything is ok. Web App Banners appears correctly without luck after accepting the icon installation.
My first guess is that the old shortcut API is not working and these browsers had to update to the new Pinned Shortcuts API.
If you had installed icons with these browsers before installing Android 8.0, they would still work after the upgrade. The problem seems to be in the icon installation.
“Add to Home Screen” still works correctly on Google Chrome, but from the other browsers we will need to wait for an update at Google Play.
New Installation Process in Chrome
This screen appears after we accept the icon installation dialog
Using Google Chrome, we have a new step before actually installing the icon: the home screen place selector. Here we can use “Add automatically” that will find a free spot where to install the icon or you can touch and hold the icon and drop it wherever you want it. The problem is that this new process has a new step that might decrease a little bit installation rate.
The new process involves:
1- Open the menu.
2- Select Add to Home screen.
3- Edit the title and press “Add.”
4- Press “Add Automatically” or touch and hold the icon to place it manually.
If the Web App Banner appears, steps 1 and 2 will be replaced by one step: press “Add to Home screen” on the banner.
Icons are not what you expect any more
The Chrome badge now appears on every PWA icon on the Home Screen
Up to Android 7.1, Chrome and Android were honoring the icon that you set inside the Web App Manifest (or meta tags as a fallback) without any transformation.
Starting with Android Oreo, every shortcut added from Chrome (and potentially other browsers as well, but they are not working now) will have a Chrome badge at the lower right corner of the icon.
This is bad for PWAs as we want to offer the user an app-like experience; the Chrome icon doesn’t help for the user to understand it as an app. And many companies won’t be happy about it.
The other issue with icons is that if your icon is not a perfect circle with a transparent background, the icon is treated as square and it’s reduced to fit entirely within the boundaries of a white circle. You can see the same PWA icons installed in the same device on Android 7.1 and Android 8:
On Android Oreo, icons have the badge and if they are not a perfect centered circle, they are embedded inside a white circular icon, reducing their original size.
In the previous image, the Lyft, Get Kana! and NASA icons are suffering for this issue while Garbarino, Flipkart and AliExpress keeps their original icons.
I don’t have confirmation but it seems icons for PWAs are following now the App Shortcut Icon Design Guidelines.
Any icon installed previous to Android 8 upgrade maintains the original icon; changes happen if you install the icon after the upgrade.
WebAPK will be our hero
While we can’t do anything about it, for now, one solution might appear when WebAPK becomes stable in the future. WebAPK is a new feature in Google Chrome that creates a native Android Package container (APK) and signs it server-side for our PWA. It’s currently available in Chrome under a flag “Improved Add to Home screen” and in Canary by default.
With WebAPK enabled, icons are back to normal as we were used in Android before Oreo. There is no public information yet on when WebAPK will become available but I guess (and hope) that these problems will speed things up.
And WebAPK will solve the issue for Chrome only. Samsung Internet, Opera, Firefox and other browsers will have the same icon problems unless Google opens WebAPK to third-party browsers as Google is the only one that can sign those on-the-fly generated APKs.
Public Open WiFi hotspots now under a VPN
Android supports now a feature that will connect automatically to open access points (those without any security) and it will use a Google VPN as a secure tunnel to increase security. That means that your users will appear to your server as coming from Mountain View, USA. The original IP address is not available in the HTTP headers, so Google is not honoring the X-Forwarded-For header.
Android 8 goodies not available to PWAs
Android Oreo added a couple of things that can be useful for PWAs, but are still out of reach for Web content as of today, such as:
Notification Dots: when an app has a pending notification, a dot will appear on the icon.
Adaptive Icons: which can display a variety of shapes across different device models. For example, an adaptive launcher icon can display a circular shape on one OEM device, and display a square on another device
Notification channels: it will let us define categories of notifications that we want to receive from an app/website.
Shortcuts: options that will appear when you touch and hold an icon
Someone though this was a good idea. But Android Oreo has some good ideas we want to see in PWAs. www.flickr.com/photos/jeepersmedia/14206784113
Any good news?
Before ending the article, I’ve some good news regarding web development on Android 8. Let’s cover them quickly.
Chrome and PWA emulation
You can test everything that I’ve mentioned here even if you don’t have an Android 8 device as of today, Android emulator (available with Android Studio) now includes Google Chrome (version 58).
Android 8 Emulator now includes Chrome for Web and PWA testing, including the ability to connect a Remote Inspector
Picture-in-Picture for video playing
If you have a tag now, PiP is supported in Chrome. I’m not sure it has the right UX now though: you need to open the video in full screen mode and then press the Home Screen. At that point the video will continue playing as a PiP small floating window that you can move around and close it.
PiP works with most HTML5 video tags. Somehow, it’s not working on YouTube so I’m sorry, you won’t be able to watch Despacito again in PiP mode.
Google needs to work harder on PWAs
PWAs with Oreo?
We usually criticize Apple a lot regarding support for the Web Platform, but PWAs on other platforms, including Android, are still in early stages. And I’m sorry to say that. I want to say something nicer here.
I tweeted about something similar during last Google I/O where my feeling was Google doesn’t care about PWAs. And I’m saying Google, not Chrome. Weird? Yes.
I know some people at the Chrome team is doing an outstanding job, but some things (such as WebAPK) are taking too much time to get ready (I tweeted about it 14 months ago).
The Android team doesn’t seem to care too much about PWAs: the support for Instant Apps and the problems stated in this post on today’s release for me are enough probe to say it, and it’s harming a little bit current PWAs’ trust.
I also know some people will reply saying that PWAs are more about Service Workers than about Web App Manifest and the icon installation, but you know… It sounds good, but I don’t think SW alone is selling the PWA idea to companies.
Let’s work on making it work better in the future!
Maximiliano Firtman is a mobile + web developer, trainer, speaker, and writer. He has authored many books, including High Performance Mobile Web published by O’Reilly Media. He is a frequent speaker at conferences worldwide and he has been widely recognized for his work in the mobile-web community. He teaches mobile, HTML5, PWA and performance trainings for top companies around the world. He has delivered several Progressive Web Apps workshops and trainings at Fluent, ForwardJS, Safari Live Trainings, Dutch PHP Conference, ITMaster and more places. Twitter: @firt
