Will vue-router hash mode be supported?

[ksakiyama]

Hi,

These samples works well only in vue-router history mode. But the default for vue-router is hash mode. Do you have a plan to support hash mode in the future?

[adamjmcgrath]

Hi @ksakiyama ,

You should be able to support hash mode in Vue by changing your onRedirectCallback handler to remove the query params from the redirected page.

eg: In https://github.com/auth0-samples/auth0-vue-samples/blob/master/02-Calling-an-API/src/main.js#L20-L26

Change:

  onRedirectCallback: appState => {
    router.push(
      appState && appState.targetUrl
        ? appState.targetUrl
        : window.location.pathname
    );
  }

to:

  onRedirectCallback: appState => {
    history.replaceState({}, document.title, window.location.pathname); // <=
    router.push(
      appState && appState.targetUrl
        ? appState.targetUrl
        : window.location.pathname
    );
  }

This is because in hash mode router.push isn't enough to remove the query parameters from the page's url - since the router will only operate on the fragment (# part) of the url.

Without this, the code and state parameters wouldn't be removed from the url and you would probably be seeing some Invalid state errors when you refresh the page.

Am closing this, feel free to reopen if this hasn't answered your question.

[ksakiyama]

Hi @adamjmcgrath ,
I appreciate your kindness.