Can't get netlify.toml redirects to work

Support
,
1

Hello,

I’m getting the usual 404 Page not found error when refreshing the page on my react app. I placed netlify.toml file at the root of my repo containing:

[[redirects]]
  from = "/*"
  to = "/index.html"
  status = 200
  
[[redirects]]
  from = "/admin_api/*"
  to = "https://staging.myapiurl.com/admin_api/:splat"
  status = 200
  
[[redirects]]
  from = "/v1/query/*"
  to = "https://staging.myapiurl.com/v1/query/:splat"
  status = 200

Here is link to the website.

Please note that I’m using monorepo, and netlify.toml file is in the root of the repo, though I’m building from subdirectory. API redirects doesn’t work as well.

Any help would be appreciated. Thanks.

1 Like
2

Completely guessing here, but perhaps you might need
force=true
for each of those.

Good Luck!

3

I tried adding force=true to no avail :frowning:

1 Like
4

hmm…

about half-way down on this post

There is advice on a _redirect file (not .toml) file I’m adding today.

I know it’s a shot-in-the dark, but it may leave a hint. There is a 301 splat in there which may be key…

Other than that, I’m sure someone will be along to help you. Who knows about this stuff.

GL!

1 Like
5

Could get this working by generating _redirects file. But still would like to know why it wasn’t working. It’s frustrating that I had to spend a day in this.

7

Did you try processing your redirects code through the Netlify playground?

8

@almas, with the new monorepo support, if a base directory is declared (other than the base of the repo itself), then Netlify changes to that directory and - here’s the catch - it restarts processing from that directory.

This means that when post processing occurs, Netlify will not read the redirects configured in the netlify.toml in the base of the repo - even though it did read that file to change into the new directory for the build processes.

This is because the base setting is read during pre-processing and redirects are read during post processing. This is new behavior introduced by the new monorepo support and we are looking at improving how this is handled.

The workaround for now is the one you have discovered, to include the rules in a _redirects file in the publish directory.

I understand that troubleshooting this on your own was less than ideal and we thank you for creating this forum topic. Hopefully, other people will find this forum post and benefit from your experiences by finding the solution for this here.

As always, if there are any other questions about this - please let us know.

3 Likes
9

Thanks for answer. The reason I went with toml file instead of _redirects one, is I want to have different _redirects depending on the environment (production/staging branches). Currently I’m using this workaround in webpack.config.js:

const redirectsFileContent = fs
  .readFileSync(path.resolve(__dirname, "../_redirects.template"), "utf8")
  .replace(/BASE_URL/g, getAPIBaseURL());

then below adding this to plugins array:

new CreateFileWebpack({
  path: "./dist",
  fileName: "_redirects",
  content: redirectsFileContent
}),
10

I had the same issue and was completely perplexed because I have pre-existing projects that rely on the pre “monorepo support” behavior.

So far, this cost me 3 hours because this is effectively impossible to debug without knowing what you shared @luke.

Now I have to waste more time to go fiddle with webpack and a _redirects file.

On top of the fact that the “monorepo” update is actually misleading and incomplete, I am utterly disappointed with netlify, a service that I had heretofore come to love.

11

hi @chishaku - that indeed sounds frustrating.

I’ll make sure these concerns get voiced re: monorepo support - but I’m curious as to why you’re thinking that monorepo is misleading and incomplete? If there are things we hadn’t considered, I’d love to add them to the list, if feasible.

12

On each of my redirects in each of my netlify.toml files, the status is:

status = 301

I also have “force = false”, as noted by others.

13

Hmm, didn’t understand if there was a question in there but let me know if I missed something :slight_smile:

14

Sorry for my terseness. I was trying to point out the differences between my working redirects and his apparently non-working redirects.

He has status = 200; I have status = 301

He has no force = false

I don’t know what – if any – difference there would be in the redirect, just pointing out what I noticed.

15

Is it possible to rewrite a url and keep the url in the address bar?

16

It’s been awhile since anyone did this, but I believe you can do this using either frames or iframes, although you could also (thanks to Netlify) have two sites built off of the same git codebase, but with different URLs. You would have to use relative links among the pages and other assets on your site, but it this should be trivial.

17

I considered iframes, and i’m currently using a 200 with force = true to load the content at the destination if i’ve configured it correctly.

i’ll let you know @gregraven

18

@gregraven I implemented the iframe but it’s not ideal for my use case. Contacted the DNS provider about a subdomain.

Then I’ll look into DNS settings in Netlify. :slightly_smiling_face:

19

If there are other questions, @berni, we’re happy to answer.

20

Yeah, frames have been deprecated and iframes are useful but not universally so.

Back in the olden days, some registrars used to offer the ability to do URL masking (AKA URL cloaking) so you could render other domains as if they were your own domain. I don’t know if any still offer this, and at any rate it’s bad practice, but for a temporary transition it might help … assuming your registrar supports it.

21

@gregraven the iframe solution didn’t work out for me.

So I’m looking into a redirect / rewrite rule in .toml instead.