คำถามติดแท็ก fetch-api

Fetch API เป็นการแทนที่ XHR ที่ได้รับการปรับปรุงสำหรับการสร้างคำขอ HTTP แบบอะซิงโครนัสในขณะที่จัดการการเปลี่ยนเส้นทางและการโต้ตอบกับ CORS และ Service Workers ได้ดีขึ้น

11
Fetch: POST ข้อมูล json
ตั้งค่าใหม่ตั้งค่าStack Overflow เป็นภาษาอังกฤษ : какотправить json насервер fetch javascript? Всеговоряттолькоотом, какполучить json ฉันพยายามที่จะโพสต์วัตถุ JSON ใช้ดึงข้อมูล จากสิ่งที่ฉันสามารถเข้าใจได้ฉันต้องแนบวัตถุที่เป็นสตริงกับส่วนของคำขอเช่น: fetch("/echo/json/", { headers: { 'Accept': 'application/json', 'Content-Type': 'application/json' }, method: "POST", body: JSON.stringify({a: 1, b: 2}) }) .then(function(res){ console.log(res) }) .catch(function(res){ console.log(res) }) เมื่อใช้json echo ของ jsfiddleฉันคาดว่าจะเห็นวัตถุที่ฉันส่ง ( {a: 1, b: 2}) กลับ แต่สิ่งนี้ไม่ได้เกิดขึ้น …

