Hugo deploy to Google Cloud Storage (GCS)

[Edited, and links have a dot to avoid restriction]
Hi!, i have some problems related to GCS.

The problem is that were i upload content to the bucket, the content itself doesn’t present to the user properly, actually it appears a 404 error code at website.

This happen in special with some type of files like CSS, images, JS, and everything different of “index.html”.

I tested different combinations of things, like:

  • Changing baseURL:
    • using:
      baseURL = "ht.tps://storage.googleapis.com/<bucket name>"
      baseURL = "ht.tps://storage.googleapis.com/<bucket name>/"
      baseURL = "ht.tps://console.cloud.google.com/storage/browser/_details/<bucket name>"
      baseURL = "ht.tps://console.cloud.google.com/storage/browser/_details/<bucket name>/"
  • Changing layouts (this applies to CSS, JS and images, but the premise it’s the same):
  -  <link rel="icon" href="{{ .Site.BaseURL }}images/logo.png">
  -  <link rel="icon" href="{{ .Site.BaseURL }}/images/logo.png">

Please read Requesting Help first. Does it work locally?

Thanks for the reply, i miss some things to explain.

Answering to your question, yes, the site works locally.

So here is more details:

1.- Site works at localhost
2.- Site works at gitlab pages (self-hosted and gitlab saas).
3.- Site works at local network

BTW, i upload all the repo and that to this link:

If you need more useful information.

unless you expect other people to try deploying on GGS too, you didn’t explain the issue at all beside “it doesn’t work”. So you get a bunch of html files and images, js files and css stylesheets can not be reached ? What happens when you enter their URL ?

Follow these instructions

This is the result:

“that” doesn’t work. The load of JS, CSS, and other stuff.

I followed and doesn’t work neither.

Then the files are not where the browser is looking for them. Fix the paths.

And: your chances to get help are better, I think, if you provide more information than „it doesn’t work“. Sentences like „site works at local network“ might make sense to you. They don’t for me, for example.

Thanks for the suggestion.

Now, due the confusion of the question, i’ll edit the question and reformulate with more elaborated information.

It’s not very clear if your repo is the source of your website or the source of a theme you’re going to develop. If you want to use the Hugo Hero Theme I recommend to initialize your configuration otherwise. The content in /content, the theme in /themes/hugo-hero-theme and the config.toml at the root. The configuration you are using is for themes demos. You can look at this example: GitHub - theNewDynamic/andrewkrivak.com (randomly selected).

I checked the documentation and some forums looking for some example or help and nothing works.

An important point to say it’s that if i test the site at localhost, localnet, gitlab pages (on-prem, SaaS, etc), the site works fine and the resources are showed correctly (error code 200), so the problem looks like that are at GCS side. Another important thing to say it’s that the site needs to be deployed completely at GCS, not passing through firebase, this is to avoid add complexity to IAM policies and use the same policies as GCS bucket, the main use, right now isn’t very important.

Another thing to say it’s that the “deployment” were tested in different ways:

  • Using (hugo) deploy.
  • Using gsutils rsync .
  • Using (hugo) with some specific syntax:
    • hugo --themesDir …/…
    • hugo --gc --themesDir …/…
    • hugo --gc --minify --themesDir …/…

Just a last advice: if your static website works everywhere except on GCS, so it’s perhaps not a Hugo problem. Check your baseURL config, and look at my last advice.

The repo it’s the source of the pages, related to theme, can be any other, it’s just an example of theme.

Well, my last edit must be splitted on 3 different post, but i said:

One last fact that i notice it’s that GCP deploy some content on a URL, and some content in another URL, for example,


- <ht.tps://ff95ba6a17ce78e09d12884596855510b525af5c46eb5c8fe9f12b4-apidata.googleusercontent.com/.../o/index.html>


- <ht.tps://ff11a96cf034f67b299841f7146ac1fba101c623da14329b7d282c1-apidata.googleusercontent.com/.../o/css%2Fstyle.min.d68eb8c5d77e643ac4e8492b34e44e1c203d3472e5922b2fae2b7a3791671414.css>

If i look quickly, both URL, they aren’t on the same URL so that explain the error 404:

Even, i tried to change the theme, just in case that the theme be the problem, and nothing, the behaviour it’s always the same.

So here comes the main question:

How should i configure hugo, config.toml, theme.toml or layouts (or GCP also), to make the site available and the resources show / display / serve properly and the content load as another platforms mentioned before.

It’s related of how GCS works, sorry I don’t know how it works… (But same advice: change the baseURL in your config.toml for the address at which GCS serves your website.)

Thanks for the tip.

At the modification of the question i mention:

I tested different combinations of things, like:

  • Changing baseURL:
    • using:
      baseURL = "ht.tps://storage.googleapis.com/<bucket name>"
      baseURL = "ht.tps://storage.googleapis.com/<bucket name>/"
      baseURL = "ht.tps://console.cloud.google.com/storage/browser/_details/<bucket name>"
      baseURL = "ht.tps://console.cloud.google.com/storage/browser/_details/<bucket name>/"
  • Changing layouts (this applies to CSS, JS and images, but the premise it’s the same):
  -  <link rel="icon" href="{{ .Site.BaseURL }}images/logo.png">
  -  <link rel="icon" href="{{ .Site.BaseURL }}/images/logo.png">

And the result it’s the same.

If your website is full functional on GitLab Pages or elsewhere so you have to find a solution on GCS support. You can’t choose a custom domain on GCS? BTW I don’t understand why you have ht.tps://storage.googleapis.com/<bucket name> and not https://storage.googleapis.com/<bucket name> :thinking:

Thanks @Ian_Fleming for the clarification on DM, the ht.tps is due to discourse limitation.

Ok, i discover something interesting, here are some notes:

I tested another completely different site (not with hugo). I look for a simple HTML site with dependencies on the same folder and another with dependencies on another folder; for example:

1.- folder/index.html, folder/style.css → This resources are displayed correctly to end-user
2.- folder/index.html, folder/js/script.js → This resources aren’t displayed correctly to end-user and trigger 404 errors:

So the problem itself isn’t hugo (of course, i never blamed hugo for this issue, just a little guide to fix this problem) but GCS and i’ll try to find a way to fix this.

Now, another question, to which project should i raise this issue, if someone knows (meanwhile i look for that info), i’ll be very grateful.

And … i don’t know if the documentation related to “GCS” should be updated, because isn’t so much as “hugo deploy” and “magic!”.