Redirect user based on useragent - javascript

I don't know JavaScript at all. However, I've made an Android app in which I'm using a WebView to load a webpage. I have a Share option in the menu that allows to share the URL that's then loaded in the WebView.
For a particular page, I would like the users who are not using the app to be redirected to a different page. To make this possible, my Android app is using a custom user agent (say CustomUA, in this case). So, whenever my app loads this particular webpage (say page1.html), I want it to load normally inside the app. However, suppose the URL is shared, I would like the URL to be redirected to say page2.html if it's visited using any browser. Basically, I want only the UA of my app to be able to access page1.html and every other UA is to be redirected to page2.html.
I suppose this can be done using JavaScript as I read some other solutions. I couldn't implement those as they were not exactly my case and I'm not sure how to implement them. I suppose, I just have to place that script in my page's body?
Also, just in case, if I'm supposed to include multiple user agents in the whitelist (i.e., if I want CustomUA and CustomUA 2, both to be able to access the webpage), how do I modify the code?
EDIT:
I have found this code to be included in <head>:
<script>
if ((navigator.userAgent.indexOf('MSIE') >= 0) && (navigator.userAgent.indexOf('Opera') < 0))
{
window.location.replace("your page");
}
else
{
window.location.replace("your page");
}
</script>
Now, can someone lease help me to modify it according to my needs? I just want the webpage to be redirected if it's not my custom User Agent and to stay on the same page if it is.
EDIT:
I have used the code like this:
<script>
if ((navigator.userAgent.indexOf('customUA') < 0)
{
window.location.replace("page2.html");
}
</script>
however, I'm getting Uncaught SyntaxError: Unexpected token { eror in console and the redirect isn't working.
EDIT:
Got around the Uncaught error. New code:
<script type="text/javascript">
if (navigator.userAgent.indexOf('customUA') >= 0)
{
window.location.replace("page2.html");
}
</script>
Now, it's working fine in either of the one i.e., it'll redirect where I don't want it to and vice versa. I've tried multiple expressions like < 0, > 0, == -1, etc. None worked fine. Basically, it's not giving the expected results. I'm this close to find my answer.. please, help!

Some guys from a forum helped me, also, I was setting the wrong user agent (the one that I had defined in my app was different than what I had typed in this script). So, here goes the code:
<script type="text/javascript">
var uaCheck = navigator.userAgent.indexOf('Custom User Agent');
if (uaCheck == -1)
{
window.location.replace("https://www.domain.tld/redirected-page.html");
}
</script>
And this is the code if there are multiple user agents:
<script type="text/javascript">
function isMyAppUA(testUA)
{
if(testUA == undefined) return false;
var appUAList =
[
'customUA1', 'customUA2', 'customUA3', ..., 'customUAn'
];
appUAList.forEach((ua) =>
{
if(testUA.indexOf(ua) > -1)
{
return true;
}
});
return false;
}
if(!isMyAppUA(navigator.userAgent))
{
window.location.replace("https://www.domain.tld/redirected-page.html");
}
</script>
There's a shorter version of this code if the list of user agents is small:
<script type="text/javascript">
if (navigator.userAgent.indexOf('customUA') == -1 || navigator.userAgent.indexOf('customUA2') == -1)
{
window.location.replace("https://www.domain.tld/redirected-page.html");
}
</script>
Any of these codes go in the <head> of the HTML page.

First off, unless there is good technical reason to want to do this, don't. This is the internet; let people access your pages however they wish.
Second, it might be easier to do this the other way around- have a set of normal pages on the web, but if they are accessed in the app, the app detects them, and navigates to an app-specific version.
Finally, if you do do this, for easily handling multiple user agents, you would want to make an array containing all the user agent strings you want, and loop through them to check each one. Follow your favorite JavaScript tutorial on arrays, loops, etc.

Related

how to restrict access to a webpage if previouse page was not a specific page

I have a QR Code that brings users to PAGE A that immediately forwards to PAGE B. I want Page B to check if users came from PAGE A otherwise forwards them to PAGE C (basically say you need visit PAGE A first). The end result is that Scanning the QR Code allows access to PAGE B through PAGE A but someone can't start on PAGE B without previously being on PAGE A (unless they type it in) It's not foolproof by any means, but it's a deterrent.
On Page B I am using:
if (history.back!="[page a url]") {
location.assign("[page c url]");
}
but this doesn't seem to work.
BTW I'm hacking my way through learning any of this by trying to learn what I need to do what I need to do - please assume I know very little
By your tags, I see that you are using WIX. I'm not sure if you have access to server side there so my answer is in javascript. This isn't full proof as you can't trust anything sent from the browser.
On page A, use localStorage to set a variable visitedA to 1 then redirect to page B.
<script>
localStorage.setItem("visitedA","1");
location.href = "pageB.html";
</script>
On page B check if visitedA equals 0, then redirect to C.
<script>
let visitedA = localStorage.getItem("visitedA") || "0";
if(visitedA == "0"){
location.href = "pageC.html";
}
</script>
Using Document.referrer is a good and most straightforward solution to this problem.
https://developer.mozilla.org/en-US/docs/Web/API/Document/referrer
example:
<script>
// did user come from page a?
if (document.referrer.includes('page-a') {
// yes page-a was in the referrer
} else {
// no, referrer was empty or did not include page a
}
</script>

Shopify page keep refreshing after being redirected by javascript code

I am trying to create a website https://fone-kase-plus.myshopify.com/ that will detect what device model it's being accessed from (for example GALAXY A40) so it will immediately redirect the user to a corresponding page.
It seems to be working, but it will reload the page multiple times after redirecting. If I try to redirect it to non-shopify page (eg stackoverflow.com) this problem doesn't occur.
function deviceAPIcallback(result){
if(result.deviceName == "desktop"){
window.location.href = "https://fone-kase-plus.myshopify.com/pages/galaxy-a40";
}
else{
alert(result.deviceName);
}
}
Can you please tell me what the problem can be or at least how I can detect it by dev tools?
Thanks
When I go to the site from both my macOS laptop and my iPhone I only get the alert aspect of your function. What does result.deviceName return? You might need to add a third '=' to your first 'if' statement.
function deviceAPIcallback(result) {
if(result.deviceName === "desktop") {
window.location.href = 'https...';
} else {
alert(result.deviceName);
}
}

JS redirect according to user agent?

I'm sorry if that question is obvious to solve, but I don't know JavaScript yet but feels like it's the only way to implement what my clients need for their website.
I want to redirect users with specific browser to the specific simplified page once they visit homepage and keep this redirection work everytime they click on homepage button. Basically what I want is a 301 redirect based on user-agent. I've tried many times but all I've got was an infinte redirection loop or no result at all.
function get_ya_browser(){
var ua = navigator.userAgent;
if (ua.search(/YaBrowser/) > 0) document.location.href='redirect-link.html';
return '';
}
How could I change this code to work? Would really appreciate any help.
Try - document.location.replace ='redirect-link.html';
instead of document.location.href ='redirect-link.html';
.location.replace() simulates a HTTP redirect
.location.href() simulates a mouseclick
If the code was part of redirect-link.html && ua.search(/YaBrowser/) !== -1, you will get an infinite loop.
following code solved this problem:
function get_ya_browser(){
var ua = navigator.userAgent;
if (ua.search(/YaBrowser/) !== -1 && !location.href.includes('elbrus-m-zakaz.ru/home-page-windows-xp/')) {
document.location.href='//elbrus-m-zakaz.ru/home-page-windows-xp/';
}
}

Javascript function will not execute using Cookies

I made a javascript function and I am trying to execute it in the javascript area. However, it will not run. When I run the code it just does nothing. I am using Github, so if you want my full code, go to https://github.com/TheNumnut/Wars-of-Shares/blob/master/Login/index.html
I am trying to make a Login page for a game. I would rather use forms than prompts but I have not been able to do that. If somebody could tell me how to use forms I will greatly appreciate it.
This is my code:
function checkCookie(checkusername, checkpassword) {
if (getCookie("username") != "") {
setCookie("username", checkusername, 365);
setCookie("password", checkpassword, 365);
}
else {
if (checkusername != getCookie("username") {
alert("Username wrong");
}
else {
if (checkpassword != getCookie("password") {
alert("Password wrong");
}
}
}
window.open("https://thenumnut.github.io/Wars-of-Shares/", "_self");
}
checkCookie(prompt("Username"), prompt("Password: ");
Please have a look at my other code in Github, because it also has not been working. Especially the profile page. None of the clickable text and links have been working. The link to the Profile Page is https://github.com/TheNumnut/Wars-of-Shares/blob/master/Profile/index.html
Your JS code has syntax errors.
You're missing an extra ) in the 7th, 11th and 42th line.
You can press F12 on your browser and check the console tab, where javascript errors are displayed.
However, I need to agree with the other users that this login method is not a good practice and it's very easy to bypass.
JavaScript source is available to the user of any website. Since the JavaScript runs in the user's browser, the code has to be transferred to the user's browser so the browser knows what to do. This means I as the user can view the source. In this case, by viewing the source I can see the line:
window.open("https://thenumnut.github.io/Wars-of-Shares/", "_self");
So I can bypass your log in page just by looking at the page source and going straight to https://thenumnut.github.io/Wars-of-Shares/

How do i make a redirect a iPad user?

This has probably been answered before but i don't understand al the difficult research online so i ask it here And hope for a easy answer
<script type="text/javascript"> // <![CDATA[
if ((navigator.userAgent.indexOf('iPad') != -1)) {
location.replace = "http://www.joey-games.byethost4.com/games/";
} // ]]>
This does not redirect me.
var isiPad = navigator.userAgent.match(/iPad/i) != null;
//or by using
var ua = navigator.userAgent;
var isiPad = /iPad/i.test(ua)
You can find other related information in the following links:
http://fellowtuts.com/jquery/ipadiphone-detection-using-javascript/
Detect iPad users using jQuery?
Instead of using location.replace use location.href
Your snippet becomes
if (navigator.userAgent.indexOf('iPad') > -1) {
location.href = 'http://www.joey-games.byethost4.com/games/';
}
I've made two changes to your code
!= to > in the if statement which is no biggie (nothing relevant)
changed method call from replace to href Taken from MDN
The Location.replace() method replaces the current resource with the one at the provided URL. The difference from the assign() method is that after using replace() the current page will not be saved in session History, meaning the user won't be able to use the back button to navigate to it.
This basically says that if you use replace you cannot use the browsers back button to get to this page anymore, basically reducing the users user-experience since they'll get confused about what the back button does when they use your website.
This will redirect your users on the iPad to a different website however, you shouldn't do this - it's bad for your users and your website. (as partially explained above)
Iam Not gonna use The redirecting to go to "Joey-games.byethost4.com/games/" I wil redirect iPad users to: Joey-games.byethost4.com/mobile/iPad/ for a mobile site since flash player is not supported in safari yet

Categories

Resources