Skip to main content

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.




Comments

Popular posts from this blog

Unity Mobile Game Optimization Checklist

- On Image and Text components that aren’t interacted with you can uncheck “Raycast Target” on it, as it will remove them from any Raycast calculus. - Click on your textures in your “Project” window. Click on the “Advanced” arrow, and now check “Generate Mip Maps”, Unity especially recommends it for faster texture loading time and a lower rendering time. - Set the “Shadow Cascades” to “No Cascades” (Quality settings) - If you have dynamic UI elements like a Scroll Rect with a lot of elements to visualize, a good practice is to turn off the pixel perfect check box on the canvas that contains the list and disable the items that aren’t visible on the screen. - Set all non moving objects to "Static" - Above Unity3d 2017.2 you should turn off "autoSyncTransforms" on the Physics tab - Always use Crunch Compression Low on textures - Try to keep the “Collision Detection Mode” on “Discrete” if possible, as “Dynamic” demands more performance. - You can go to the TimeManager w...

How to make RPC in Unreal Engine Steam Online Subsystem and EOS

Remote Procedure Calls, also known as RPCs, are a way to call something on any other instance.  In the Unreal Engine, RPCs are used to ship events from the patron to the server, the server to the customer, or from the server to a specific group. It's important to word that RPCs cannot have a return cost. If you want to return something, you'll ought to use a seconds RPC within the contrary path. There are precise policies that RPCs observe, which are unique in the official Documentation. Some of these regulations encompass wherein the RPC must be run, such as the server instance of an Actor, on the owner of the Actor, or on all instances of the Actor. There are some necessities for RPCs. First, they must be referred to as on Actors or replicated Subobjects. The Actor (and component) have to additionally be replicated. If the server is looking an RPC to be executed on a customer, handiest the patron who owns that Actor will execute the function. Similarly, if a client is calling...

How to fix clothes flickering in Unreal Engine 5.

 This issue can be noticed some of the character clothes when using Paragon Characters in UE5. To fix the flickering issue, Use Self Collisions checkbox in collisions properties under the Static Mesh option of your character. Open the character model go to   Asset Details > Clothing Properties - Cloth Config - ChaosClothConfig - Collision Properties - Use Self Collisions > False