2016-02-06 5 views
5

मेरे पास एक वेबैप react.js/redux/webpackt/es6 ... और gorilla से mux के साथ जाने के लिए एक api है।
जब मैं अपने हेडर के नीचे फ़ंक्शन के साथ कॉल करता हूं तो खाली और सामग्री भी होती है।प्रीफलाइट के कारण खाली उत्तर प्राप्त करें?

मैं कॉल

"isomorphic-fetch": "^2.2.1", 

मेरे कॉल उदाहरण बनाने के लिए

export function Login(userData) { 
    return dispatch => { 
    fetch(API + '/login', { 
     method: 'post', 
     headers: { 
     'Accept': 'application/json', 
     'Content-Type': 'application/json', 
     }, 
     body: JSON.stringify({ 
     email: userData.email, 
     password: userData.password, 
     }), 
    }) 
    .then(response => { 
     console.log(response); 
     console.log(response.statusText); 
     console.log(response.status); 
     console.log(response.headers); 
     console.log(response.headers.get("Authorization")); 
     console.log(response.json()); 
     return response.json() 
     if (response.status >= 200 && response.status < 300) { 
     console.log(response); 
     dispatch(LoginSuccess(response)); 
     } else { 
     const error = new Error(response.statusText); 
     error.response = response; 
     dispatch(LoginError(error)); 
     throw error; 
     } 
    }).then(function(json) { 
     console.log('parsed json' + json) 
    }) 
    .catch(error => { console.log('request failed', error); }); 
    } 

शुरुआत में मेरी webapp में इस पैकेज का उपयोग कर रहा मैं CORS How to handle preflight CORS requests on a Go server मैं इस समाधान का इस्तेमाल किया के साथ एक समस्या थी

हम कंसोल के अंदर कॉल देख सकते हैं:

login OPTIONS 200 fetch auths.actions.js:38 352 B 1 ms  
login POST  200 json Other 567 B 82 ms 

जब मैं अपने पोस्ट हैडर प्रतिक्रिया के अंदर देखो मेरे पास है:

HTTP/1.1 200 OK 
Access-Control-Allow-Headers: Accept, Content-Type, Content-Length, Accept-Encoding, X-CSRF-Token, Authorization 
Access-Control-Allow-Methods: POST, GET, OPTIONS, PUT, PATCH, DELETE 
Access-Control-Allow-Origin: http://localhost:3000 
Authorization: Bearer eyJhbGciOiJSUzI1NiIsInR5cCI6IkpXVCJ9.eyJpYXQiOjE0NTQ3NTcxNjEsInVzZXJfaWQiOiI1NmI1YjZlOTFhZTMzYjAwMDFhYmE1MTQifQ.WGoTMxm6OuN24Olwr93J3pND9dFLCtG5MyiRbqLWeD244JtDzq0bGgQMixeZxyuxwGK3u8KhyWD7Rr6iZAGNpA 
Content-Type: application/json 
Date: Sat, 06 Feb 2016 11:12:41 GMT 
Content-Length: 2 

तो प्रतिक्रिया मेरी preflight जानकारी मेरी पोस्ट को संभाल नहीं? क्योंकि response.headers और response.headers.get("Authorization") के अंदर कुछ भी नहीं है कुछ गलत है?

+1

जैसा कि आप जानते आप लॉग के बाद अपने तो() हैंडलर से लौट रहे हैं? – Salva

उत्तर

7

मुझे समस्या थी कि मेरे शीर्षलेख भेजे गए थे, सही ढंग से प्राप्त किया गया था (क्रोम का नेटवर्क टैब सही ढंग से मुझे सभी भेजे गए शीर्षलेख दिखाता है), लेकिन मैं उन्हें जेएस (response.headers खाली) में एक्सेस नहीं कर सका। जैसा कि Fetch get request returns empty headers में वर्णित है, ऐसा इसलिए हुआ क्योंकि सर्वर ने Access-Control-Expose-Headers शीर्षलेख सेट नहीं किया था, जिसके परिणामस्वरूप आवश्यक शीर्षलेख जेएस के संपर्क में नहीं आये थे। तो समाधान सर्वर और देखा पर इस शीर्ष लेख को जोड़ने के लिए है, अब हेडर js में उपलब्ध हैं:

Access-Control-Expose-Headers: <header-name>, <header-name>, ... 

हैडर ब्राउज़र को उजागर किया हेडर नामों की एक अल्पविराम से अलग किए लेता है।

क्यों इस शीर्ष लेख की जरूरत है पर अतिरिक्त जानकारी के लिए, देखें Why is Access-Control-Expose-Headers needed?

+0

मेरे समाधान में मैंने अभी lib को बदल दिया है। मुझे फिर से ऐसा करने का अवसर मिलेगा मैं तुम्हारा प्रयास करूंगा। – Manawasp

+0

धन्यवाद आईरिस! हम में से कुछ दस्तावेज़ों के माध्यम से जाने से ज्यादा एसओ पर भरोसा करते हैं: पी – Aukhan

संबंधित मुद्दे