2015-12-31 14 views
5

Używam API fetch z React Native.Dlaczego fetch zwraca dziwny skrót z liczb całkowitych?

Moja odpowiedź jest zgodna z normalnym formatem {"message": "error here"}, jeśli status jest> = 400, co pokażę w rodzimym wyskakującym okienku.

Próbuję zadzwonić response.json() po wykryciu awarii, ale trzyma oddanie wszystkiego w dziwnym formacie ...

{ _45: 0, _81: 0, _65: null, _54: null }

Z jakiegoś powodu ... rzeczywista odpowiedź chcę znajduje w _65 ... Nie mam pojęcia, co to są losowe klucze.

Obecnie muszę uzyskać do niego dostęp poprzez _bodyText, ale zakładam, że jest źle, ponieważ jest to prywatna metoda podkreślenia.

Co robię źle?

var API = (function() { 

    var base = 'https://example.com/api/v1'; 

    var defaults = { 
    credentials: 'same-origin', 
    headers: { 
     'Accept': 'application/json', 
     'Content-Type': 'application/json' 
    } 
    }; 

    var alertFailure = function(response) { 
    if (response.status >= 200 && response.status < 400) { 
     return response; 
    } else { 
     var json = JSON.parse(response._bodyText || '{}'); 
     var message = json.message || 'There was a problem. Close the app, and try again later.'; 

     var error = new Error(message); 
     error.response = response; 
     throw error; 
    } 
    }; 

    var callAPI = function(url, opts) { 
    opts.headers['X-Version'] = 'v' + Package.version; 

    return fetch(base + url, opts) 
     .then(alertFailure) 
     .then((response) => { 
     return response.json(); 
     }) 
     .catch((error) => { 
     Alert.alert(null, error.message); 
     }); 
    }; 

    return { 

    get: function(url, opts) { 
     var fullOpts = Object.assign({}, defaults, opts); 
     return callAPI(url, fullOpts); 
    }, 

    post: function(url, data, opts) { 
     var fullOpts = Object.assign({}, defaults, { 
     method: 'POST', 
     body: JSON.stringify(data || {}) 
     }, opts); 
     return callAPI(url, fullOpts); 
    } 
    }; 

})(); 

Odpowiedz

8

Odpowiedź brzmi, że .json() zwraca obietnicę ... więc musiałem zrobić wszystko od wewnątrz .then()

+0

To samo dotyczy 'asyncstorage' – James111

+0

Po prostu wystąpił ten sam problem z' async' i 'await'. Nadal próbuję go rozwiązać. – Dan

+0

Dodałem mój problem tutaj http://stackoverflow.com/questions/36285564/why-does-fetch-return-a-weird-hash-of-integers-part-2 – Dan

1

AsyncStorage.getItems zawsze zwraca obietnicę. Można użyć tej metody poniżej

AsyncStorage.getItem("access_key").then((value)=> 
       { 
        console.log(value); 
       }); 
1

mi polecacie do korzystania z nowego ES7 składni async/await, są łatwiejsze do zrozumienia niż przy użyciu .then()

Aby go użyć, wystarczy zadeklarować jakąś metodę z przedrostkiem asynchronicznym i w jego obrębie czekaj na zakończenie połączenia.

Np

async someMethod(){ 
    result = await fetch(URL); // Do some request to any API. 
    // Use the result after that knowing that you'll have it completed. 
} 

Mam nadzieję, że to pomoże, przynajmniej moim zdaniem, uważam to łatwiejsze niż przy użyciu .then(), zwłaszcza, gdy trzeba zrobić kilka połączeń w obrębie tej samej metody.