จะหลีกเลี่ยงสตริง JSON เพื่อให้มีอยู่ใน URL ได้อย่างไร

ใช้ Javascript ฉันต้องการสร้างลิงก์ไปยังเพจ พารามิเตอร์ไปยังเพจอยู่ในอาร์เรย์ Javascript ที่ฉันทำให้เป็นอนุกรมใน JSON

ดังนั้นฉันต้องการสร้าง URL แบบนั้น:

http://example.com/?data="MY_JSON_ARRAY_HERE"

ฉันต้องหลีกเลี่ยงสตริง JSON ของฉัน (อาร์เรย์แบบอนุกรม) เพื่อรวมเป็นพารามิเตอร์ใน URL ได้อย่างไร

หากมีวิธีแก้ปัญหาโดยใช้ JQuery ฉันจะชอบมัน

หมายเหตุ: ใช่พารามิเตอร์ของเพจต้องอยู่ในอาร์เรย์เนื่องจากมีจำนวนมาก ฉันคิดว่าฉันจะใช้ bit.ly เพื่อย่อลิงค์ในภายหลัง

encodeURIComponent(JSON.stringify(object_to_be_serialised))

คุณสามารถใช้encodeURIComponentเพื่อเข้ารหัส URL ที่ปลอดภัยบางส่วนของสตริงข้อความค้นหา:

var array = JSON.stringify([ 'foo', 'bar' ]);
var url = 'http://example.com/?data=' + encodeURIComponent(array);

หรือหากคุณส่งสิ่งนี้เป็นคำขอ AJAX:

var array = JSON.stringify([ 'foo', 'bar' ]);
$.ajax({
    url: 'http://example.com/',
    type: 'GET',
    data: { data: array },
    success: function(result) {
        // process the results
    }
});

ฉันต้องการทำสิ่งเดียวกัน ปัญหาสำหรับฉันคือ URL ของฉันยาวเกินไป วันนี้ฉันพบวิธีแก้ปัญหาโดยใช้ไลบรารี jsUrl.js ของ Bruno Jouhierห้องสมุด

ฉันยังไม่ได้ทดสอบอย่างละเอียด อย่างไรก็ตามนี่คือตัวอย่างที่แสดงความยาวอักขระของเอาต์พุตสตริงหลังจากเข้ารหัสอ็อบเจ็กต์ขนาดใหญ่เดียวกันโดยใช้ 3 วิธีที่แตกต่างกัน:

• 2651 อักขระโดยใช้ jQuery.param
• 1691 อักขระโดยใช้ JSON.stringify + encodeURIComponent
• 821 อักขระโดยใช้ JSURL.stringify

เห็นได้ชัดว่า JSURL มีรูปแบบที่เหมาะสมที่สุดสำหรับ urlEncoding a js object

ชุดข้อความที่https://groups.google.com/forum/?fromgroups=#!topic/nodejs/ivdZuGCF86Q จะแสดงเกณฑ์มาตรฐานสำหรับการเข้ารหัสและการแยกวิเคราะห์

หมายเหตุ : หลังการทดสอบดูเหมือนว่าไลบรารี jsurl.js จะใช้ฟังก์ชัน ECMAScript 5 เช่น Object.keys, Array.map และ Array.filter ดังนั้นจึงใช้ได้เฉพาะกับเบราว์เซอร์รุ่นใหม่ (ไม่ใช่เช่น 8 และต่ำกว่า) อย่างไรก็ตามเป็น polyfills สำหรับฟังก์ชันเหล่านี้ที่จะทำให้เข้ากันได้กับเบราว์เซอร์อื่น ๆ

• สำหรับอาร์เรย์: https://stackoverflow.com/a/2790686/467286
• สำหรับ object.keys: https://stackoverflow.com/a/3937321/467286

ใช้encodeURIComponent():

var url = 'index.php?data='+encodeURIComponent(JSON.stringify({"json":[{"j":"son"}]})),

ฉันจะเสนอทางเลือกที่แปลก บางครั้งการใช้การเข้ารหัสที่แตกต่างกันทำได้ง่ายกว่าโดยเฉพาะอย่างยิ่งหากคุณกำลังจัดการกับระบบต่างๆที่ไม่ได้จัดการรายละเอียดของการเข้ารหัส URL ด้วยวิธีเดียวกันทั้งหมด นี่ไม่ใช่แนวทางหลักที่สุด แต่อาจมีประโยชน์ในบางสถานการณ์

แทนที่จะเข้ารหัส URL ข้อมูลคุณสามารถเข้ารหัส base64 ได้ ข้อดีของสิ่งนี้คือข้อมูลที่เข้ารหัสเป็นข้อมูลทั่วไปซึ่งประกอบด้วยอักขระอัลฟาและบางครั้งต่อท้าย= 's ตัวอย่าง:

อาร์เรย์ของสตริง JSON:

["option", "Fred's dog", "Bill & Trudy", "param=3"]

ข้อมูลนั้นเข้ารหัส URL เป็นdataพารามิเตอร์:

"data=%5B%27option%27%2C+%22Fred%27s+dog%22%2C+%27Bill+%26+Trudy%27%2C+%27param%3D3%27%5D"

เหมือนกันเข้ารหัส base64:

"data=WyJvcHRpb24iLCAiRnJlZCdzIGRvZyIsICJCaWxsICYgVHJ1ZHkiLCAicGFyYW09MyJd"

วิธีการ base64 อาจสั้นกว่าเล็กน้อย แต่ที่สำคัญกว่านั้นคือง่ายกว่า ฉันมักมีปัญหาในการย้ายข้อมูลที่เข้ารหัส URL ระหว่าง cURL เว็บเบราว์เซอร์และไคลเอนต์อื่น ๆ ซึ่งมักเกิดจากเครื่องหมายคำพูดเครื่องหมายฝัง%และอื่น ๆ Base64 เป็นกลางมากเนื่องจากไม่ใช้อักขระพิเศษ

คำตอบของ Delan is perfect. เพียงแค่เพิ่มเข้าไปในกรณีที่มีคนต้องการตั้งชื่อพารามิเตอร์หรือส่งสตริง JSON หลายสตริงแยกกันโค้ดด้านล่างนี้สามารถช่วยได้!

JQuery

var valuesToPass = new Array(encodeURIComponent(VALUE_1), encodeURIComponent(VALUE_2), encodeURIComponent(VALUE_3), encodeURIComponent(VALUE_4));

data = {elements:JSON.stringify(valuesToPass)}

PHP

json_decode(urldecode($_POST('elements')));

หวังว่านี่จะช่วยได้!