How to Setup Web Hosting Fallback to index.html

General
5

Hi Mark,

No, I want it to return index.html only for files and directories that don’t exist. In my app I’m using Vue and Vue Router in a single page app, in history mode. There is only one physical file, or entry point, index.html. Vue Router handles navigation inside the app to display virtual pages, or routes. For example, the app resides at

https://backendlessappcontent.com/.../.../files/web/elite/index.html

Once a user is in, Vue router handles virtual routes such as

/files/web/elite/dashboard
/files/web/elite/admin/reports

These virtual routes don’t exist in the Files repository, its all smoke and mirrors inside the client. The problem is a browser problem. If I am at

https://backendlessappcontent.com/.../.../files/web/elite/dashboard

and hit the browser Refresh button, the browser sends that request to Backendless, which, not finding a “dashboard” directory, correctly returns

{"code":6007,"message":"The specified resource was not found","errorData":{}}

The usual solution is server configuration - on Apache this means adding a rewrite rule, such as

<IfModule mod_rewrite.c>
  RewriteEngine On
  RewriteBase /
  RewriteRule ^index\.html$ - [L]
  RewriteCond %{REQUEST_FILENAME} !-f
  RewriteCond %{REQUEST_FILENAME} !-d
  RewriteRule . /index.html [L]
</IfModule>

or on nginx to add a location directive, such as

location / {
  try_files $uri $uri/ /index.html;
}

To achieve a similar result on Backendless, I was investigating the solution you provided Karol at Automatically serve index.html in web hosting. But I don’t understand this CNAME business, or how it will help me with a SPA. Also, my Custom Domains screen in the console only barely resembles the documented behavior, which is a bit confusing given that I admittedly don’t have a friggin clue what I’m doing. I know how to create a CNAME record for a domain I own, but I have no idea where to create one for a domain not under my control.

Thank you!