APNS Configuration

To setup browser push notification for your website on Safari, please follow the below steps.

📘

Note

Individual certificate to be provided for each website, if you have multiple websites.

Step 1: Create a Certificate Request

In this step, we are going to create a certificate signing request which will be used later on.

1. Launch the Keychain Access app.
2. Click on Keychain Access > Certificate Assistant > then, Request a Certificate From a Certificate Authority.

3. Enter email address, a name and then check "Saved to disk" option. Click on Continue.

4. Save the certificate signing request (CSR) with the given name, we will need it later to create the Website Push Certificate.

Step 2: Setting up Website Push ID for APNS (Apple Push Notification Service)

1. For this, you need to first login to the Apple Developer Console. Here, we are going to create a unique Website Push ID for push notifications.
2. Click on 'Certificates, Identifiers & Profiles', then click on Plus sign on Identifiers and then click on "Register an App ID".
3. Select "Website Push IDs" from the "Register a New Identifier" list and click "Continue"

4. First enter a meaningful Description.

5. Then enter an identifier, it follows reverse-domain name styling. So you should enter something like "web.com.mywebsite". (Note: "web" is added automatically to the identifier)
6. Click on Continue, check everything is in order and then click Register.

Step 3: Generating Web Push Certificate

1. Click on the Certificates section, then click "+" to see all available options.

2. Click on Website Push ID Certificate and Continue.

3. Next, select the Website Push ID we created earlier in Step 2 and hit Continue.

4. Now we need the CSR file that was created in Step 1. Browse to the file with the Choose file button, and hit Continue to upload.

5. On the next screen you will see "Download Your Certificate". Download the SSL certificate, this will be used to send notifications to your Subscribers

6. Now we need to install and export the Certificate. For that, double click on the downloaded certificate, this will install the certificate in the Keychain Access app.
7. Let’s export the Certificate now. Open the Keychain Access app and click on Certificates in the category section.
8. Right click on the Website Push ID for which we had created the certificate, you will get a menu where you need to click on Export

9. While saving the certificate file, use Personal Information Exchange (.p12) format.

10. Next, you will be prompted to enter a password, please enter a password and click on "OK".

11. Then click "Allow" and enter your Mac password to export the certificate to your Mac.

Step 4: Setup

• Once the domain is registered with APNS, you will receive the .p12 certificate file and the icons folder from there.
  • Icons from the icons folder will be checked whether they are in the required correct ratios as per the APNS Guidelines.

📘

Guidelines

1. Please share brand logo images with below Format with 100 Dots per inches only

• [email protected]
• icon_128x128.png
• [email protected]
• icon_16x16.png
• [email protected]
• icon_32x32.png

E.g. icon_128x128.png & [email protected] the size of image must be 128x128

2. The file name should be iconset_panelname.zip
3. If the client wants to update icon folder , they will have to upload p12 cert as well and vice versa.

Note

DPIs can be examined and updated in a number of methods, the most efficient of which is to use the Image size option given under the Image area of the toolbar in Adobe Photoshop to review and edit the image resolution.
Pixels per inch (PPI) is a unit of measurement that is similar to DPI.

• Now, login to the Netcore CE Panel, navigate to Assets > Websites > Choose you website and click edit.
• In the configuration page turn on the Browser Push Notification Switch and under the APNS Section ,upload icon folder then the .p12 file and put in the Intermediate Certificate Password, also available on your APNS Account.(Please refer image below)
• In case of Safari, double opt-in is mandatory, so if the client wants that to happen from a sub domain, put that in the sub domain field or if it needs to be done from the main domain put the main domain in the sun domain field.

📘

IMPORTANT

• A double-step opt-in is mandatory to enable user interaction, such as a click or tap, for web push notifications in Safari.
• If you use single-step opt-in for Chrome/Firefox and double-step for Safari, you will need to customize each separately. However, if you select double-step opt-in, it will work across all browsers.