Redirect users to new URL based on current URL
I'll be using JavaScript and the new feature called URLSearchParams for creating a new url out of the current URL and forward the user to it.
Why?
My use case was to forward my users to Google Play Store on Android using a link shared through Unity Android application. Now the Play Store link or Market link will not be detected as a browser request but regular text.
Market link looks like this: market://details?id=com.shiftescape.meowity&referrer=EFFX
This link when opened in computer web browser will lead to nothing. When opened in Google Chrome it would rather make a search.
Only other solution is to force the user's browser to open link and not do a search.
For this we'll be making a little website which will forward any visitor to our modified link retaining their referral code.
Initial Setup
XAMPP server installed and Apache module running.
For running our JavaScript code let's make a new web page index.html
<!DOCTYPE html>
<html>
<body>
<h2>Click the button</h2>
<p>Upon clicking you'll be forwarded to shiftescape.com</p>
<button onclick="forward()">Click me!</button>
<script>
var newUrl = "https://www.shiftescape.com";
function forward() {
location.replace(newUrl)
}
</script>
</body>
</html>
Now we need to grab the parameters from current url and add them to newUrl. For example if I open http://localhost/referid/?referrer=RX098787 it will still open the same page.
But I can use these get parameters to modify the newUrl I have to forward my users to.
To grab the parameters in url we will use URLSearchParams supported by Firefox 44+, Opera 36+, Edge 17+, Safari 10.3+ and Chrome 49+.
<!DOCTYPE html>
<html>
<body>
<h2>Click the button</h2>
<p>Upon clicking you'll be forwarded to shiftescape.com</p>
<button onclick="forward()">Click me!</button>
<script>
let params = new URLSearchParams(location.search);
var referralID = params.get('referrer');
//var newUrl = "market://details?id=com.shiftescape.meowity&referrer=" + referralID;
var newUrl = "http://www.shiftescape.com/referredBy=" + referralID;
function forward() {
location.replace(newUrl)
}
</script>
</body>
</html>
Now we also add a timeout for this method instead of clicking the button.
<!DOCTYPE html>
<html>
<body>
<p>You'll be redirected in a sec..</p>
<script>
setTimeout(function(){
let params = new URLSearchParams(location.search);
var referralID = params.get('referrer');
//var newUrl = "market://details?id=com.shiftescape.meowity&referrer=" + referralID;
var newUrl = "http://www.shiftescape.com/referredBy=" + referralID;
location.replace(newUrl);
}, 1000);
</script>
</body>
</html>
That's it.
I commented out the newUrl part for forwarding users to Google Play Store as this cannot be tested on Chrome on PC.
For context and search visibility.
Redirect users to Google Playstore or App Store.
Custom redirect using JavaScript.
Change URL from current URL.
How to use URLSearchParams.
