Path of resources (image, css etc) on caddy proxy

Help
1

Hi,
I am developing a plugin to verify the user and serve the requested web page after validation. For the validation purpose, I have a html page in go. The go page looks like the following:

const redirectPageTemplate = `Some html with form for validation`

I use the following go code to show this page:

 tpl, err := template.New("authPage").Parse(redirectPageTemplate)
 err = tpl.Execute(w, data)

Now I have some images and css for the page. How the path actually works when the proxy serves the page? I put my images and other resources to resources/ path. I used the path of the image in the code as src="/resources/logo.jpg", but the page doesn’t show the image. It says it cannot find the image.

Where should I put the images and how can I show them in my page? The same question apply for any css files and corresponding classes.

Any help is highly appreciated.

2

Hi @masumbuet,

You’ve got two options, really. You can either inline your CSS, JS, and images (the latter can be done with a data URI), or you can link them in the HTML and make sure your plugin serves the correct resource in response to a request to wherever you linked.

3

Thanks for the quick response.

Can you please give me an example, how I can blend the image through data URI?

For case 2, I tried that option with <img alt="test" class="logo" src="/resources/logo.png" />, used root / in Caddyfile and made sure the docker container contains logo.png inside resources directory at the root level. But it’s not showing the image. Not sure, where I am making mistakes.

4

I would strongly recommend against setting the web root to the root of your file system.

Imagine a third party making a request for /etc/passwd and /etc/shadow, for example.

I would set root /var/www/html and move your logo file to /var/www/html/resources/logo.png. You’ll need to make sure that your plugin doesn’t handle this request instead passes it down the middleware chain where it will end up being handled by the static file server.

Otherwise, you can upload your PNG to a data URI converter and paste the resulting img tag in your HTML.

5

Thanks a lot! It works if I pass through the request and allow the static file server to serve. I also changed the path as well.

6

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