fetch()

window.fetch() - дозволяє робити AJAX запити. Це нова альтернатива XMLHttpRequest яка побудована на Promise.

Синтаксис:

window.fetch( url, options);

Параметри:

window не обов'язково вказувати. Об'єкт window.

url - рядок який містить URL адресу на який потрібно відправити запит.

options - не обов'язково вказувати. Об'єкт який містить додаткові параметри запиту:

Опис:

fetch() метод об'єкта window який дозволяє робити AJAX запити на основі Promise.

fetch() повертає Promise який при отримані відповіді від сервера виконує вказану функцію в якій передається об'єкт response як параметр.

fetch('/').then(function(response){ alert( response.status ); });

За замовчуванням fetch() не відправляє і не отримує куки з сервера. Щоб дозволити куки вкажіть у параметрі options опцію credentials: 'same-origin'.

fetch('/', {credentials: 'same-origin'}).then(function(response){ alert( response.headers.getAll() );});

fetch() не підтримує синхроного запиту, а лише асинхроний. Тому якщо Вам необхідний синхроний запит - використовуйте XMLHttpRequest.

Приклад:

fetch('/').then( function(a){ a.text().then( function(data){ alert(data); }); }); fetch('/').then( function(a){ return a.text(); }).then(function(text){ alert(text); }); Отримання результату формату JSON за допомогою fetch(): fetch('/dani/test.json').then(function(response){ response.json().then( function(e){alert(e.name);} ); });
    fetch('/ajax.php?act=test_users').then(function(res){ res.json().then(function(data){ var ul=document.getElementById('test'); for(var i=0;i<data.users.length;i++){ var li=document.createElement('li'); li.innerText=data.users[i].name; ul.appendChild(li); } }, function(e){alert(e);}); });

    Відправлення даних JSON методом POST за допомогою fetch():

    fetch('/ajax.php?act=test_post', { method:"POST", headers: { "Content-type": "application/x-www-form-urlencoded; charset=UTF-8" }, body:"name=test&id=3"} ).then(function(res){alert(res);}); var ob={name:"тест", id:2}; fetch('/ajax.php?act=test_post', { method: 'POST', headers: { 'Content-type': 'application/x-www-form-urlencoded' }, body: 'name='+ob.name+'&id='+ob.id } ).then( function(res){ //отримуємо результат json res.json().then(function(a){ alert( a.name ); }); }, function(er){ alert(er); });