27

We created a Linux Web App in Microsoft Azure. The application is static written with React (html and Javascript). We copied the code into the wwwroot folder, but the application only showing only hostingstart.html and when we try to get page index.html we have this error: Cannot GET /index.html

We tried with a sample of Azure in GitHub (https://github.com/Azure-Samples/html-docs-hello-world) but the error is the same. The url is this: https://consoleadmin.azurewebsites.net/index.html

Last week the application was running correctly.

We forget to do something?

Improve this question
4
  • Can you post what Azure is seeing as your file structure? Commented Jan 17, 2019 at 13:26
  • @ScottCraig What do you mean? In the web app under the / we have: .mono, LogFiles, site. Under site: deployments, locks, wwwroot (contains index.html) Commented Jan 17, 2019 at 13:58
  • Try renaming hostingstart.html to old_hostingstart.html. Then, restart the web app. Commented Jan 17, 2019 at 18:26
  • 1
    @RickRainey i tried but doesn't work, alway shows hostingstart.html. It seems something is changed for the static web app in Azure. Commented Jan 18, 2019 at 13:57

5 Answers 5

Reset to default
72

MAY 2020 - You don't have to add any JavaScript files or config files anywhere. Let me explain.

I was facing this exact same issue and wasted 6 hours trying everything including the most popular answer to this question. While the accepted answer is a nice workaround (but requires more work than just adding the index.js file), there's something a simpler than that.

You see, when you just deploy an Azure Web App (or App Service as it is also called), two things happen:

  1. The web app by default points to opt/startup/hostingstart.html

  2. It also puts a hostingstart.html in home/site/wwwroot

When you deploy your code, it replaces hostingstart.html in home/site/wwwroot but the app is still pointing to opt/startup/hostingstart.html. If you want to verify this, try deleting opt/startup/hostingstart.html file and your web app will throw a "CANNOT GET /" error.

So how to change the default pointer? It's simpler than it looks:

Go to Configuration tab on your web app and add the following code to startup script:

pm2 serve /home/site/wwwroot --no-daemon

If this web app is a client-side single-page-app and you're having issues with routing, then add --spa to the above command as follows:

pm2 serve /home/site/wwwroot --no-daemon --spa

This will tell the web app to serve wwwroot folder. And that's it.

Screenshot explanation

PS: If you only set the startup script without deploying your code, it will still show the hostingstart.html because by default that file lies in the wwwroot folder.

Improve this answer
Sign up to request clarification or add additional context in comments.

12 Comments

This approach was helpful, but I could not get pm2 to serve all my generated directories and files with gatsby. Gatsby produces static files and folders with react SSR. When using pm2 serve /home/site/wwwroot, the SPA runs fine, but when navigation (within the app (not and SPA)) to /dir/dir and then hitting back button or refreshing, I get an "Sorry, check with the site admin for error: EISDIR .." error, so it will not serve anyting other than index.html..
If I target /dir/dir/index.html directly, that works, and I am back into the "ecosystem" of the app
Ugh, I'm so close to solving this! I'm running .NET Core / ASP.NET Core, so a Node answer doesn't help. But at least I know the problem!
@phun-ky try adding the --spa in the end of the startup command. I've updated my answer. I faced this issue as well.
I also solved this by changing to PHP stack with empty startup command.
|
18

Ok you are gonna love this. This happened to me today also. Same exact thing. I am pretty sure the azure team flipped a switch somewhere and we fell through a crack.

I found this obscure answer with no votes and it did the trick (with a little extra finagling)

BONUS! this also fixed my router issues I was having only on the deployed site (not local):

Credit: @stormwild: Default documents not serving on node web app hosted on Azure

From @stormwild's post see here: https://blogs.msdn.microsoft.com/waws/2017/09/08/things-you-should-know-web-apps-and-linux/#NodeHome

Steps:

  1. Go to your azure portal, select your app service and launch ssh
  2. List item
  3. In ssh terminal, navigate via command line to /home/site/wwwroot

  4. create index.js there with the following code:

    var express = require('express'); var server = express(); var options = { index: 'index.html' }; server.use('/', express.static('/home/site/wwwroot', options)); server.listen(process.env.PORT);

  5. NOTE: Be sure to run npm install --save express also in this folder else your app service will crash on startup

  6. Be sure to restart your app service if it doesn't do so automagically

Improve this answer

1 Comment

thanks! I solved but i needed to add the port in the index.js, server.listen(process.env.PORT);. I also did 'npm init' at the beginning and 'npm start' after 'npm install --save express'
4

A workaround, I changed the webapp stack to PHP 7

enter image description here

Improve this answer

Comments

2

Another solution would be to add a file called ecoysystem.config.js right next to your index.html file. 

module.exports = { apps: [ { script: "npx serve -s" } ] };

This will tell pm2 to associate all requests to index.html as your app service starts up.

Very helpful information here: https://burkeholland.github.io/posts/static-site-azure/

Improve this answer

Comments

0

I've stumbled upon this same issue (deploying a built node application, that is is: .html, .css and .js files) and I could successfully see my app on the Kudu wwwroot url (https//{web-app-name}.scm.azurewebsites.net/wwwroot), but i was not able to see it on the base utl (https://{web-app-name}.azurewebsites.net) and all the correct files were on the wwwroot folder, so no clue at all why it did not even load my index.html file.

Then I discovered that the KUDU application had many other options if your webapp was hosted on a windows server, so I changed my webapp to a windows server (it was linux previously) and Voila!

Worked like a charm.

Best!

Improve this answer

Comments

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.