jQuery กำลังโพสต์ JSON


194

update: ฉันต้องการส่งต่อvar valueไปยังเซิร์ฟเวอร์

สวัสดี, อายุเท่าเดิม, อายุเท่ากัน ... :)

ฉันมีแบบฟอร์มที่เรียกว่า<form id="testForm" action="javascript:test()">และรหัสพื้นที่ที่เรียกว่า<code id="testArea"></code>

ฉันใช้รหัสนี้เพื่อทำให้เป็นสตริงและแสดงข้อมูลในพื้นที่รหัส:

var formData = form2object('testForm');
document.getElementById('testArea').innerHTML = JSON.stringify(formData, null, '\t');
var value = JSON.stringify(formData, null, '\t');

สิ่งที่ฉันต้องการคือการส่งข้อมูลนี้ไปยังไฟล์ JSON ฉันได้ทำงานในโครงการนี้: http://ridegrab.com/profile_old/และหากคุณกดSubmit Queryปุ่มคุณจะเห็นส่วนหัวของหน้าเว็บปรากฏขึ้น

นอกจากนี้ฉันต้องการใช้สคริปต์ชิ้นนี้เพื่อส่งข้อมูล:

    function authenticate(userName, password) {
    $.ajax
    ({
        type: "POST",
        //the url where you want to sent the userName and password to
        url: 'username:password@link to the server/update',
        dataType: 'json',
        async: false,
        //json object to sent to the authentication url
        data: '{"userName": "' + userName + '", "password" : "' + password + '"}',
        success: function () {

        alert("Thanks!"); 
        }
    })
}

สิ่งที่ฉันต้องการก็คือสามารถส่งข้อมูล JSON นั้นไปยังเซิร์ฟเวอร์ได้ เซิร์ฟเวอร์ของฉันตั้งค่าupdate or POSTข้อมูลไว้ถูกที่แล้ว


ฉันไม่สามารถทำงานได้ :) ฉันไม่รู้จะรวมเข้าด้วยกันเพื่อส่งข้อมูลไปยังเซิร์ฟเวอร์ ... แม้ว่าฉันจะแทนที่dataด้วยdata: value,... !! ??
Patrioticcow

ประการแรกคุณแน่ใจหรือว่าไม่ใช่ปัญหาการเชื่อมต่อ หากคุณกำหนดerrorฟังก์ชั่นมันจะถูกเรียกใช้หรือไม่ ถ้าเป็นเช่นนั้นมีข้อผิดพลาดอะไร?
Wiseguy

1
แม้ว่าจะอายุเกินหนึ่งปี แต่ฉันจะตอบคำถามล่าสุดของ @ Patrioticcow เกี่ยวกับวิธีการทำเช่นนั้น คุณเห็นตัวเลือก "ความสำเร็จ" ที่คุณส่งไปยังวิธี ajax หรือไม่ ทำสิ่งเดียวกันกับ "ข้อผิดพลาด" เช่นเดียวกับใน "ข้อผิดพลาด: MyErrorHandlingFunction" หรือ "ข้อผิดพลาด: ฟังก์ชั่น (ข้อผิดพลาด) {[ข้อผิดพลาดการจัดการรหัสที่นี่]}"
vbullinger

คำตอบ:


220

'data' ควรเป็นวัตถุ JavaScript ที่ผ่านการรับรองแล้ว:

data: JSON.stringify({ "userName": userName, "password" : password })

ในการส่งของคุณformDataให้ส่งไปที่stringify:

data: JSON.stringify(formData)

เซิร์ฟเวอร์บางตัวยังต้องการapplication/jsonประเภทเนื้อหา:

contentType: 'application/json'

นอกจากนี้ยังมีคำตอบที่ละเอียดยิ่งขึ้นสำหรับคำถามที่คล้ายกันที่นี่: Jquery Ajax การโพสต์ json ไปยังเว็บเซอร์วิซ


@tasos ฉันคิดว่านี่คือสิ่งที่คุณต้องการ: stackoverflow.com/questions/5806971/…
Kyle Wild

สะท้อนความไม่ถูกต้องที่นี่; สิ่งนี้จะทำงานได้ดีสำหรับสถานการณ์ง่าย ๆ แต่ข้อความที่เข้ารหัส URL อาจเป็นปัญหาได้โดยเฉพาะอย่างยิ่งสำหรับอาร์เรย์ของสิ่งต่าง ๆ
FMM

@FMM และ Jonas N - พวกคุณช่วยฉันหาวิธีปรับปรุงคำตอบให้ถูกต้องได้ไหม? ตัวอย่างในเอกสาร jQuery (ที่นี่: api.jquery.com/jQuery.post ) ทำให้ปรากฏราวกับว่าคุณสามารถโพสต์วัตถุ JS หรือสตริงซึ่งทำให้ฉันเชื่อว่า jQuery จะจัดการอนุกรมสตริงที่จำเป็นทั้งหมด .
Kyle Wild

Patrioticcow กล่าวว่า: "ถ้าฉันต้องการส่ง json จากค่า var" ยกเว้นว่าค่าเป็นอาร์เรย์หรือวัตถุนี่ไม่ใช่ JSON ที่ถูกต้อง
andsens

1
{ foo: [1,2,3], bar: 'baz' }พิจารณาสิ่งที่เกิดขึ้นเมื่อมีข้อมูลของคุณตัวอย่างเช่นรายการของสิ่งที่: สิ่งนี้จะได้รับการเข้ารหัสรูปแบบเป็นfoo%5B%5D=1&foo%5B%5D=2&foo%5B%5D=3&bar=baz(unescaped มันfoo[]=1&foo[]=2&foo[]=3&bar=baz) ดูเหมือนจะไม่ใช่สิ่งที่คุณต้องการฝั่งเซิร์ฟเวอร์
FMM

271

คุณโพสต์ JSON แบบนี้

$.ajax(url, {
    data : JSON.stringify(myJSObject),
    contentType : 'application/json',
    type : 'POST',
    ...

หากคุณผ่านวัตถุเป็น settings.data jQuery จะแปลงเป็นพารามิเตอร์การสืบค้นและโดยค่าเริ่มต้นส่งด้วยแอปพลิเคชันประเภทข้อมูล / x-www-form-urlencoded; charset = UTF-8 อาจไม่ใช่สิ่งที่คุณต้องการ


@ TimLovell-Smith จะไม่สร้างความแตกต่างเพราะ jQuery จะไม่ประมวลผลdataสตริงในกรณีใด ๆ
Phil

2

ในกรณีที่คุณส่งคำขอโพสต์นี้ไปยังโดเมนข้ามคุณควรตรวจสอบลิงค์นี้

https://stackoverflow.com/a/1320708/969984

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

โดยการใช้ไซต์ของเรา หมายความว่าคุณได้อ่านและทำความเข้าใจนโยบายคุกกี้และนโยบายความเป็นส่วนตัวของเราแล้ว
Licensed under cc by-sa 3.0 with attribution required.