Получить строковый параметр Url как объект JSON

Question

Мне было интересно, возможно ли получить параметр url в виде объекта JSON с помощью объекта окна.

Например,У меня есть URL "/ # / health? FirstName = tom & secondName = Mike"

и получаю значение {{firstName ":" tom "," secondName ":" Mike "}

Я попытался исследовать объект окна, но не смог найти никакой помощи.

Я думаю, что я могу попробовать разобрать строку firstName = tom & secondName = Mike и преобразовать ее в json, но это не выглядит хорошим подходом.Кстати, если есть разумный способ анализа, это тоже будет оценено.

Пожалуйста, дайте мне знать, если я должен предоставить больше информации.

Answer 1

Используя прямой JavaScript, сначала получите параметры, а затем преобразуйте их в объект:

<script type="text/javascript">

    // params will be an object with key value pairs based on the url query string
    var params = paramsToObject();
    console.log(params);

    // Get the parameters by splitting the url at the ?
    function getParams() {
        var uri = window.location.toString();
        if (uri.indexOf("?") > 0) {
            var params = uri.substring(uri.indexOf("?") + 1, uri.length);
            return params;
        }
        return "";
    }

    // Split the string by & and then split each pair by = then return the object
    function paramsToObject() {
        var params = getParams().split("&");
        var obj = {};

        for (p in params) {
            var arr = params[p].split("=");
            obj[arr[0]] = arr[1];
        }

        return obj;
    }
</script>

При использовании Angular: Вы можете использовать модуль qs npm, предложенный в ответе с помощью danday74 .

Answer 2

const str = 'abc=foo&def=%5Bbar%5D&xyz=5'

    // reduce takes an array and reduces it into a single value
    const nameVal = str.split('&').reduce((prev, curr) => {
    // see output here in console for clarity:
    console.log('curr= ', curr, ' prev = ', prev)
    prev[decodeURIComponent(curr.split('=')[0])] = decodeURIComponent(curr.split('=')[1]);
    return prev;
}, {});

// invoke 
console.log(nameVal);

Answer 3

В Angular вы можете получить URL с:

this.router.url

Получив URL, вы должны использовать очень популярный (14 миллионов загрузок в неделю) npm qs модуль:

var qs = require('qs');
var obj = qs.parse('firstName=tom&secondName=Mike');

возвращает:

{
  firstName: 'tom'
  secondName: 'mike'
}