How to create a custom WebApp URL (not for PWA)
The Apptekz Mobile App Builder offers clients the option to create Native Mobile Apps as well as Progressive Web Apps, better known as PWAs. However, we still support our original HTML 5 WebApps for those that only want to offer a simple WebApp. While we recommend using PWA as the more robust option, if you choose the WebApp, it’s still possible to customize the URL to a branded domain. To avoid an unnecessary app outage on published apps, it’s best to perform this configuration prior to publishing on the app stores.
Important note: If you are using PWA, don’t configure a custom domain for the WebApp, instead, create the custom domain to point at the PWA, then open a support ticket or fill out the form to request your PWA mapping. <<Link>>
Warning: Be aware that this operation may cause an outage to apps that are published on the app stores, therefore only perform this change if you absolutely need a custom URL for your mobile website (i.e. allowing people to open the HTML5 version of their app in a web browser). (Republishing your app on the app store may be required)
To create a custom URL for your WebApp, we must perform the following steps. These steps require access to the DNS server configuration where the domain is hosted and to the Apptekz Mobile App Builder.
To configure the custom WebApp URL there are 2 configuration steps
- Create a CNAME record in DNS to map a custom subdomain for custom URL to the Mobile App Platform
- This entry will be done using the same method as with White Label configuration
- If using Cloudflare, Proxy for this entry should be ENABLED (Orange)
- Add the new custom URL in the Apptekz Mobile App Editor
- If successful, verify that WebApp is working properly (without errors) at the new URL and that published apps continue to work as expected.
Create a CNAME record
The best method on Apptekz Mobile App Builder is to use a CNAME record. The Apptekz Mobile App Platform is located at cms.apptekz.com, and client domain (website) should be something like clientdomain.com, it’s possible to create a CNAME like mobile.clientdomain.com that will open the app in the browser of the device.
To create the CNAME for the WebApp client must connect from domain name panel and create a CNAME record named “mobile” which will have the PlatformCMS URL as its destination. Thus, to keep the example above, the destination of the CNAME “mobile” will be “mobile.customerdomain.com”. In the domain name panel, a CNAME record can be created from the DNS zone section (most often from a link “Add a new record”).
Update the Domain URL for the WebApp
Then the complete CNAME must be entered in the domain field in your Siberian editor (Settings > Domain) or by Platform Owner in BackOffice (Manage > Application > “Domain” field).
If this configuration is not done properly or if DNS propagation hasn’t completed, a message stating “Your CNAME is not properly set” will be displayed. Wait a little while and enter the CNAME URL in your browser, if it displays the app, the CNAME is configured correctly. If not, you should take a look at your CNAME configuration, or remove this custom domain. Note: DNS propagation (replication) can take up to 24 hours after making a change.
Verification and Troubleshooting
If you want to be sure your CNAME is properly configured, check your CNAME record with this tool:
Enter the chosen URL of your mobile app, in our example mobile.clientdomain.com, then choose CNAME, and click “search”, if it doesn’t show the address of your Mobile App Platform as the result, either the CNAME was not properly configured or the CNAME may not be configured at the right place if domain name is managed by another panel.
For example, if the domain registrar is at Namecheap and DNS is managed at Cloudflare, the record must be configured at Cloudflare, not Namecheap.
WARNING: Verify that the custom domain works by checking to see that WebApp opens in a browser, if an incorrect URL is entered, the app will never open because the App content is based on this URL. It will try to reach the URL and fail. * This will affect published Native Apps as well as the WebApp.
Additional Info: Custom Domains must have a wildcard ‘*’ SSL Certificate associated with the Root Domain that enables the subdomains to be covered by the SSL Certificate to avoid having security errors when accessing the URL from a web browser. Let’s Encrypt is one of many that offers this for free if you don’t have this in place already.
While subdomains are always recommended for mapping to WebApps, mapping the root domain when no website exists, requires additional configuration. Root Domain cannot be directly mapped using CNAME. Therefore, first map the subdomain, then re-direct the root domain to the new subdomain.
This is a DNS configuration requirement, not an Apptekz requirement. A root domain must use an ‘A’ record, not CNAME. ‘A’ records are mapped to IP addresses, where CNAME records are aliases that map one name to another. Aliases are most often used to allow branding on white label SasS products.
If you cause an app outage, go into the Mobile App Editor, in Domain, remove the custom URL and replace with the original.
