Hi! I’d like to be able to use a custom domain for my Anvil app. How do I do that? Thanks!
Hi Colette,
Developers on any of our paid plans can add custom domains to their apps. Start by choosing “Publish App” from the gear menu:
In the publish dialog, choose “Share via public link”, and then “Add custom domain”
Then follow the instructions for setting up the DNS records for your domain. In particular, you will need to create a CNAME record pointing your custom domain to anvilapp.net. This is fine for subdomains like app.somewhere.com, but if you wish to use a top-level domain like somewhere.com directly, you will need to set up an A record pointing somewhere.com to our public IP address 52.56.203.177.
Once you’ve set up the DNS records, it will usually take 24-48 hours for the changes to propagate. At that point, your Anvil app will be accessible on your custom domain.
Side note: If you want to change the custom domain pointing to an Anvil app, it’s a good idea to set up the DNS records for your new domain first, and wait a day or two for the changes to propagate. Once that’s done, enter the new domain in the publish dialog as described above. This will minimise down-time for your app while the configuration switches over.
I hope that helps - let me know how you get on!
1 Like
How does the custom domain work with various forms in the Anvil app?
Meaning, once I point my top level domain to the Anvil app, do the Form names become the page names?
So, using the screenshot below as an example, once I point caliweedjobs.com to Anvil…
…my home (or index) become caliweedjobs.com/Form1 (because it’s set as default)
…and then when a user wants to go to his or her account, do they see caliweedjobs.com/Form_My_Account as the URL?
Thanks for clarifying -Ian
I will try to explain this as good as I can.
All the forms in the app are not separate url pages but in stead shown as different bits of html on the same url, When you click an item and e.g. open_form() is called, javascript will display new html in the clients browser. There are no GET requests for a different url.
The result is that if the client/user navigates through e.g. 7 “forms” and then asks the browser to go to the previous page/url the app will be exited.
I think I follow, so in my example, the user would type in caliweedjobs.com, and be taken to caliweedjobs.com/Form1, then if they clicked a button that took them to their account, they would land at caliweedjobs.com/Form1/Form_My_Account?
…but then if they click the browser back button from caliweedjobs.com/Form1/Form_My_Account in attempt to go back to caliweedjobs.com/Form1, they will instead exit the app?
As far as I understand it Ian (and I could be wrong as I am new!) the back button doesn’t work on Anvil. Anvil apps are effectively single page apps (much like an application on your computer would function). So you will never go to caliweedjobs.com/form1/form_my_account. I think you can get the anvil apps to read the URL parameters with a module as @david.wylie has said in the post here:
GET & POST data
That way you could technically get a specific form to show for the user based on the URL that has been entered. But its not default behaviour.
So in your example if you were to have a navigation bar such as:
Home -> Form 1
Add Job -> Form_Add Job
My account -> Form_My_Account
the user would go to www.caliweedjobs.com if they were to click add Job their URL would still show www.caliweedjobs.com however an open_form(Form_Add_Job) would of happend which wold of replaced the Form1 on the page with the HTMl in Form_Add_job But the URL would still be the same root domain.
Using the URL parameters above you could provide a way for people to access the Add job form quickly by doing a module that would look for the parameter in the URL and display the correct form i.e
URL: www.caliweedjobs.com?page=‘addjob’ -> open(form_add_job) for example
1 Like
Thanks Chris, I will take a look at this and David’s post tonight, this makes me hopeful…my fear is that users will instinctively use the browser back (and forward) buttons and get frustrated when they accidentally leave the app.
Just to add a little bit to Chris’ post, Single Page Apps (SPA), unlike multi page apps, load only one master page containing the templates for all the forms and client side code. It’s one big javascript app. that communicates to the server for data. There’s no such page as www.domain.com/loginpage.html. If the master page is ever reloaded (eg F5 or back-then-forward) then the app restarts from the beginning because the whole lot is reloaded and executed from the top.
Gives you faster apps overall (generally) but has the caveat of making the back button a bit useless.
I do believe there are javascript frameworks that can trap and handle the back button but I don;t see them very often in the wild, so I assume there’s a reason for that.
If you want to , you can hold state in the “anvil.session” variables (probably in combination with a data table) so if the page ever got reloaded you could at least partially recover. Might be a little involved but it should be possible.