Duplicate URL at deployed Hugo site

support
1

I’m really enjoying Hugo so far! My setup → uploaded ‘public folder’ files to S3 bucket → cloudfront distribution with custom domain name.(Using Route 53 for DNS)

The issue I can’t seem to fix is that when I go to the domain the CSS and fonts are not loading. When I try to visit a post I can see that there is duplicate url. In this case: https://example.com/posts/how_tobackup/

What I tried so far. I read the [Requesting Help] post, and found out about how import the baseurl is.

  1. Check MIME type in S3 bucket for right type: not plain text but css or js
  2. Tried multiple baseurl variations: baseURL = “https://example.com” and “/” and “.”
  3. Site is working correctly with hugo server

I’m really pulling my hair out because if this issue. Thank you very much for thinking with me :slight_smile:

2

Deployed site: https://example.com
Github repo: -
Theme: hugo-theme-even

3

This appears to be a server-side problem. When I visit:

https://example.org/posts/foo/

I see this:

image
image1534×234 35.5 KB

1 Like
4

You are right. I changed the baseurl to https://thomasbrinkman.nl/ note the / which fixed the issue. After I changed to S3 bucket properties → enable static site hosting → true. The .css is also rendering. The site seems to be working only linking to other pages and posts seems to be broken. I’m pretty sure this is a AWS S3 & Cloudfront issue. My apologies for creating the post. I will try to post a update when I found the answer.

Sources with multiple ways of fixing:

5

I have found a solution. The site is operating perfectly now. The solution is creating a lamba function that works at the cloudfront CDN. It fixes the redirecting to example.com/page-namepost-/index.html. I will remove the parts that will link the blog domain.

6

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