2016-02-01 20 views
20

Próbuję zrobić żądania POST za pomocą jQuery za pomocą obietnicy ES6:jQuery ajax z ES6 Promises

Mam funkcję:

getPostPromise(something, anotherthing) { 
    return new Promise(function(resolve, reject) { 
    $.ajax({ 
     url: someURL, 
     type: 'post', 
     contentType: 'application/json; charset=utf-8', 
     data: JSON.stringify(
     something: something, 
     anotherthing: anotherthing 
     }), 
     dataType: 'json', 
     success: resolve, 
     error: reject 
    }); 
    }); 
} 

i nazywam go tak:

getPostPromise(
    'someFooStuff', 
    'someBarStuff' 
).then(
    function(returnedData) { 
    console.log("Good: ", returnedData); 
    }, 
    function(responseObject) { 
    console.log("Bad: ", responseObject); 
    } 
).catch(
    function(errorThrown) { 
    console.log("Exception: ", errorThrown); 
    } 
); 

Mój serwer zwraca odpowiedź zgodnie z oczekiwaniami, ponieważ treść żądania jest w formacie JSON, ale moje wyjście konsoli to:

Dobra: niezdefiniowana

Dlaczego nie otrzymuję zwróconych danych?

Dziękuję wszystkim/każdemu za pomoc.

--- EDIT --- UPDATE

mam zmniejszone moje js tylko:

import $ from 'jquery'; 
$.get('http://localhost:8008/api/user') 
    .done(function(data) { 
    console.log(data); 
    }); 

ja wciąż nieokreślone jako wyjście. Jeśli otworzę żądanie na karcie sieci, widzę obiekt odpowiedzi z poprawnymi danymi. Wniosek został złożony, mój serwer jest szczęśliwy i odpowiada, a wyniki są w mojej przeglądarce, ale parametr danych wykonanych jest niezdefiniowany. Jestem zaskoczony.

--- UPDATE 2 - ROZWIĄZANIE FOUND ---

odkryłem, że problem był z użyciem: https://github.com/jpillora/xdomain obejść CORS. Wydawać by się mogło, że biblioteka ta jakoś zawraca. Usunąłem go i będę prawidłowo wdrażał CORS i do diabła z przeglądarkami, które go nie obsługują.

+1

I nie można odtworzyć swój błąd. –

Odpowiedz

27

Metody jQuery Ajax zwracają obietnice same w sobie, nie musisz potrzebować, aby je w ogóle zawinąć.

Ale możesz oczywiście zrobić to dla spójności z API obietnicy ES6.

UPDATE jQuery 3.0+ realizuje the Promise/A+ API, więc nie ma powodu, już do niczego owijać w nowoczesnym jQuery. Przeczytaj na the peculiarities of jQuery's promise implementation prior to version 3.0.

Dla wersji jQuery przed 3,0, bym go oddzielić więcej niż ty:

function ajax(options) { 
    return new Promise(function (resolve, reject) { 
    $.ajax(options).done(resolve).fail(reject); 
    }); 
} 

i

ajax({ 
    url: someURL, 
    type: 'post', 
    contentType: 'application/json; charset=utf-8', 
    data: JSON.stringify({ 
    something: something, 
    anotherthing: anotherthing 
    }) 
}).then(
    function fulfillHandler(data) { 
    // ... 
    }, 
    function rejectHandler(jqXHR, textStatus, errorThrown) { 
    // ... 
    } 
).catch(function errorHandler(error) { 
    // ... 
}); 
+0

Czy przetestowałeś swój fragment? –

+0

@ elad.chen Jeśli masz na myśli zabłąkane '}' powodujące błąd składni, to jest naprawione, dziękuję. – Tomalak

+0

Podoba mi się to, przetestuję go, gdy wrócę do domu z pracy i oznaczyć go jako zaakceptowany po potwierdzeniu, że jest poprawny. Dzięki. –