คำถามติดแท็ก axios

Axios เป็นไคลเอนต์ HTTP ตาม Promise สำหรับ JavaScript ซึ่งสามารถใช้ในแอปพลิเคชันส่วนหน้าและในแบ็กเอนด์ Node.js ของคุณ

9
axios โพสต์คำขอเพื่อส่งข้อมูลแบบฟอร์ม
POSTคำขอaxios กดปุ่ม url บนคอนโทรลเลอร์ แต่การตั้งค่า null เป็นคลาส POJO ของฉันเมื่อฉันไปถึงเครื่องมือสำหรับนักพัฒนาซอฟต์แวร์ใน chrome โครเมี่ยม payload มีข้อมูล ผมทำอะไรผิดหรือเปล่า? คำขอ Axios POST: var body = { userName: 'Fred', userEmail: 'Flintstone@gmail.com' } axios({ method: 'post', url: '/addUser', data: body }) .then(function (response) { console.log(response); }) .catch(function (error) { console.log(error); }); การตอบสนองของเบราว์เซอร์: หากฉันตั้งค่าส่วนหัวเป็น: headers:{ Content-Type:'multipart/form-data' } คำขอส่งข้อผิดพลาด …

10
ฉันจะรับรหัสสถานะจากข้อผิดพลาด http ใน Axios ได้อย่างไร
นี่อาจดูเหมือนโง่ แต่ฉันพยายามรับข้อมูลข้อผิดพลาดเมื่อคำขอล้มเหลวใน Axios axios.get('foo.com') .then((response) => {}) .catch((error) => { console.log(error) //Logs a string: Error: Request failed with status code 404 }) แทนที่จะเป็นสตริงมันเป็นไปได้ไหมที่จะรับอ็อบเจกต์ด้วยรหัสสถานะและเนื้อหา? ตัวอย่างเช่น: Object = {status: 404, reason: 'Not found', body: '404 Not found'}
204 javascript  axios 

8
Axios เข้าถึงช่องส่วนหัวการตอบกลับ
ฉันกำลังสร้างแอปส่วนหน้าด้วย React และ Redux และฉันใช้axiosเพื่อดำเนินการตามคำขอของฉัน ฉันต้องการเข้าถึงฟิลด์ทั้งหมดในส่วนหัวของการตอบกลับ ในเบราว์เซอร์ของฉันฉันสามารถตรวจสอบส่วนหัวและฉันเห็นว่าทุกฟิลด์ที่ฉันต้องการมีอยู่ (เช่นโทเค็น, uid, ฯลฯ ... ) แต่เมื่อฉันโทร const request = axios.post(`${ROOT_URL}/auth/sign_in`, props); request.then((response)=>{ console.log(response.headers); }); ฉันเพิ่งได้รับ Object {content-type: "application/json; charset=utf-8", cache-control: "max-age=0, private, must-revalidate"} ที่นี่แท็บเครือข่ายเบราว์เซอร์ของฉันเนื่องจากคุณสามารถดูฟิลด์อื่นทั้งหมดได้ bests


7
การส่งผ่านส่วนหัวด้วยคำขอ axios POST
ฉันได้เขียนคำขอ axios POST ตามที่แนะนำจากเอกสารประกอบแพ็คเกจ npm เช่น: var data = { 'key1': 'val1', 'key2': 'val2' } axios.post(Helper.getUserAPI(), data) .then((response) => { dispatch({type: FOUND_USER, data: response.data[0]}) }) .catch((error) => { dispatch({type: ERROR_FINDING_USER}) }) และใช้งานได้ แต่ตอนนี้ฉันได้แก้ไข API แบ็กเอนด์เพื่อยอมรับส่วนหัวแล้ว ประเภทเนื้อหา: 'application / json' การอนุญาต: 'JWT fefege ... ' ตอนนี้คำขอนี้ใช้งานได้ดีกับบุรุษไปรษณีย์ แต่เมื่อเขียนการโทร axios ฉันไปตามลิงค์นี้และไม่สามารถใช้งานได้ ฉันได้รับ400 BAD …

9
แนบส่วนหัวการอนุญาตสำหรับคำขอ axios ทั้งหมด
ฉันมีแอปพลิเคชัน react / redux ที่ดึงโทเค็นจากเซิร์ฟเวอร์ api หลังจากผู้ใช้ตรวจสอบสิทธิ์แล้วฉันต้องการให้คำขอ axios ทั้งหมดมีโทเค็นนั้นเป็นส่วนหัวการอนุญาตโดยไม่ต้องแนบด้วยตนเองกับทุกคำขอในการดำเนินการ ฉันค่อนข้างใหม่ในการตอบสนอง / redux และไม่แน่ใจในแนวทางที่ดีที่สุดและฉันไม่พบเพลงที่มีคุณภาพใด ๆ ใน Google นี่คือการตั้งค่า redux ของฉัน: // actions.js import axios from 'axios'; export function loginUser(props) { const url = `https://api.mydomain.com/login/`; const { email, password } = props; const request = axios.post(url, { email, password }); return { …
133 reactjs  redux  axios 

3
วิธีโพสต์ไฟล์จากแบบฟอร์มด้วย Axios
การใช้ HTML ดิบเมื่อฉันโพสต์ไฟล์ไปยังเซิร์ฟเวอร์ flask โดยใช้สิ่งต่อไปนี้ฉันสามารถเข้าถึงไฟล์จากคำขอ flask global: <form id="uploadForm" action='upload_file' role="form" method="post" enctype=multipart/form-data> <input type="file" id="file" name="file"> <input type=submit value=Upload> </form> ในขวด: def post(self): if 'file' in request.files: .... เมื่อฉันพยายามทำเช่นเดียวกันกับ Axios คำขอ flask global ว่างเปล่า: <form id="uploadForm" enctype="multipart/form-data" v-on:change="uploadFile"> <input type="file" id="file" name="file"> </form> uploadFile: function (event) { const file …

11
วิธีดาวน์โหลดไฟล์โดยใช้ axios
ฉันใช้ axios สำหรับคำขอ http พื้นฐานเช่น GET และ POST และทำงานได้ดี ตอนนี้ฉันต้องสามารถดาวน์โหลดไฟล์ Excel ได้ด้วย เป็นไปได้ด้วย axios? ถ้ามีใครมีโค้ดตัวอย่างบ้าง ถ้าไม่ฉันจะใช้อะไรอีกในแอปพลิเคชัน React เพื่อทำเช่นเดียวกัน
124 axios 

2
Axios รับใน url ใช้งานได้ แต่มีพารามิเตอร์ที่สองเป็นอ็อบเจ็กต์
ฉันกำลังพยายามส่งคำขอ GET เป็นพารามิเตอร์ที่สอง แต่ไม่ได้ผลในขณะที่ทำเป็น url วิธีนี้ได้ผล $ _GET ['naam'] ส่งกลับการทดสอบ: export function saveScore(naam, score) { return function (dispatch) { axios.get('http://****.nl/****/gebruikerOpslaan.php?naam=test') .then((response) => { dispatch({type: "SAVE_SCORE_SUCCESS", payload: response.data}) }) .catch((err) => { dispatch({type: "SAVE_SCORE_FAILURE", payload: err}) }) } }; แต่เมื่อฉันลองสิ่งนี้ไม่มีอะไรเลย$_GET: export function saveScore(naam, score) { return function (dispatch) { axios.get('http://****.nl/****/gebruikerOpslaan.php', { …

10
ทำให้ Axios ส่งคุกกี้ในคำขอโดยอัตโนมัติ
ฉันกำลังส่งคำขอจากไคลเอนต์ไปยังเซิร์ฟเวอร์ Express.js โดยใช้ Axios ฉันตั้งค่าคุกกี้บนไคลเอนต์และฉันต้องการอ่านคุกกี้นั้นจากคำขอของ Axios ทั้งหมดโดยไม่ต้องเพิ่มคุกกี้ด้วยตนเองเพื่อขอด้วยมือ นี่คือตัวอย่างคำขอไคลเอ็นต์ของฉัน: axios.get(`some api url`).then(response => ... ฉันพยายามเข้าถึงส่วนหัวหรือคุกกี้โดยใช้คุณสมบัติเหล่านี้ในเซิร์ฟเวอร์ Express.js ของฉัน: req.headers req.cookies ไม่มีคุกกี้ใด ๆ ฉันใช้มิดเดิลแวร์ตัวแยกวิเคราะห์คุกกี้: app.use(cookieParser()) ฉันจะทำให้ Axios ส่งคุกกี้ในคำขอโดยอัตโนมัติได้อย่างไร แก้ไข: ฉันตั้งค่าคุกกี้บนไคลเอนต์ดังนี้: import cookieClient from 'react-cookie' ... let cookie = cookieClient.load('cookie-name') if(cookie === undefined){ axios.get('path/to/my/cookie/api').then(response => { if(response.status == 200){ cookieClient.save('cookie-name', response.data, {path:'/'}) } }) …

9
การส่งโทเค็นผู้ถือด้วย axios
ในแอปตอบกลับของฉันฉันใช้axiosเพื่อดำเนินการร้องขอ REST api แต่ไม่สามารถส่งส่วนหัวการให้สิทธิ์พร้อมคำขอได้ นี่คือรหัสของฉัน: tokenPayload() { let config = { headers: { 'Authorization': 'Bearer ' + validToken() } } Axios.post( 'http://localhost:8000/api/v1/get_token_payloads', config ) .then( ( response ) => { console.log( response ) } ) .catch() } นี่คือvalidToken()วิธีการก็จะกลับมาจากการจัดเก็บโทเค็นเบราว์เซอร์ คำขอทั้งหมดมีการตอบสนองข้อผิดพลาด 500 รายการโดยแจ้งว่า ไม่สามารถแยกวิเคราะห์โทเค็นจากคำขอได้ จากด้านหลัง จะส่งส่วนหัวการให้สิทธิ์กับแต่ละคำขอได้อย่างไร คุณจะแนะนำโมดูลอื่น ๆ ที่มีปฏิกิริยาหรือไม่?

11
Axios ลบคำขอที่มีเนื้อหาและส่วนหัวหรือไม่
ฉันใช้ Axios ขณะเขียนโปรแกรมใน ReactJS และฉันแสร้งทำเป็นส่งคำขอ DELETE ไปยังเซิร์ฟเวอร์ของฉัน ในการทำเช่นนั้นฉันต้องการส่วนหัว: headers: { 'Authorization': ... } และร่างกายประกอบด้วย var payload = { "username": .. } ฉันค้นหาในเว็บระหว่างกันและพบเพียงว่าเมธอด DELETE ต้องการ "พารามิเตอร์" และไม่ยอมรับ "ข้อมูล" ฉันพยายามส่งแบบนี้: axios.delete(URL, payload, header); หรือแม้กระทั่ง axios.delete(URL, {params: payload}, header); แต่ดูเหมือนจะไม่ได้ผล ... ใครช่วยบอกหน่อยได้ไหมว่าเป็นไปได้ (ฉันคิดว่าเป็น) เพื่อส่งคำขอ DELETE พร้อมทั้งส่วนหัวและเนื้อหาและต้องทำอย่างไร ขอบคุณล่วงหน้า!

6
วิธีส่ง Basic Auth ด้วย axios
ฉันกำลังพยายามติดตั้งโค้ดต่อไปนี้ แต่มีบางอย่างไม่ทำงาน นี่คือรหัส: var session_url = 'http://api_address/api/session_endpoint'; var username = 'user'; var password = 'password'; var credentials = btoa(username + ':' + password); var basicAuth = 'Basic ' + credentials; axios.post(session_url, { headers: { 'Authorization': + basicAuth } }).then(function(response) { console.log('Authenticated'); }).catch(function(error) { console.log('Error on Authentication'); }); มันส่งคืนข้อผิดพลาด 401 เมื่อฉันทำกับบุรุษไปรษณีย์จะมีตัวเลือกในการตั้งค่าการตรวจสอบสิทธิ์ขั้นพื้นฐาน …
118 request  postman  axios 

9
วิธีส่งส่วนหัวการอนุญาตด้วย axios
ฉันจะส่งส่วนหัวการตรวจสอบความถูกต้องด้วยโทเค็นผ่าน axios.js ได้อย่างไร ฉันได้ลองทำบางอย่างแล้วไม่ประสบความสำเร็จเช่น: const header = `Authorization: Bearer ${token}`; return axios.get(URLConstants.USER_URL, { headers: { header } }); ทำให้ฉันมีข้อผิดพลาดนี้: XMLHttpRequest cannot load http://localhost:8000/accounts/user/. Request header field header is not allowed by Access-Control-Allow-Headers in preflight response. ฉันจัดการเพื่อให้มันทำงานได้โดยการตั้งค่าเริ่มต้นทั่วโลก แต่ฉันเดาว่านี่ไม่ใช่ความคิดที่ดีที่สุดสำหรับคำขอเดียว axios.defaults.headers.common['Authorization'] = `Bearer ${token}`; อัปเดต: คำตอบของโคลช่วยให้ฉันพบปัญหา ฉันใช้มิดเดิลแวร์ django-cors-headersซึ่งจัดการส่วนหัวการอนุญาตตามค่าเริ่มต้นแล้ว แต่ฉันสามารถเข้าใจข้อความแสดงข้อผิดพลาดและแก้ไขข้อผิดพลาดในรหัสคำขอ axios ของฉันซึ่งควรมีลักษณะดังนี้ return axios.get(URLConstants.USER_URL, …
99 javascript  axios 

4
เปลี่ยนสถานะแบบไดนามิกตามการเชื่อมต่ออินเทอร์เน็ตภายนอก - ตอบสนอง (ออฟไลน์ / ออนไลน์)
ฉันมีองค์ประกอบ React ซึ่งรวมถึงสถานะความพร้อมใช้งานของการเชื่อมต่ออินเทอร์เน็ต องค์ประกอบ UI จะต้องเปลี่ยนแปลงแบบไดนามิกตามสถานะเรียลไทม์ ฟังก์ชั่นจะทำงานแตกต่างกันไปตามการเปลี่ยนแปลงของธง การใช้งานปัจจุบันของฉันสำรวจระยะไกล API โดยใช้ Axios ในทุก ๆ วินาทีโดยใช้ช่วงเวลาและปรับปรุงสถานะให้สอดคล้อง ฉันกำลังมองหาวิธีที่ละเอียดและมีประสิทธิภาพมากขึ้นในการทำงานนี้เพื่อลบข้อผิดพลาด 1 วินาทีของสถานะด้วยต้นทุนการคำนวณขั้นต่ำ ถือว่าออนไลน์ถ้าหากว่าอุปกรณ์นั้นมีการเชื่อมต่ออินเทอร์เน็ตภายนอก การใช้งานในปัจจุบัน: class Container extends Component { constructor(props) { super(props) this.state = { isOnline: false }; this.webAPI = new WebAPI(); //Axios wrapper } componentDidMount() { setInterval(() => { this.webAPI.poll(success => this.setState({ isOnline: success …
โดยการใช้ไซต์ของเรา หมายความว่าคุณได้อ่านและทำความเข้าใจนโยบายคุกกี้และนโยบายความเป็นส่วนตัวของเราแล้ว
Licensed under cc by-sa 3.0 with attribution required.