Try_files infinite requests issue

[Gerardo_Sabetta]

1. Caddy version (caddy version):

v2.4.3 h1:Y1FaV2N4WO3rBqxSYA8UZsZTQdN+PwcoOcAiZTM8C0I=

2. How I run Caddy:

a. System environment:

I’m using docker-compose. I mount the static files and the Caddyfile

b. Command:

I have a python script that’s responsible for getting a session id, adding them to the Caddyfile and running docker-compose up

os.system("envsubst '${sessionid} ${TENANT_DOMAIN}'< ./Caddyfile_template > Caddyfile")

c. Service/unit/compose file:

version: "3.7"

services:
  caddy:
    image: caddy:latest
    restart: unless-stopped
    ports:
      - "80:80"
      - "443:443"
    volumes:
      - ./Caddyfile:/etc/caddy/Caddyfile
      - ../dist:/srv
      - caddy_data:/data
      - caddy_config:/config

volumes:
  caddy_data:
    external: true
  caddy_config:

d. My complete Caddyfile or JSON config:

test.localhost {
        @apiCalls {
                path /v1/* /asset_api/* /network_topology/*
        }

        handle /* {
                uri strip_prefix /dist
                root * /srv
                file_server
                try_files {path} index.html
        }

        handle @apiCalls {
                reverse_proxy @apiCalls {
                        header_up Host $TENANT_DOMAIN
                        header_up Cookie sessionid=$sessionid
                        to https://$TENANT_DOMAIN
                        transport http {
                                tls
                                tls_insecure_skip_verify
                                read_buffer 8192
                        }
                }
        }
}

3. The problem I’m having:

I’m trying to make my frontend routing work. If I remove the try_files line the application works but without frontend routing, you visit the / route and the frontend router replaces the route to /assessments (our landing page) but if you visit a specific route it throws a 404 (curl -v also shows 404). That’s why I included the try_files line in the Caddyfile. That seemed to work at first. I launched the url test.localhost/assessments. and instead of the 404 I see test.localhost/assessments which is what I want to see. The network requests to the API go through the reverse proxy as expected. The problem is that my index.html has some script tags

...
  <script type="text/javascript" src="./js/vendor.min.js"></script>
  <script type="text/javascript" src="./js/assessments.min.js"></script>
  <script type="text/javascript" src="./js/assets.min.js"></script>
  <script type="text/javascript" src="./js/reports.min.js"></script>
  <script type="text/javascript" src="./js/scenarios.min.js"></script>
...

And the website starts doing this non-stop

this also occurs with the css files that I have on the website header

It started happening only when I added the try_files line

4. Error messages and/or full log output:

5. What I already tried:

I’ve tried different combinations of try_files. none of them solved the issue

try_files {path} {path}/ index.html
try_files {path} {path} index.html
try_files index.html

rewrite * index.html (for anything thats not an api router or a dist file)

nothing seems to work. Any ideas why?

6. Links to relevant resources:

How to configure Caddy server for react-router

Setting Caddy to be used with a SPA

Hi guys, I would like use Caddy in my new project. Which is a SPA built with ReactJS. I am using React-Router and all URLs must go to index.html. For example: https://myproject.com/ → index.html https://myproject.com/user/edit → index.html But what happing is that when I try it I get a 404. Because of course there isnt a user/edit/index.html folder structure in my public folder. Any one of you can help me ?! Thx! Carlos.

Thanks in advance

[francislavoie]

@Gerardo_Sabetta

1. Caddy version (caddy version):

v2.4.3 h1:Y1FaV2N4WO3rBqxSYA8UZsZTQdN+PwcoOcAiZTM8C0I=

Please upgrade to v2.4.5!

@Gerardo_Sabetta

os.system("envsubst '${sessionid} ${TENANT_DOMAIN}'< ./Caddyfile_template > Caddyfile")

You don’t need this, the Caddyfile supports environment variables:

Caddyfile Concepts - Caddy Documentation

@Gerardo_Sabetta

nothing seems to work. Any ideas why?

Please describe your file structure. You can use the tree command for this.

What do you see when you make a curl -v request for one of the JS files?

If you enable debug mode, you can see with more detail in your logs what Caddy is doing with the rewrites. Add this at the top of your Caddyfile:

{
	debug
}

Then check the logs of your caddy container with docker-compose logs caddy --tail=50

[Gerardo_Sabetta]

I tried using nginx and even creating a proxy with node and the problem is present there aswell. I don’t think Caddy is responsible for this but rather the frontend router is doing something unexpected I think we can close this, I will post what the issue was when I fix it

[Gerardo_Sabetta]

My issue was that every request that wasn’t matched to a static file was sent to index.html and my frontend router didn’t had a 404 page, instead it shows the landing page. So if I had a line like <script src="this.file.does.not.exist.js"> it would load my index.html file instead of getting a 404 page. And loading the index.html file would immediately lead to refetching that this.file.does.not.exist.js again and again.

If someone is going through this, make sure you handle 404s in your router