用于将JSON键值对象转换为查询字符串的JavaScript函数

时间:2011-02-13 22:36:08

标签: javascript json iterator escaping urlencode

我正在为Facebook Feed Dialog格式化网址。但是有很多参数。我想为这些对话框提供一个函数,例如:

function generateDialogUrl(dialog, params) {
  base  = "http://www.facebook.com/dialog/" + dialog + "?";
  tail = [];
  for (var p in params) {
    if (params.hasOwnProperty(p)) {
      tail.push(p + "=" + escape(params[p]));
    }
  }
  return base + tail.join("&")
}
哇哦......我想我刚回答了自己的问题。是对的吗? escape()是否使用正确的函数?

我被困在Lovers source code

更新:因为我们正在使用jQuery,所以我使用jQuery.each重写了该方法。我也根据@galambalazs& amp;的建议,将escape()替换为encodeURIComponent()。 @ T.J。克劳德。谢谢,伙计们!

var generateDialogUrl = function (dialog, params) {
  base  = "http://www.facebook.com/dialog/" + dialog + "?";
  tail = [];
  $.each(params, function(key, value) {
    tail.push(key + "=" + encodeURIComponent(value));
  })
  return base + tail.join("&");
}

它正在运作!

4 个答案:

答案 0 :(得分:7)

更好的是,请改用encodeURIComponent。请参阅此article比较两者:

  

escape()方法无法编码   解释的+字符   作为服务器端的空间   由带有空格的表格生成的   他们的领域。由于这个缺点   以及此功能失败的事实   处理非ASCII字符   正确地说,你应该避免使用   尽可能逃避()。 最好   通常是替代   的 encodeURIComponent方法()

     

escape()不会编码:@ * / +

答案 1 :(得分:2)

有一种jQuery方法可以实现这一目标:$.param。它会像这样工作:

var generateDialogUrl = function (dialog, params) {
  base = 'http://www.facebook.com/dialog/' + dialog + '?';
  return base + $.param(params);
}

答案 2 :(得分:0)

convertJsonToQueryString: function (json, prefix) {
    //convertJsonToQueryString({ Name: 1, Children: [{ Age: 1 }, { Age: 2, Hoobbie: "eat" }], Info: { Age: 1, Height: 80 } })
    if (!json) return null;
    var str = "";
    for (var key in json) {
        var val = json[key];
        if (isJson(val)) {
            str += convertJsonToQueryString(val, ((prefix || key) + "."));
        } else if (typeof (val) == "object" && ("length" in val)) {
            for (var i = 0; i < val.length; i++) {
                //debugger
                str += convertJsonToQueryString(val[i], ((prefix || key) + "[" + i + "]."));
            }
        }
        else {
            str += "&" + ((prefix || "") + key) + "=" + val;
        }
    }
    return str ? str.substring(1) : str;
}

isJson = function (obj) {
    return typeof (obj) == "object" && Object.prototype.toString.call(obj).toLowerCase() == "[object object]" && !obj.length;
};

示例:

convertJsonToQueryString({Name:1,Children:[{Age:1},{Age:2,Hoobbie:"eat"}],Info:{Age:1,Height:80}})

结果:

"Name=1Children[0].Age=1Children[1].Age=2&Children[1].Hoobbie=eatInfo.Age=1&Info.Height=80"

答案 3 :(得分:0)

const createQueryParams = (param, prefix = '') => {
    let queryString = '';
    if (param.constructor === Object) {
        queryString = Object.keys(param).reduce((result, key) => {
            const obj = param[key];
            const queryParam = result ? `${result}&${prefix}` : prefix;
            if (obj.constructor === Object) {
                return `${queryParam}${createQueryParams(obj, `${key}.`)}`;
            } else if(obj.constructor === Array) {
                const qp= obj.map((item, index)=> {
                    if (item.constructor === Object || item.constructor === Array) {
                        const query = createQueryParams(item, `${key}[${index}].`);
                        return `${query}`;
                    } else {
                        return `${key}[${index}]=${item}`;
                    }
                }).reduce((res, cur) => {
                    return res ? `${res}&${cur}`: `${cur}`;
                }, '');

                return `${queryParam}${qp}`;
            } else {
                return `${queryParam}${key}=${obj}`;
            }
        }, '');
    } else if(param.constructor === Array) {
        queryString = param.reduce((res, cur) => `${res},${cur}`);
    } else {
        queryString = param;
    }

    return encodeURI(queryString);
};

示例:

createQueryParams({"Context":{"countryCode":"NO"},"Pagination":{"limit":10,"offset":1},"AdditionalField":[{"name":"Policy Number","value":"Pol123"},{"name":"Policy Version","value":"PV1"}]});