Question 272675 in Javascript Question posted in
A very good W3school tutorial can be found here.

Javascript – How to retrieve all query params from the url wich has a redirect url as one of param

I have below logic to retrieve query PARAM form the application url. But this logic is not working when there is a url as a query param which has its own query parameters. Example below

Ex: https://test.domain.com?param1=a&ru=**https://url2.domain.com/?url2paramA=A&url2paramB=B**

In this example url2param2 is part of ru(redirect URL). when I try to retrieve ru parameter, its only giving the url part with first parameter in it. Second query parameter its considered as part of main URL.

Current Logic

const getParameterByName = (name, search) => {
  const match = RegExp('[?&]' + name + '=([^&]*)').exec(search);
  try {
    return match && decodeURIComponent(match[1].replace(/+/g, ' '));
  } catch {
    return match && match[1];

  }
};

var result = getParameterByName('ru', 'https://test.domain.com?param1=a&ru=https://url2.domain.com/?url2paramA=A&url2paramB=B');
console.log(result)
Tags:

3

Answers


  1. 0

    As mentioned in the comments, you may use the URL and URLSearchParams APIs:

    const plainUrl = 'https://test.domain.com?param1=a&ru=https://url2.domain.com/?url2paramA=A&url2paramB=B';

const url = new URL(plainUrl);

const result = url.searchParams.get('ru');

console.log(result);

    EDIT:

    If you want to consider paramB as part of the ru, you would have to encodeURIComponent the second URL:

    const plainMainUrl = 'https://test.domain.com?param1=a';

const plainRedirectUrl = 'https://url2.domain.com/?url2paramA=A&url2paramB=B';

// option 1: manual

const plainUrl1 = `${plainMainUrl}&ru=${encodeURIComponent(plainRedirectUrl)}`;

const url1 = new URL(plainUrl1);

const result1 = url1.searchParams.get('ru');

// end option 1


// option 2: URLSearchParams#append

const url2 = new URL(plainMainUrl);

url2.searchParams.append('ru', plainRedirectUrl);

const result2 = url2.searchParams.get('ru');

// end option 2

console.assert(result1 === result2 && result2 === plainRedirectUrl);
console.log(result1);
    Login or Signup to reply.
  2. 0

    This is because your redirect url is not encoded

    const getParameterByName = (name, search) => {
  const match = RegExp('[?&]' + name + '=([^&]*)').exec(search);
  try {
    return match && decodeURIComponent(match[1].replace(/+/g, ' '));
  } catch {
    return match && match[1];
  }
};

const url = `https://test.domain.com/param1=a&ru=${encodeURIComponent('https://url2.domain.com/url2paramA=A&url2paramB=B')}`;

console.log(getParameterByName('ru', url))
    Login or Signup to reply.
  3. 0

    Your code works perfectly, but in this code you extract the url between & using regex that’s why you didn’t get the url2paramB=B after &, but you need to pass the redirect URL between any special characters like your given URL.

    https://test.domain.com?param1=a&ru=**https://url2.domain.com/?url2paramA=A&url2paramB=B**

    This URL contains a special character (two asterisks(**)) so you can extract the redirect URL between these asterisks(*).

    Try this code:

    const getParameterByName = (name, search) => {
  const match = RegExp(`${name}=\*{2}(.*?)\*{2}`).exec(search);
  return match ? match[1] : null;
};

var result = getParameterByName('ru', 'https://test.domain.com?param1=a&ru=**https://url2.domain.com/?url2paramA=A&url2paramB=B**');
console.log(result)
    Login or Signup to reply.
Please signup or login to give your own answer.

Back To Top
Search