ios-pwa-wrap

⚠️ Take a look at PWABuilder first ⚠️

This template is used in PWABuilder service, and you can get pre-generated customized project for your Web App from there.

Makes possible of publishing PWA to Apple Store (works in EU) like TWA from Google.

Supports work with push notifications from JS code, handle auth providers by redirect URL, handle external links, print page support, and loading animation. Firebase cloud messaging are used for Push Notifications.

Supports most things you can do in Safari (like Location, Media, Share, Pay, and other Web APIs) and more (like Push, Print, Download and everything you added on top) with native callbacks.

This project has grown from the internal development of Hostme App.

The iOS part of PWA Builder project forked this repository as a template and it's should develop faster, so take a look at it first.

Gallery

Launch process	Native Push API request	MSAL Auth Redirect

Handle Push content in JS	MacOS support

Quick start

Install Pods references

• Install CocoaPods to the system

For Apple M Silicon: (More options here)

# Uninstall the local cocoapods gem
sudo gem uninstall cocoapods
# Reinstall cocoapods via Homebrew
brew install cocoapods

• Go to Repo folder and do in terminal pod install
• Open file pwa-shell.xcworkspace
• xcode should support iOS15+

Generate Firebase keys

• Go to https://console.firebase.google.com/
• Create new project
• Generate and download GoogleService-Info.plist
• Copy it to /pwa-shell folder

Generate APNS key

• Go to https://developer.apple.com/account
• Under "Certificates, IDs & Profiles", click on "Keys"
• Click "+"
• Give your key a name, and enable "Apple Push Notifications service (APNs)"
• Click continue, then register. Download the .p8 key file.

Upload the APNS key to firebase

• Go to https://console.firebase.google.com/
• Under your project, create an iOS app if you haven't already. Ensure the bundle ID is correct.
• Go to the iOS app settings
• Click on the "Cloud messaging" tab
• Under "Apple app configuration", upload your APNS key.

Change to your website

This app was setup to my webapp just for example. You should change this settings to yours.

• WKAppBoundDomains in Info.plist
• Settings.swift
• URL Types at Info tab
• Associated Domains at Signing & Capabilities
• Adjust Capabilities at Signing & Capabilities (leave only required for your app)

JS Features

Example web app you can find here

Push events and permissions

push component sample

Apple In-App Purchase

iap component sample

Print page, file download, alerts

common component sample

HTML Features

Viewport

don't forget to use viewport meta tag in your webapp

<meta name="viewport" content="viewport-fit=cover, width=device-width, initial-scale=1.0, shrink-to-fit=no">

---

TO DO:

• More ellegant solution for toolbar and statusbar