4

I have a front end WebApp built entirely with Vue, and a backend WebApi that serves the website built with ASP.Net Core. I would like to use Azure CDN with my WebApp as there is a fairly large demand on my App Service Plan just to serve the front javascript, html, and image files with the WebApp.

Can I serve the entire WebApp using Azure CDN? Or is this not advised since I'm having issues reaching the backend API from the CDN version of the website....

Should I instead only use the CDN for the images, scripts, and css files? Or is it acceptable to use the CDN for the full WebApp? I'm having a hard time setting all of this up and the documentation on Azure is not very straightforward in what I should aim to have on the CDN.

I essentially would like to know what I can do to make my WebApp load as fast as possible, and offload the requests for the front-end of the WebApp to a server that does not use the back-end API resources. Yet I would still like to reach my back-end API as all user accounts dynamically display data loaded from the API.

Thanks in advance for any help, any direction would be greatly appreciated.

Steven Pfeifer
  • 345
  • 4
  • 11

1 Answers1

2

You can follow the tutorial on how to configure static website hosting

Hosting the front-end involves 2 steps:

  1. Using Blob Storage to host a static website.

  2. Configure Azure CDN to configure the custom domain name for the static website.

In order to call the back-end from the front-end you have to ensure that both sites are exposed via the same domain. Or, enable CORS on the back-end so that the browser allows the front-end to consume responses from the back-end.

Steve
  • 2,205
  • 1
  • 21
  • 28
  • Would it be a good idea to have the whole front end SPA on the CDN? Or should I only try to put the images, css, js files etc. on the CDN and reference those from my origin site. Thank you for the quick response! – Steven Pfeifer Aug 26 '19 at 21:38
  • 2
    You can put the entire SPA on the CDN. The CDN is really good at serving static assets, and by using it to do that, you can ensure that only requests that require some kind of computation are directed to your web API. – Steve Aug 26 '19 at 21:40
  • I still am having troubles setting the custom domains, but added this in a new question if you’d be able to help by chance https://stackoverflow.com/q/57665919/7242722 – Steven Pfeifer Aug 27 '19 at 00:03