15

我似乎找不到这个问题的答案。如何在 javascript 中将 URL 参数字符串转换为 JSON？我的意思是问是否有这样的内置功能或单线可以完成这项工作？

例子：

some=params&over=here=>{"some":"params","over":"here"}

4

7 回答 7

26

您可以创建一个返回 JSON 对象的方法

var params = getUrlVars('some=params&over=here');
console.log(params);

function getUrlVars(url) {
    var hash;
    var myJson = {};
    var hashes = url.slice(url.indexOf('?') + 1).split('&');
    for (var i = 0; i < hashes.length; i++) {
        hash = hashes[i].split('=');
        myJson[hash[0]] = hash[1];
        // If you want to get in native datatypes
        // myJson[hash[0]] = JSON.parse(hash[1]); 
    }
    return myJson;
}

演示：http: //jsfiddle.net/jAGN5/

于 2013-07-05T07:21:21.587 回答
6

尝试这个 ：

var str = 'some1=param&some2=param2';

JSON.parse('{"' + decodeURI(str).replace(/"/g, '\\"').replace(/&/g, '","').replace(/=/g,'":"').replace(/\s/g,'') + '"}')

// {some1: "param1", some2: "param2"}
于 2016-02-10T09:02:10.460 回答
2

如果它是你所追求的单线，Underscore 库有一个漂亮的函数叫做object，它接受一个对数组并从中构建一个对象：

> _.object(["some","param"],["over","here"])
{some: "param", over: "here"}

如果使用下划线，则可以从查询字符串中单行构造对象，如下所示：

> var s = 'some=param&over=here';
> _.object(s.split('&').map(function(p){return p.split('=');}))
{some: "param", over: "here"}

现在，如果您想要的只是 JavaScript 对象，那么您就完成了。你在你的问题中说你想要JSON，所以下一步很容易：

> JSON.stringify(_.object(s.split('&').map(function(p){return p.split('=');})))
"{\"some\": \"param\", \"over\": \"here\"}"

这是一个现场演示

如果您不使用 Underscore，您可以随时编写自己的实用程序函数。

这一行有点难看，但 Firefox 22 具有一些即将推出的 ES6 特性，例如数组解析和箭头，因此将来可以使代码更加紧凑，例如

JSON.stringify(_.object(s.split('&').map(p => p.split('='))))

甚至

JSON.stringify(_.object([p.split('=') for (p of s.split('&'))]))

或者也许只是坚持可读的 for 循环并制作自己的函数。:)

于 2013-07-05T16:47:12.957 回答
1

尝试使用此功能：

// Returns an object with elements "name: value" with data ftom URL (the "name=value" pairs)
function getDataUrl(url) {
 // From: http://coursesweb.net/javascript/
  var url_data = url.match(/\?([^#]*)/i)[1];          // gets the string between '?' and '#'

  // separate the data into an array, in case the are multiple pairs name=value
  var ar_url_data = url_data.split('&');

  // traverse the array, and adds into an object elements name:value
  var data_url = {};
  for(var i=0; i<ar_url_data.length; i++) {
    var ar_val = ar_url_data[i].split('=');           // separate name and value from each pair
    data_url[ar_val[0]] = ar_val[1];
  }

  return data_url;
}
于 2013-07-05T07:25:37.133 回答
0

您可能想尝试类似的东西

var url = require('url')
var your_json = url.parse( your_url, true );

我从这里得到这个

于 2018-07-25T12:12:35.020 回答
0

我使用satpal的答案为 JSON 管道提供了一个不错的 Razor，可用于Html.BeginForm等@Html.TextBoxFor。

更新后的 getUrlVars 函数如下所示：

function getUrlVars(url) {
    var hash;
    var myJson = {};
    var hashes = url.slice(url.indexOf('?') + 1).split('&');
    for (var i = 0; i < hashes.length; i++) {
        hash = hashes[i].split('=');
        var value = decodeURIComponent(hash[1]);
        value = value.replace("[\"", "");
        value = value.replace("\"]", "");
        value = value.replace(/\^.*/, "");
        myJson[hash[0]] = value;
    }
    return myJson;
}

额外的replace调用是针对我在文本框中输入的字符，可能是通过下拉magicSuggest查找。该decodeURIComponent调用从 % 的第一个开始对其进行清理。

我在这样的块中调用它：

    var serialized = $("#saveForm").serialize();
    var params = getUrlVars(serialized);

我拥有的 Razor 语法如下所示：

@using (Html.BeginForm("SaveNewAddress", "Internal", FormMethod.Post, new { @Id = "saveForm" }))
{
    @Html.ValidationSummary()

    <table style="width: 100%; margin: 0 auto; padding: 10px">

        <tr>
            <td colspan="2">
                <label>Is this a Liliputian Address?</label>
            </td>
            <td colspan="4" style="font-size: 1.1em">

                <div style="float: left; margin-left: 10px">
                    <label class="label_check">
                        @Html.RadioButton("IsLiliputian", "Yes", true, new { @id = "IsLiliputianYes", @style = "width:30px" })
                    </label>
                    Yes
                </div>
                ...etc

这提供了一种很好的方式来获取在 ASP.Net MVC 控件中创建的以及通过 js 对象中创建的一堆数据，我可以通过 ajax 将这些数据扔给 web 服务。

于 2017-01-10T15:48:42.700 回答
0 
function getFormData(data){
    data = data.replace('%20', ' ');
    var jsonObj= {};

    var sep = data.split('&');
    for (var i = 0; i < sep.length; i++) {
        var getVals = sep[i].split('=');
        jsonObj[getVals[0]] = getVals[1];
    }
    return jsonObj;
}
于 2021-01-15T19:34:08.543 回答