Webapp (HTML + js) deployed to Azure, but NGINX screen appears

Question

I have deployed a working web app to an Azure App Service. It claims it is deployed to: https://klink-client.azurewebsites.net/, but that page only brings me to this annoying screen without ANY explanation about how to progress:

Can anybody explain what is now required to get to this web app?

Answer 1

If you have a web app with HTML and JS, I recommend you to use static web apps, that is more tailored for static html / js hosting.

Refer: https://learn.microsoft.com/en-us/azure/static-web-apps/overview

https://learn.microsoft.com/en-us/azure/static-web-apps/get-started-portal?tabs=vanilla-javascript&pivots=github

If you want to make nginx application to work, you need to see the nginx configuration file and ensure it is configured correctly. In some scenarios, you may not have the default document uploaded, in the nginx default configuration, the index.html file will be loaded as the default configuration. so analyze nginx configuration file and your uploaded files, you must be able to solve the problem.

Hope this helps.

Answer 2

@Eirik Y Øra I agree with the answer that Sreeju provided that you might be better served via a Azure Static Web App.

If you would like to stick to an Azure Web App, I have put together a few items I want you to investigate as part of your troubleshooting.

1. Check the Deployment Settings: Ensure that the deployment settings in Azure are correctly configured. The web app’s start file should be specified correctly in the configuration.
2. Inspect the Web App Files: Make sure that the files of your web app have been uploaded correctly to the Azure App Service. The main HTML file (usually index.html) should be present in the root directory.
3. NGINX Configuration: If you’re using a custom NGINX configuration, ensure that it’s correctly set up to serve your web app. The root directive in the NGINX configuration should point to the directory where your web app files are located.
4. App Service Plan: Check if your App Service Plan supports the technologies you’re using. Some features might not be available in lower tiers.
5. Application Logs: Check the application logs in Azure. They might provide more information about what’s going wrong.

Please let me know if either Sreeju or my answer were helpful by marking them as the answer. Or let us know if you have further issues so we can assist you.