Rewrite Rule Affecting All Files Under /shop/ Path Unexpectedly

[dorngwellness1]

Hi everyone,

I’m encountering an issue with a rewrite rule in my Vercel project that I could use some help with. Here’s the situation:

I have the following rewrite rule in my vercel.json:

{
“rewrites”: [
{
“source”: “/shop/:nameAndId”,
“destination”: “/product”
}
]
}

Problem:

The intention of this rule is to rewrite URLs like https://mydomain.com/shop/fibroid-fertility-tea-10 to https://mydomain.com/product/fibroid-fertility-tea-10. However, after applying this rule, I noticed that all files and assets under the /shop/ path (such as HTML files, images, and other resources) are being affected by this rewrite.

For example:

• URLs like https://mydomain.com/shop/somefile.html or https://mydomain.com/shop/image.png are also getting redirected to /product/somefile.html and /product/image.png respectively, which is not the desired behavior.

Question:

How can I configure the rewrite rule so that only URLs matching the /shop/:nameAndId pattern are rewritten to /product/:nameAndId without affecting other files and resources under the /shop/ path?

Is there a way to exclude certain files or directories from this rewrite or to make the rule more specific so it doesn’t interfere with my static assets?

Any help or guidance would be greatly appreciated!

Thanks!

[amyegan]

Hi @dorngwellness1. There’s more than one way to handle rewrites, so I’ll share a list of options and leave you to choose which makes most sense for your project.

• You could use regex to make the /:nameAndId selector more specific.

• You could make a change to the folder structure so the other resources are deployed at a slightly different path (either a sub-directory or an entirely different path).

• You could use Edge Middleware to handle path filtering for rewrites.

• You could use some version of dynamic routes if the project uses a framework that supports that type of routing.

[dorngwellness1]

All this are not my issues but my issue is that the rewrite rule is working as it should work cause i want to rewrite any request that comes to /shop/path to /product but this is successful but the issue am having is that all the url in the /product pages now have the /shop as the main dir after the origin which leads to paths that do not exist so i just want the rewrite rule to only apply to the url not the whole file please can you just help me do so this is my current rule:

"rewrites": [
  {
    "source": "/shop/:nameAndId*",
    "destination": "/product"
  }
  ]

this is the first image look closely at the bottom left the home url is pointing at dorngwellness.com/index.html which is the correct path

but look at this closely also at the bottom left this is after the rewrite rule has been applied now the dorngwellness.com/index.html now turns to dorngwellness.com/shop/index.com why can’t it still remain as it is since i did noting to the file or is the rewrite rule affecting it or am i not doing it properly?

it was a screen shot that’s why my cursor is not showing am actively pointing at the Home tab at the top left corner of the page

[amyegan]

Ah, the original post made me think you had a different problem. That’s why I suggested ways for you to limit the rewrite rule or avoid the conflict.

Using a relative path for the Home link is the most likely cause of problem you described in the second post. Instead of href="index.html", try href="/" or href="/index.html" for that link. Does that fix it for you?

[dorngwellness1]

it’s href=“/index.html” in my file but after the rewrite rule it just turns to href=“shop/index.html” that’s where the issue is…

or you can just route to the website and test it your self route to dorngwellness.com/shop then observe the url i had to create another sub directory of /shop under /shop/shop just to show /shop when it routes to the /shop just tiring

[dorngwellness1]

Thanks this helped a lot it just didn’t look like the answer or what would have helped but everything is fine now no need for sub dir but in local host it can’t find the path to /index.htm but it does online without including the /shop am really grateful most at times the answer do not really look like one