Check if URL has string

Question

hello, I am making a code using Typescript and I need to do a check to know which page the user is on, I am doing this check as follows:

const url = window.location.href;

if (url.indexOf("/Menu")) {
    alert("aqui")
}

but it’s not working well... when I run the code, go to index ne, at the following url: https://localhost:44390/ and he’s giving me the heads-up, even though he doesn’t have the /Menu. It also appears the alert on the menu page, but is clearly not working as it appears on both pages. Someone there can give me a hand?

The correct one would be to show the alert only in the url https://localhost:44390/Menu

Ask me one more question if you can... When I am on an Index page, in HTML, the url does not appear as follows: https://localhost:44390/Index, she appears without the /Index, that is to say: https://localhost:44390/... then how can I make a code that will check if I am on the index? When I’m on the menu, I can use the same in my example, because it has the /Menu, but the index has nothing that leaves as specific... as I do?

Answer 1

The .indexOf is to take the initial position of an occurrence of a string in another string.

That is, when it finds the first occurrence, it returns the initial position of that occurrence, which may be 0 (zero) up.

When it finds nothing, it returns a negative number -1. So you should check whether the result of .indexOf is a number equal to or greater than 0, or is simply different (or greater) than -1 (if positive) or equal to -1 or less than 0 (if you want negative return).

By just putting url.indexOf("/Menu") in the if, will always give true even finding nothing, because the number -1 is also true.

So it should be:

if (url.indexOf("/Menu") != -1) {
  ...
}

In the case of .match worked because he found the expression /Menu in the string, soon returning true, satisfying the if.

Check if it is in the index

You can check whether the last character is a bar or is not in a subfolder with a regular expression:

.+\/\/[A-z0-9:.]+(\/)?$

The expression checks if there are one or more characters before the two bars (//), and after them any letter, number, two points : or point . (in the case of type areas site.com.br), and whether or not there is a bar / in the end.

Testing:

function teste(url){
   console.clear();
   if(/.+\/\/[A-z0-9:.]+(\/)?$/.test(url)){
      console.log(url, "está no index");
   }else{
      console.log(url, "NÃO está no index");
   }
}

Clique num botão para testar:
<br><br>
<button onclick="teste('https://localhost:44390')">https://localhost:44390</button>
<br><br>
<button onclick="teste('https://localhost:44390/')">https://localhost:44390/</button>
<br><br>
<button onclick="teste('https://localhost:44390/Menu')">https://localhost:44390/Menu</button>

Answer 2

I didn’t quite understand why the index didn’t work, but I managed to figure it out using the match(). So it worked out this way:

const url = window.location.href;

if (url.match("/Menu")) {
    alert("aqui")
}

If anyone can help me understand why, I’d appreciate it.

Answer 3

So I guess using the:

const url = window.location.href;

You retrieve the value of your URL in a string, the indexOf is a possible position o -1(minus one) which is a non-existent position. Usually used to find the position of a String in array.

When using the match to find something in a String if it does not find it, the value will be returned null if you find it returns a corresponding value that must be a array with objects

If you want to understand more you can take a look at some links:

How to use the index.

How to use the match.

Ways to know if a String has a Substring.

Answer 4

Good afternoon Samuel,

The indexOf is used with simple strings, however the match makes use of a regular expression, of course it may be slower compared to indexOf, but the match can help you in more complex situations.

In the form below you may be able to use the indexOf, since it returns the index value of the position in the string.

const url = window.location.href;

if (url.indexOf("/Menu") > -1) {
    alert("aqui")
}

Hugs

Answer 5

Try to use.

window.location.pathname

It brings all the text of the url, without the hostname and port part, only the part after the domain.

Example: https://pt.stackoverflow/qustion/

Would return: question/

This way you would know which page the user is accessing. Related Post