vue-storefront: 404 and infinite redirect on category pages in multistore mode

Current behavior

If I got to a category page in a non-default store like http://www.test.de/de/boys.html the page will return a 404 (in multistore mode). But it will work in the default store without store-code in url like http://www.test.de/de/boys.html.

I first tracked it down to the changes for the new 404 page from #3296 & #3243, when the beforeEachGuard in core/modules/url/router/beforeEach.ts is asking for to.matched[0].name === 'page-not-found' but the route name in multistore mode will be like de-page-not-found. So I changed it to to.matched[0].name.endsWith('page-not-found') to support multistores at this point.

Now it will serve the correct category page but will end in an infinite redirect in the browser (client-side) floating the memory.

The next thing I noticed is that the matched dynamicRoutes of UrlDispatchMapper are have url paths like /uk/de/boys.html after some infinite loops, so I looked at the processDynamicRoute method in core/modules/url/helpers/index.ts and fixed this by removing the store-code from path using removeStoreCodeFromRoute like:

import { removeStoreCodeFromRoute } from '@vue-storefront/core/lib/multistore'
…

export function processDynamicRoute (routeData: LocalizedRoute, fullPath: string, addToRoutes: boolean = true): LocalizedRoute[] {
  fullPath = removeStoreCodeFromRoute(fullPath) as string
  ...
}

(I have mentioned this in https://github.com/DivanteLtd/vue-storefront/issues/3359#issuecomment-523325285 before – probably at the wrong place)

Now the url paths in the dynamicRoutes is correct, but there still is this infinite redirect on the client-side. It is always calling the de-page-not-found route, again and again. The server-side response and code is delivered correctly.

… I will try to track this down a little further and will keep you updated – but If you have any hints or already an idea what could cause this, please let me know.

Expected behavior

Should also show category page with store-code in URL path.

Steps to reproduce the issue

  1. Set storeViews.multistore to true
  2. Go to specific store category page like http://localhost:3000/de/women/tops-women/jackets-women/jackets-23
  3. It should return a 404 response
  4. If you go to the same page without a store-code like http://localhost:3000/women/tops-women/jackets-women/jackets-23, it should work

Repository

develop (since 3d2b4a2e69b8e0707f7ecd58c320fb0172a27271)

Can you handle fixing this bug by yourself?

  • YES (I try, and will let you know if I could)
  • NO

Which Release Cycle state this refers to? Info for developer.

Pick one option.

  • This is a bug report for test version on https://test.storefrontcloud.io - In this case Developer should create branch from develop branch and create Pull Request 2. Feature / Improvement back to develop.
  • This is a bug report for current Release Candidate version on https://next.storefrontcloud.io - In this case Developer should create branch from release branch and create Pull Request 3. Stabilisation fix back to release.
  • This is a bug report for current Stable version on https://demo.storefrontcloud.io and should be placed in next stable version hotfix - In this case Developer should create branch from hotfix or master branch and create Pull Request 4. Hotfix back to hotfix.

Environment details

  • Browser: Chrome
  • OS: OSX
  • Node: 10 LTS
  • Code Version: 1.11.0-rc.1 - develop 3d2b4a2e69b8e0707f7ecd58c320fb0172a27271

About this issue

  • Original URL
  • State: closed
  • Created 5 years ago
  • Comments: 16 (10 by maintainers)

Commits related to this issue

Most upvoted comments

Great job! I really liked the teamwork spirit shown by this issue. So, cool! 😃