ไลบรารีไคลเอ็นต์ JavaScript REST [ปิด]


117

มีห้องสมุด JavaScript ที่ช่วยให้ผมที่จะดำเนินการทั้งหมดดำเนินการส่วนที่เหลือเช่น ( GET, POST, PUTและDELETEมากกว่าHTTPหรือHTTPS)?

คำตอบ:


139

คุณไม่จำเป็นต้องมีไคลเอนต์เฉพาะจริงๆมันค่อนข้างง่ายสำหรับไลบรารีส่วนใหญ่ ตัวอย่างเช่นใน jQuery คุณสามารถเรียกใช้$.ajaxฟังก์ชันทั่วไปด้วยประเภทคำขอที่คุณต้องการทำ:

$.ajax({
    url: 'http://example.com/',
    type: 'PUT',
    data: 'ID=1&Name=John&Age=10', // or $('#myform').serializeArray()
    success: function() { alert('PUT completed'); }
});

คุณสามารถแทนที่PUTด้วยGET/ POST/ DELETEหรืออะไรก็ได้


10
jQuery ยังมีวิธีทางลัดที่สะดวกสำหรับการใช้ GET และ POST: api.jquery.com/category/ajax/shorthand-methods
Avi Flax

และหากต้องการขยายสิ่งที่ @Avi Flax กล่าวการสร้างPUTและDELETEวิธีการของคุณเองนั้นง่ายมากหากคุณต้องการทางลัด
zzzzBov

2
คุณดึงเนื้อหาของการตอบสนองได้อย่างไร? ส่วนหัว?
Pantelis Sopasakis

@PantelisSopasakis การsuccessเรียกกลับจะใช้dataอาร์กิวเมนต์ซึ่งจะมีการตอบสนอง
soulseekah

6
ในทางเทคนิคนี่ไม่ใช่ไคลเอนต์ REST แต่เป็น HttpClient ฉันกำลังมองหาสิ่งที่แสดงวิธีใช้ความสัมพันธ์ลิงค์และประเภทสื่ออย่างถูกต้องเพื่อขับเคลื่อนสถานะ จะคอยดู ...
Peter McEvoy

71

แม้ว่าคุณอาจต้องการใช้ไลบรารีเช่นjQuery ที่ยอดเยี่ยมแต่คุณไม่จำเป็นต้องทำ: เบราว์เซอร์สมัยใหม่ทั้งหมดรองรับ HTTP เป็นอย่างดีในการใช้งาน JavaScript ผ่านXMLHttpRequest APIซึ่งแม้จะมีชื่อ แต่ก็ไม่ได้ จำกัด เฉพาะการแสดง XML .

นี่คือตัวอย่างของการสร้างคำขอ HTTP PUT แบบซิงโครนัสใน JavaScript:

var url = "http://host/path/to/resource";
var representationOfDesiredState = "The cheese is old and moldy, where is the bathroom?";

var client = new XMLHttpRequest();

client.open("PUT", url, false);

client.setRequestHeader("Content-Type", "text/plain");

client.send(representationOfDesiredState);

if (client.status == 200)
    alert("The request succeeded!\n\nThe response representation was:\n\n" + client.responseText)
else
    alert("The request did not succeed!\n\nThe response status was: " + client.status + " " + client.statusText + ".");

ตัวอย่างนี้เป็นแบบซิงโครนัสเนื่องจากทำให้ง่ายขึ้นเล็กน้อย แต่ก็ค่อนข้างง่ายที่จะสร้างคำขอแบบอะซิงโครนัสโดยใช้ API นี้เช่นกัน

มีหลายพันหน้าและบทความบนเว็บเกี่ยวกับการเรียนรู้ XmlHttpRequest - โดยปกติแล้วจะใช้คำว่า AJAX - ขออภัยที่ฉันไม่สามารถแนะนำได้ คุณอาจพบว่าข้อมูลอ้างอิงนี้มีประโยชน์


11

คุณสามารถใช้ปลั๊กอิน jQuery ที่ฉันเพิ่งสร้างขึ้น :) https://github.com/jpillora/jquery.rest/

รองรับการดำเนินการ CRUD ขั้นพื้นฐานทรัพยากรที่ซ้อนกันการตรวจสอบสิทธิ์ขั้นพื้นฐาน

  var client = new $.RestClient('/api/rest/');

  client.add('foo');
  client.foo.add('baz');
  client.add('bar');

  client.foo.create({a:21,b:42});
  // POST /api/rest/foo/ (with data a=21 and b=42)
  client.foo.read();
  // GET /api/rest/foo/
  client.foo.read("42");
  // GET /api/rest/foo/42/
  client.foo.update("42");
  // PUT /api/rest/foo/42/
  client.foo.delete("42");
  // DELETE /api/rest/foo/42/

  //RESULTS USE '$.Deferred'
  client.foo.read().success(function(foos) {
    alert('Hooray ! I have ' + foos.length + 'foos !' );
  });

หากคุณพบข้อบกพร่องหรือต้องการคุณสมบัติใหม่โปรดโพสต์ไว้ในหน้า "ปัญหา" ที่เก็บ


2
ฉันชอบความเรียบง่ายที่คุณทำ ดูเหมือนว่าจะรองรับตัวเลือกเพิ่มเติมเมื่อคุณต้องการ แต่คุณไม่สามารถใช้งานได้
Stradas

ว้าว. คุณแชร์โอเพ่นซอร์สมากมาย เคารพ.
wonsuc

8

jQuery มีปลั๊กอินJSON-REST ที่มีสไตล์ REST ของเทมเพลตพารามิเตอร์ URI ตามตัวอย่างคำอธิบายของการใช้เป็นสิ่งต่อไปนี้: $.Read("/{b}/{a}", { a:'foo', b:'bar', c:3 })กลายเป็น GET to "/ bar / foo? c = 3"


6

สำหรับการอ้างอิงฉันต้องการที่จะเพิ่มประมาณ ExtJS ตามที่อธิบายไว้ในคู่มือการใช้งาน: สงบ Web Services ในระยะสั้นใช้วิธีการเพื่อระบุ GET, POST, PUT, DELETE ตัวอย่าง:

Ext.Ajax.request({
    url: '/articles/restful-web-services',
    method: 'PUT',
    params: {
        author: 'Patrick Donelan',
        subject: 'RESTful Web Services are easy with Ext!'
    }
});

หากจำเป็นต้องใช้ส่วนหัว Accept ก็สามารถตั้งเป็นค่าเริ่มต้นสำหรับคำขอทั้งหมด:

Ext.Ajax.defaultHeaders = {
    'Accept': 'application/json'
};

3

คุณยังสามารถใช้เฟรมเวิร์ก mvc เช่น Backbone.js ซึ่งจะจัดเตรียมแบบจำลองจาวาสคริปต์ของข้อมูล การเปลี่ยนแปลงโมเดลจะถูกแปลเป็นการเรียก REST


3

คุณสามารถลองrestful.jsซึ่งเป็นไคลเอนต์ RESTful ที่ไม่เชื่อเรื่องพระเจ้าของเฟรมเวิร์กโดยใช้ไวยากรณ์ที่คล้ายกับ Restangular ยอดนิยม



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