How to skip external redirection page using history back function?-CodePudding

Let's say an external site has a redirection page before actually moving to the internal site when user clicks the link. This internal site only has a button that will let you go back using History.back() or .go(-x). I can only do changes on the internal site.

What's happening here is that we now have a "loop" that redirects to the external redirection page using history.back(), and then the user will be redirected once again to the internal site.

Flow:

External site -> user clicks on internal site link -> external site sends user to external redirection page -> user redirects to visit the internal site -> user click history.back button -> user get redirected to external redirection page -> user redirects to visit the internal site again

I basically do not want the user to end up at the internal site after users clicks the history.back button.

I thought about saving page visit in localstorage, so that if it gets redirected back to the internal site again it will instead do history.go(-2). I am also aware of https://developer.mozilla.org/en-US/docs/Web/API/Document/referrer document.referrer, but that will also degrade the UX since the user gets redirected back and forth at least once.

The only solution I could think of is having a query parameter upon visiting the internal site someurl.com/?redirects=2, so that we could do history.go(-redirects). However, that requires the external site to decide how many redirects it has.

Is it possible to know if user comes from a redirection page from the external site? Is there a way so that we can skip the external redirection page and just go straight to the external page?

CodePudding user response：

I came up with a solution to the problem, but my approach does use document.referrer.

Regarding UX degradation when using document.referrer, it should be barely noticeable as long as your clientside code is optimized.

Also, you might be interested to read this MDN Article. My solution approach is attached here:

const isExternalURL = (url) => new URL(url).origin !== location.origin;

function checkExternalURL() {
  const referrerPage = document.referrer;
  if (referrerPage == undefined) return false;
  return isExternalURL(referrerPage);
}

if (checkExternalURL()) {
  console.log("External URL Detected");
} else {
  console.log("Internal URL Detected");
}

CodePudding user response：

window.location.replace is there for exactly the same requirement, please refer https://developer.mozilla.org/en-US/docs/Web/API/Location/replace

Assuming that the external rediection page contains only the logic for rediection and no content, they should have used location.replace for redirection to have a clean state of history.

I know that you do not have control over external site but I just wanted to help in case you can ask someone to make changes there :)