10
ไม่มีส่วนหัว 'Access-Control-Allow-Origin' ในทรัพยากรที่ร้องขอ - เมื่อพยายามรับข้อมูลจาก REST API
ฉันพยายามดึงข้อมูลจาก REST API ของ HP Alm มันทำงานได้ค่อนข้างดีด้วยสคริปต์ม้วนเล็ก ๆ - ฉันได้รับข้อมูลของฉัน ตอนนี้การทำเช่นนั้นกับ JavaScript, การดึงข้อมูลและ ES6 (มากกว่าหรือน้อยกว่า) ดูเหมือนจะเป็นปัญหาที่ใหญ่กว่า ฉันได้รับข้อความแสดงข้อผิดพลาดนี้: Fetch API ไม่สามารถโหลดได้ การตอบสนองต่อคำขอ preflight ไม่ผ่านการตรวจสอบการควบคุมการเข้าถึง: ไม่มีส่วนหัว 'Access-Control-Allow-Origin' บนทรัพยากรที่ร้องขอ แหล่งกำเนิด ' http://127.0.0.1:3000 ' จึงไม่ได้รับอนุญาตให้เข้าถึง การตอบกลับมีรหัสสถานะ HTTP 501 หากการตอบกลับทึบแสงตอบสนองความต้องการของคุณให้ตั้งค่าโหมดคำขอเป็น 'ไม่คอร์' เพื่อดึงข้อมูลทรัพยากรโดยปิดการใช้งาน CORS ฉันเข้าใจว่าเป็นเพราะฉันพยายามดึงข้อมูลจากภายในเครื่องของฉันและวิธีแก้ปัญหาควรใช้ CORS ตอนนี้ฉันคิดว่าฉันทำอย่างนั้นจริง แต่อย่างใดมันไม่สนใจสิ่งที่ฉันเขียนในส่วนหัวหรือปัญหาเป็นอย่างอื่น? ดังนั้นจะมีปัญหาการใช้งานหรือไม่ ฉันทำผิดหรือเปล่า? ฉันไม่สามารถตรวจสอบบันทึกเซิร์ฟเวอร์ได้ ฉันติดอยู่ตรงนี้จริงๆ function performSignIn() { let …


6
ดึง API ด้วยคุกกี้
ฉันกำลังลอง API การดึงข้อมูลใหม่ แต่มีปัญหากับคุกกี้ หลังจากเข้าสู่ระบบสำเร็จจะมีส่วนหัวของคุกกี้ในคำขอในอนาคต แต่การดึงข้อมูลดูเหมือนจะไม่สนใจส่วนหัวนั้นและคำขอทั้งหมดของฉันที่ทำด้วยการดึงข้อมูลนั้นไม่ได้รับอนุญาต เป็นเพราะการดึงข้อมูลยังไม่พร้อมหรือการดึงข้อมูลไม่ทำงานกับคุกกี้ ฉันสร้างแอปของฉันด้วย Webpack ฉันยังใช้ Fetch ใน React Native ซึ่งไม่มีปัญหาเดียวกัน
201 cookies  fetch-api 

4
การตอบสนองแบบทึบคืออะไรและมีจุดประสงค์อะไร
ฉันพยายามfetchURL ของเว็บไซต์เก่าและเกิดข้อผิดพลาด: Fetch API cannot load http://xyz. No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'http://abc' is therefore not allowed access. If an opaque response serves your needs, set the request's mode to 'no-cors' to fetch the resource with CORS disabled. ฉันเข้าใจข้อความและพยายามทำคำขอที่ส่งคืนการตอบกลับที่ทึบแสง: fetch("http://xyz", {'mode': 'no-cors'}) ตกลงตอนนี้มันใช้งานได้ ... แต่ฉันอ่านไม่ออก …
172 cors  fetch-api 

9
ฉันจะอัพโหลดไฟล์ด้วย JS fetch API ได้อย่างไร
ฉันยังคงพยายามห่อหัวของฉันรอบ ๆ มัน ฉันสามารถให้ผู้ใช้เลือกไฟล์ (หรือหลาย ๆ ไฟล์) ด้วยอินพุตไฟล์: <form> <div> <label>Select file to upload</label> <input type="file"> </div> <button type="submit">Convert</button> </form> และผมสามารถจับเหตุการณ์ใช้submit <fill in your event handler here>แต่เมื่อฉันทำฉันจะส่งไฟล์โดยใช้fetch? fetch('/files', { method: 'post', // what goes here? What is the "body" for this? content-type header? }).then(/* whatever */);

5
กำลังพยายามใช้การดึงข้อมูลและส่งผ่านในโหมด: no-cors
ฉันสามารถเข้าถึงจุดสิ้นสุดนี้http://catfacts-api.appspot.com/api/facts?number=99ผ่านบุรุษไปรษณีย์และได้รับผลตอบแทนJSON นอกจากนี้ฉันกำลังใช้ create-react-app และต้องการหลีกเลี่ยงการตั้งค่าเซิร์ฟเวอร์ใด ๆ ในรหัสลูกค้าของฉันฉันพยายามที่จะใช้fetchเพื่อทำสิ่งเดียวกัน แต่ฉันได้รับข้อผิดพลาด: ไม่มีส่วนหัว 'Access-Control-Allow-Origin' บนทรัพยากรที่ร้องขอ แหล่งกำเนิด ' http: // localhost: 3000 ' จึงไม่ได้รับอนุญาตให้เข้าถึง หากการตอบกลับทึบแสงตอบสนองความต้องการของคุณให้ตั้งค่าโหมดคำขอเป็น 'no-cors' เพื่อดึงข้อมูลทรัพยากรโดยปิดการใช้งาน CORS ดังนั้นฉันพยายามส่งผ่านวัตถุไปยัง Fetch ของฉันซึ่งจะปิดใช้งาน CORS ดังนี้: fetch('http://catfacts-api.appspot.com/api/facts?number=99', { mode: 'no-cors'}) .then(blob => blob.json()) .then(data => { console.table(data); return data; }) .catch(e => { console.log(e); return e; }); น่าสนใจพอที่ข้อผิดพลาดที่ฉันได้รับเป็นข้อผิดพลาดทางไวยากรณ์ของฟังก์ชันนี้ ฉันไม่แน่ใจว่าจริงของฉันfetchเสียเพราะเมื่อฉันลบวัตถุ …

3
ดึง API กับ XMLHttpRequest
ฉันรู้ว่า Fetch API ใช้Promises และทั้งคู่อนุญาตให้คุณทำคำขอ AJAX ไปยังเซิร์ฟเวอร์ ฉันได้อ่านแล้วว่า Fetch API มีคุณสมบัติพิเศษบางอย่างซึ่งไม่สามารถใช้ได้XMLHttpRequest(และใน Fetch API polyfill เนื่องจากมีพื้นฐานมาจากXHR) API การดึงข้อมูลมีความสามารถพิเศษใดบ้าง

11
การตั้งค่าสตริงแบบสอบถามโดยใช้การดึงข้อมูลคำขอ GET
ฉันพยายามใช้API การดึงข้อมูลใหม่: ฉันกำลังGETขอสิ่งนี้: var request = new Request({ url: 'http://myapi.com/orders', method: 'GET' }); fetch(request); อย่างไรก็ตามฉันไม่แน่ใจว่าจะเพิ่มสตริงข้อความค้นหาในGETคำขอได้อย่างไร เป็นการดีที่ฉันต้องการที่จะสามารถGETขอให้URLชอบ: 'http://myapi.com/orders?order_id=1' ในjQueryที่ฉันสามารถทำเช่นนี้โดยการส่งผ่าน{order_id: 1}เป็นพารามิเตอร์ของdata $.ajax()มีวิธีที่เทียบเท่ากับการทำเช่นนั้นกับใหม่Fetch APIหรือไม่

22
ตอบสนองการดึงข้อมูลดั้งเดิม () คำขอเครือข่ายล้มเหลว
เมื่อฉันสร้างแบรนด์โครงการใหม่โดยใช้react-native init(RN รุ่น 0.29.1) และใส่ดึงข้อมูลในการแสดงผลวิธีการไปยัง Facebook สาธารณะภาพยนตร์สาธิต API Network Request Failedก็พ่น มีการติดตามสแต็คที่ไร้ประโยชน์มากและฉันไม่สามารถดีบักคำขอเครือข่ายในคอนโซล Chrome ได้ นี่คือการดึงข้อมูลที่ฉันส่ง: fetch('http://facebook.github.io/react-native/movies.json') .then((response) => response.json()) .then((responseJson) => { return responseJson.movies; }) .catch((error) => { console.error(error); });

4
การใช้ส่วนหัวการให้สิทธิ์กับดึงข้อมูลในการตอบสนองแบบเนทีฟ
ฉันกำลังพยายามใช้fetchใน React Native เพื่อดึงข้อมูลจาก Product Hunt API ฉันได้รับโทเค็นการเข้าถึงที่เหมาะสมและบันทึกไว้ในสถานะแล้ว แต่ดูเหมือนจะไม่สามารถส่งต่อได้ภายในส่วนหัวการให้สิทธิ์สำหรับคำขอ GET นี่คือสิ่งที่ฉันมี: var Products = React.createClass({ getInitialState: function() { return { clientToken: false, loaded: false } }, componentWillMount: function () { fetch(api.token.link, api.token.object) .then((response) => response.json()) .then((responseData) => { console.log(responseData); this.setState({ clientToken: responseData.access_token, }); }) .then(() => { this.getPosts(); }) .done(); …

15
หมายความว่าอย่างไรเมื่อคำขอ HTTP ส่งคืนรหัสสถานะ 0
หมายความว่าอย่างไรเมื่อการเรียกเครือข่าย JavaScript เช่นการดึงข้อมูลหรือ XMLHttpRequest หรือการร้องขอเครือข่าย HTTP ประเภทอื่น ๆ ล้มเหลวด้วยรหัสสถานะ HTTP เป็น 0? ดูเหมือนจะไม่เป็นรหัสสถานะ HTTP ที่ถูกต้องเนื่องจากรหัสอื่นเป็นตัวเลขสามหลักในข้อกำหนด HTTP ฉันลองถอดปลั๊กเครือข่ายออกมาเป็นการทดสอบ อาจไม่เกี่ยวข้อง แต่ทำให้รหัสสถานะ 17003 (IIRC) ซึ่งการค้นหาคร่าวๆแนะนำว่าหมายถึง "การค้นหาเซิร์ฟเวอร์ DNS ล้มเหลว" รหัสเดียวกันทำงานได้ดีจากบางสถานที่และระบบอย่างไรก็ตามในบางสภาพแวดล้อมมันล้มเหลวด้วยรหัสสถานะ 0 และไม่มีการตอบสนองต่อข้อความ นี่เป็น HTTP POST ทั่วไปสำหรับ URL อินเทอร์เน็ต ไม่เกี่ยวข้องกับไฟล์: // ซึ่งฉันเข้าใจว่าอาจส่งคืน 0 แสดงถึงความสำเร็จใน Firefox

8
การพิสูจน์ตัวตนขั้นพื้นฐานด้วยการดึงข้อมูล?
ฉันต้องการเขียนการรับรองความถูกต้องพื้นฐานง่ายๆด้วยการดึงข้อมูล แต่ฉันได้รับข้อผิดพลาด 401 อยู่เรื่อย ๆ จะดีมากถ้ามีคนบอกรหัสว่ามีอะไรผิดปกติ: let base64 = require('base-64'); let url = 'http://eu.httpbin.org/basic-auth/user/passwd'; let username = 'user'; let password = 'passwd'; let headers = new Headers(); //headers.append('Content-Type', 'text/json'); headers.append('Authorization', 'Basic' + base64.encode(username + ":" + password)); fetch(url, {method:'GET', headers: headers, //credentials: 'user:passwd' }) .then(response => response.json()) .then(json => console.log(json)); …

5
ฉันจะโพสต์ข้อมูลแบบฟอร์มด้วย fetch api ได้อย่างไร
รหัสของฉัน: fetch("api/xxx", { body: new FormData(document.getElementById("form")), headers: { "Content-Type": "application/x-www-form-urlencoded", // "Content-Type": "multipart/form-data", }, method: "post", } ฉันพยายามโพสต์แบบฟอร์มของฉันโดยใช้ fetch api และเนื้อหาที่ส่งเป็นดังนี้: -----------------------------114782935826962 Content-Disposition: form-data; name="email" test@example.com -----------------------------114782935826962 Content-Disposition: form-data; name="password" pw -----------------------------114782935826962-- (ฉันไม่รู้ว่าทำไมจำนวนในขอบเขตถึงเปลี่ยนทุกครั้งที่ส่ง ... ) ฉันต้องการให้ส่งข้อมูลด้วย "Content-Type": "application / x-www-form-urlencoded" ฉันควรทำอย่างไร หรือหากฉันต้องจัดการกับมันฉันจะถอดรหัสข้อมูลในคอนโทรลเลอร์ได้อย่างไร? ใครที่ตอบคำถามของฉันฉันรู้ว่าฉันทำได้โดย: fetch("api/xxx", { body: "email=test@example.com&password=pw", headers: { "Content-Type": …

4
ทำไม. json () ถึงคืนคำสัญญา?
fetch()เมื่อเร็ว ๆ นี้ฉันยุ่งกับapi และสังเกตเห็นบางอย่างที่แปลกไปหน่อย let url = "http://jsonplaceholder.typicode.com/posts/6"; let iterator = fetch(url); iterator .then(response => { return { data: response.json(), status: response.status } }) .then(post => document.write(post.data)); ; post.dataส่งคืนPromiseวัตถุ http://jsbin.com/wofulo/2/edit?js,output อย่างไรก็ตามหากเขียนเป็น: let url = "http://jsonplaceholder.typicode.com/posts/6"; let iterator = fetch(url); iterator .then(response => response.json()) .then(post => document.write(post.title)); ; postนี่คือมาตรฐานObjectที่คุณสามารถเข้าถึงแอตทริบิวต์หัวเรื่อง http://jsbin.com/wofulo/edit?js,output ดังนั้นคำถามของฉันคือทำไมresponse.jsonส่งคืนคำสัญญาในตัวอักษรของวัตถุ …

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