Troubleshooting an issue where my custom HTML file isn't being served by Nginx in a Docker container, even though I followed the correct steps

General
1

I am new to Docker and am encountering an issue while trying to serve a simple HTML file using Nginx in a Docker container. I’ve followed the tutorial steps and have been able to get Nginx running, but when I access http://localhost, I still see the default Nginx welcome page instead of my custom index.html file.
Here are the steps I followed:

  1. Dockerfile: I created a basic Dockerfile with the following content:
    FROM nginx:1.27.0
    RUN rm -rf /usr/share/nginx/html/*
    COPY static /usr/share/nginx/html

  2. Then i wrote a basic custom-html(index.html) code:

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>Minimal Todo List</title>
</head>
<body>
  <h1>Todo List</h1>
  <input type="text" id="newItem" placeholder="Enter a new item">
  <button onclick="addItem()">Add</button>
  <ul id="todoList"></ul>
  <script>
    function addItem() {
      const input = document.getElementById('newItem');
      const list = document.getElementById('todoList');
      const li = document.createElement('li');
      li.textContent = input.value;
      const deleteBtn = document.createElement('button');
      deleteBtn.textContent = 'Delete';
      deleteBtn.onclick = function() {
        list.removeChild(li);
      }
      li.appendChild(deleteBtn);
      list.appendChild(li);
      input.value = '';
    }
  </script>
</body>
</html>

After all the building the docker image + running the container, the container ran successfully, and it was accessible at http://localhost, but instead of seeing my custom index.html, the default Nginx welcome page is being displayed.

Again ,I’m new to Docker and would really appreciate any guidance or troubleshooting steps you can suggest.

Thank you for your help!

2

Container troubleshooting requires more info:

  1. Image, created by Dockerfile
  2. Container, created by CLI or compose file

Make sure to share both.

The next step would be to check inside the running container, if the files are present.

Something like

# create a shell inside running container
docker exec -it myContainerName sh

# list files in folder 
Is -la /usr/share/nginx/html
1 Like
3

You must have noticed that half of your code message not visible. If you let your post unreadable, you will not get useful answers. I fixed your post, but please, always format your post properly: How to format your forum posts

1 Like
4

I think @bluepuma77 meant sharing the Dockerfile (done) and sharing how you created the container.

1 Like
5

Thank you for being so helpful, I’m new to writing forums and stuff, so next time I will try not to make any mistakes in the future

6

I’m so sorry I didn’t write that before.
So I built the Docker image using this command: docker build -t my-website .
Then, I ran the container with: docker run -d -p 80:80 my-website

After that, I checked http://localhost and saw the default Nginx welcome page instead of my custom index.html. I haven’t used any Docker Compose files, just the Dockerfile and the commands above.

7

Please, do what @bluepuma77 suggested

1 Like
8

Thanks for the suggestion!

I’ve checked inside the running container, and it seems like my custom index.html isn’t being copied correctly. Here’s what I did:

  1. I used the docker exec -it <container_id> sh command to get inside the container.
  2. Then, I listed the files in /usr/share/nginx/html using ls -la /usr/share/nginx/html.

I found the default index.html from Nginx, but my custom index.html wasn’t there. I believe the issue might be with the COPY command in my Dockerfile.

Here’s the current COPY command I have in the Dockerfile:
COPY frontend/static /usr/share/nginx/html

It seems like it’s not replacing the default index.html. I think I might have an issue with the path or the build context. Could you suggest any troubleshooting steps or adjustments to ensure my custom index.html is copied correctly into the container?

Thanks for your help!

9

Something still must be missing since this cannot happen with the Dockerfile you have and the commands you shared. Maybe if you forgot to rebuild the image after you changed the HTML file.

1 Like
10

Hi, sorry for the delayed response!
Thanks for your suggestions. I’ve already tried the steps you mentioned:

  • I made sure to rebuild the Docker image after updating my index.html.
  • Used docker exec to check inside the running container at /usr/share/nginx/html.
  • I’ve also confirmed that the container is running and accessible on http://localhost.

However, I’m still seeing the default Nginx page instead of my custom HTML file. I’m wondering if this could be related to my PC’s firewall or network settings interfering with local connections?
Any further troubleshooting tips would be really helpful. Thanks again for your time!

11

BAsed on the shared information the issue could not happen. If it happenw, my exprience points to the possibility that the provided information was not correct or something was missing. The COPY instruction copies files and it will not be deleted or hidden, unless you run a command that hides it. Like a bind mount. Or you didn’t actually build the image because of a failure which you didn’t recognize and expected an old image to be updated which didn’t happen.

If you describe the whole issue from the beginning, providing commands and code that step by step shows what you did, and you share all the outputs you got preferably as a code block, not a screenshot, we can take another look at it.

12

Did you restart the container with the updated image?

13

This topic was automatically closed 10 days after the last reply. New replies are no longer allowed.