question

LuisLopezAlonso-6048 avatar image
0 Votes"
LuisLopezAlonso-6048 asked sadomovalex commented

Static web site on Storage Account & App Service

Hi,
I've a conceptual question about Static web site on Storage Account & App Service.

My team have develop an Angular10 + ASP.NET Core (API) application. Our frontend (Angular10) only consumes our API , so the availability of our app depends on the availability of both, frontend + backend (our API will NOT be consumed by any other app). We don't have any latence issue or requirement as our final users are all in the same region. Our app must be consumed through HTTPS and with a specific name (CNAME).

When we deploy the app to Azure, my team decide to deploy it separately using a Store Account as static web site for Angular 10 and an AppService for the API as backend of our App.
As far I see on MS docs (here is the related article):

"App Service Static Web Apps is a great alternative to Azure Storage static website hosting and is also appropriate in cases where you don't require a web server to render content"

Because of we currently need an AppService to render content, i have some questions:
- The app works but, is a correct arquitectural approach or is better only publish our app to an AppService?
- There are any security/cost related/whatever topic that makes StaticWebSite + AppService approach better than only AppService deploy?



I think that this approach does not give us any facility or advantage. Instead of this, we have to configure more things on Azure to connect through SSL and to give a CNAME to our app and AppService deploy.

Please, can you give me your oppinion?

Thanks in advance
Best regards
Luis

azure-webappsazure-static-web-apps
5 |1600 characters needed characters left characters exceeded

Up to 10 attachments (including images) can be used with a maximum of 3.0 MiB each and 30.0 MiB total.

ryanchill avatar image
0 Votes"
ryanchill answered ryanchill commented

Hi @LuisLopezAlonso-6048,

Glad to see your interest in using Static Web Apps.

The app works but, is a correct architectural approach or is better only publish our app to an AppService?

IMHO, this is fine because your React app is doing your rendering client side.

There are any security/cost related/whatever topic that makes StaticWebSite + AppService approach better than only AppService deploy?

I can't provide any insights on costs due to the nature that Static Web Apps is still in Preview while the product team assess how best to meet the needs to users with this offering. Static Web Site is underpinned by Azure Functions, so to your point, the biggest advantage I would say is geographical distribution and scalability along with key features listed.

Another option to consider is that fact you can host your API as an Azure Function and easily integrate with your static web app; see https://docs.microsoft.com/en-us/azure/static-web-apps/apis.

Configuring CNAME between App Service, Static Web Apps, and Azure Storage hosting are similar, so I wouldn't consider that a determining factor.

Regards,
Ryan

· 2
5 |1600 characters needed characters left characters exceeded

Up to 10 attachments (including images) can be used with a maximum of 3.0 MiB each and 30.0 MiB total.

Thanks for your answer @ryanchill

My team and I have made a bet about this, so apologizes for the insistence :)

Our Angular app is static, as there are no server side rendering but we are not taking advantage about geographical distribution (our users are all in the same region) and due to our users number (<10k) scalability will not be a determining factor. Also, we are not taking advantage of StaticWebApp + serverless as our final arq is BlogStorage as static web site + AppService (API).

In the other hand, we don't expect to migrate our static web app from Blog Storage to Static Web App service when the release version of Static Web App where available.

With this new information, do you consider this as a correct arquitecture on Azure?

Ton of thanks for your time
Best regards
Luis

0 Votes 0 ·
ryanchill avatar image ryanchill LuisLopezAlonso-6048 ·

It's subjective on what's best to meet your needs @LuisLopezAlonso-6048. There's certainly nothing wrong with hosting your site content inside a storage account would agree it's certainly an acceptable deployment.

Since your Angular app is remaining static, I suggest hosting your API as an Azure Function as it's serverless, see https://docs.microsoft.com/en-us/azure/azure-functions/functions-openapi-definition. Reasoning being, it's pricing model is based on consumption whereas App Service is based on uptime. See https://docs.microsoft.com/en-us/azure/azure-functions/functions-overview for information.

If, however, your API needs to maintain a session, App Service would be the way to go.

Regards,
Ryan


1 Vote 1 ·
sadomovalex avatar image
0 Votes"
sadomovalex answered sadomovalex commented

if your web site doesn't have any server-side code there is no problem with hosting it as static web site. But ensure that there won't be CORS issues when front-end will call your backend API. If web site and backend API would be hosted in the same single App Service (e.g. in different sub folder but with the same common domain name) there won't be CORS problems because domain name will be the same.

· 2
5 |1600 characters needed characters left characters exceeded

Up to 10 attachments (including images) can be used with a maximum of 3.0 MiB each and 30.0 MiB total.

@sadomovalex, just wanted you to know taht static web apps security model doesn't require CORS configuration, see https://docs.microsoft.com/en-us/azure/static-web-apps/overview#key-features.

  • Seamless security model with a reverse-proxy when calling APIs, which requires no CORS configuration.

1 Vote 1 ·

thank you, didn't know about that feature. CORS is basic headache when dealing with client side front ends and since it is solved on static web sites out of the box I don't see any problems with hosting your site there.

1 Vote 1 ·