将 URL 转换为 json

Question

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

例子：

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

Answer 1

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;
}

Answer 2

您可以创建一个返回 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/

Answer 3

您可能想尝试类似的方法

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

我从here得到这个

Answer 4

我使用 satpal 的 answer 提供了一个很好的 Razor 到 JSON 管道，可与 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 服务。

Answer 5

试试这个：

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

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

// {some1: "param1", some2: "param2"}

Answer 6

如果你追求的是单线，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\"}"

这是live demo

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

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

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

甚至

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

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

Answer 7

试试这个功能：

// 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;
}