JSONオブジェクトのクエリー文字列への深いJavascriptまたはjQueryの変換

Question

jQueryの$ .param（）の不具合が十分に深刻ではないという問題を回避する助けが必要であり、深いJSONの一部に%5Dなどが残っています。

これはPayEezyのeコマースAPIの問題ですが、そのサンドボックスAPIは、次のようなクエリ文字列を必要とすることが

ない：

https://api-cert.payeezy.com/v1/securitytokens?apikey=FAKEZdp9nJrKu46wX9evGNnRbGL38W6I&js_security_key=js-FAKE79a767d3fea1611ae66e1c6bfd2af8f879a767d3fea1&callback=respondPEZ&auth=true&ta_token=NOIW&type=FDToken&currency=USD&credit_card.cardholder_name=John+Doe&credit_card.card_number=4111111111111111&credit_card.exp_date=1218&credit_card.cvv=100&credit_card.type=visa&billing_address.street=&billing_address.city=&billing_address.state_province=&billing_address.zip_postal_code=&billing_address.country=&billing_address.email=&billing_address.phone.type=&billing_address.phone.number=

あなたはそれを見ると、私はあなたがのようなものに気づくしたいですbilling_address%5Bstate%5Dではなく、billing_address[state]ではなくbilling_address.stateとなります。 PayEezyのために特別な方法が必要です。あなたが実行したときに、今

var o = { 
    apikey: 'FAKEZdp9nJrKu46wX9evGNnRbGL38W6I', 
    js_security_key: 'js-FAKE79a767d3fea1611ae66e1c6bfd2af8f879a767d3fea1', 
    callback: 'respondPEZ', 
    auth: true, 
    ta_token: 'NOIW', 
    type: 'FDToken', 
    currency: 'USD',     
    credit_card: { 
     type: 'visa', 
     cardholder_name: 'John Doe', 
     card_number: '4111111111111111', 
     exp_date: '1218', 
     cvv: '100' 
    }, 
    billing_address: { 
     street: undefined, 
     city: undefined, 
     state_province: undefined, 
     zip_postal_code: undefined, 
     country: undefined, 
     email: undefined, 
     phone: { 
      type: undefined, 
      number: undefined 
     } 
    } 
}; 

そのjQueryの$ .PARAM（）を通して、あなたは、クエリ文字列に十分に閉じていない結果が得られます。

だから、私はJavaScriptでそのように、このJSONオブジェクトを作成しました：

apikey=FAKEZdp9nJrKu46wX9evGNnRbGL38W6I&js_security_key=js-FAKE79a767d3fea1611ae66e1c6bfd2af8f879a767d3fea1&callback=respondPEZ&auth=true&ta_token=NOIW&type=FDToken&currency=USD&credit_card%5Btype%5D=visa&credit_card%5Bcardholder_name%5D=John+Doe&credit_card%5Bcard_number%5D=4111111111111111&credit_card%5Bexp_date%5D=12%2F18&credit_card%5Bcvv%5D=100&billing_address%5Bstreet%5D=&billing_address%5Bcity%5D=&billing_address%5Bstate_province%5D=&billing_address%5Bzip_postal_code%5D=&billing_address%5Bcountry%5D=&billing_address%5Bemail%5D=&billing_address%5Bphone%5D%5Btype%5D=&billing_address%5Bphone%5D%5Bnumber%5D=

これら%5Dと%5Bを参照してください？それらは望ましくなく、PayEezyがAPIで望んでいるものではありません。

だから、私はこれを行うことで、問題を修正に近づくために管理：

var s = decodeURIComponent($.param(o,false)); 

しかし、その後、私はこれを行うことにより、さらにそれを修正することができた：

var s = decodeURIComponent($.param(o,false)) 
    .replace(/\]\=/g,'=') 
    .replace(/\]\[/g,'.') 
    .replace(/\[/g,'.'); 

私の質問をあなたにオブジェクトに埋め込まれたJSONオブジェクトを角括弧を含まないよりURLフレンドリなクエリ文字列に変換するための、より洗練された方法があります。ドット表記法が含まれています。私が解決した技術を置き換える？例えば、jQueryやJavascriptにはすでにいくつかの関数がありますが、これを組み合わせると、私が気付いていないこれをうまく処理できますか？

Answer 1

私は独自の再帰シリアライザを作っています。うまくいけば、それは要求どおりに動作します。

この関数は、オブジェクトのすべてのプロパティをループします。値がオブジェクトの場合は、自身を呼び出して"breadcrum"に渡します。 A breadcrumは、関数が存在する場所に到達するために取得したプロパティの単なる「パス」です。たとえば、請求先住所の電話の種類を調べている場合は、breadcrumがbilling_address.phone.になります。

値がオブジェクトでない場合は、breadcrumに自身を追加し、再度クエリ文字列に自身を追加します。

値がundefinedの場合は、これを空の文字列に設定しました。

var o = { 
 
    apikey: 'FAKEZdp9nJrKu46wX9evGNnRbGL38W6I', 
 
    js_security_key: 'js-FAKE79a767d3fea1611ae66e1c6bfd2af8f879a767d3fea1', 
 
    callback: 'respondPEZ', 
 
    auth: true, 
 
    ta_token: 'NOIW', 
 
    type: 'FDToken', 
 
    currency: 'USD',     
 
    credit_card: { 
 
     type: 'visa', 
 
     cardholder_name: 'John Doe', 
 
     card_number: '4111111111111111', 
 
     exp_date: '1218', 
 
     cvv: '100' 
 
    }, 
 
    billing_address: { 
 
     street: undefined, 
 
     city: undefined, 
 
     state_province: undefined, 
 
     zip_postal_code: undefined, 
 
     country: undefined, 
 
     email: undefined, 
 
     phone: { 
 
      type: undefined, 
 
      number: undefined 
 
     } 
 
    } 
 
}; 
 

 
function convertToQueryString(object, currentBreadcrum = '') { 
 
    var queryString = ''; 
 
    
 
    for (var property in object) { 
 
     var potentialObject = object[property]; 
 
     
 
     if (typeof potentialObject === 'undefined') { 
 
      potentialObject = ''; 
 
     } // set undefined values to an empty string 
 
     
 
     if (typeof potentialObject === 'object') { 
 
      queryString += convertToQueryString(potentialObject, currentBreadcrum + property + '.'); 
 
     } else { 
 
      if (currentBreadcrum === '' && queryString === '') { // don't prepend an '&' if it's the first item in the query string 
 
       queryString += currentBreadcrum + property + '=' + potentialObject; 
 
      } else { 
 
       queryString += '&' + currentBreadcrum + property + '=' + potentialObject; 
 
      } 
 
     } 
 
    } 
 
    
 
    return queryString; 
 
} 
 

 
console.log(convertToQueryString(o));