1

I am currently working the first time with vue-router and I am wondering if there is a way to handle redirecting through vue or if there are other options in a node.js environment to do so.

For example, if someone wants to visit my site through typing the URL

example.com/contact

he will currently get to

example.com/contact#/home 

But of course I want to redirect to the correct path.

2
  • 2
    If you want it to catch it before the actual SPA entry point has been accessed and a client service worker can be loaded, you need to do it server side. If it is a node server this might be relevant: stackoverflow.com/questions/4062260/… Otherwise it is done by editing .htaccess for Apache or web.config for IIS Commented Apr 13, 2018 at 10:29
  • If you mean to redirect to different URLs within your Vue application, with vue-router you can use router.push() (see navigation) or the redirect directive inside the router configuration (see Redirect). If you want to navigate to a totally different URL, you could change window.location. Otherwise, if you want it to take place before the app has taken control, you have to do it from the server. Commented Apr 13, 2018 at 10:32

1 Answer 1

1

You have two options.

The first one is to keep using hash router, which means that you will have to add a hashtag before the path so the correct url would be example.com#/contact. Hash router has the benefit that it works with your web server out of the box without any other configuration.

Another option is to switch to history mode on the Vue router. History mode lets you have URLs without the hashtag, however there's a drawback that it doesn't work with most web servers without separate configuration. The link above includes the necessary configurations for many web servers, where you will need to add it somewhere depending on the web server.

Sign up to request clarification or add additional context in comments.

Comments

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.