Safari Push Notifications work a bit differently as compared to chrome and firefox. Notificaitons on Safari require a certificate and a pass phrase generated from your Apple developer account, in this tutorial we are gonna show you how you can obtain your Safari Push Notification parameters from your Apple developer account.
Login into your Apple Developer account by going to https://developer.apple.com/account. After you have logged in, click on the menu item saying “Certificates, IDs and Profiles” in the left navigation.
On the next screen, under identifiers section, select “Website Push Ids”.
On the next screen, click on the + button in top right.
On the next screen, enter a simple name for the push id, you can simply use your website title for the description field. And for the identifier field, enter a string in the form of com.[company name].[website title], you can choose not to enter company name, but it is generally a good practice (as you type, web followed by a dot will be automatically added to your identifier). After adding the identifier, note down the identifier, we are gonna need it in a later step.
After you click continue, you will be asked to confirm the details of your push id, simply click register and than on the next screen click Done to finish the Push Id creation process.
From the left menu, click on All menu item under certificates.
On the next screen, click on + icon in top right.
On the next screen, click on the button next to “Website Push Id Certificate” and click “continue” at the bottom of screen.
On the next screen click the next button, you will land on a screen asking you to upload a CSR file.
CSR stands for certificate signing request and it can be easily generated on your Mac by using a tool called Keychain Access. In your applications, look for the utilities folder and you will see an app called KeyChain Access. Alternatively you can search using the Mac OS search to find the said app. Please keep the browser open in the background on which you reached to upload CSR page.
Inside keychain access, from top menu, select KeyChain Access > Certificate Assistant > Request Certificate from a Certificate Authority. Make sure in the list shown in Keychain Access, no previous certificate is selected.
On the next screen, enter your email address, and a name for the certificate (you can use anything in the common name field, but please remember it so that you could find it in the list of certificates). Don’t forget to select “Saved to Disk” option and leave the other 2 unchecked.
Click continue and you’ll be prompted to select a location to select the location where you want to save the CSR. You can save it on your desktop or in documents or anywhere you want.
Now go back to the browser and upload the CSR file. After selecting the CSR file by clicking the “Choose File” button and than click continue. After processing, you will land on a page similar to this.
Click on the download button to download the certificate. After the file has been downloaded, click / double click on it to import it into the Keychain Access.
Now go back to Keychain Access and select “Keys” from left menu and than find the certificate by the common name you entered previously. You will see 2 certificates with same common name in list. Select the one with “private key” written in kind column. You can export the certificate by right clicking and than selecting export. Or after selecting the private key, go to File > Export Items.
You will be asked to select the location for the certificate file, after you click save, you will be prompted to create a password to encrypt the certificate. Enter the password (keep the password in a safe place as this is the passphrase you will have to enter in your PopNotifi dashboard) and click Ok. You might see a dialog saying keychain is trying to use the password. click allow or alway allow.
Now go to your PopNotifi dashboard > Settings. Under the “Apple Safari Configuration” add your Push Id, PassPhrase and upload the certificate we just exported and click save. After our system verifies the passphrase and certificate Safari Push Notifications will be enabled on your account.