Giriş

Axios, asenkron HTTP istekleri (örneğin, POST, GET, ve DELETE) REST uç noktalarına, özellikle API'lere.

Bu yazıda, Axios ile POST JSON isteklerinin nasıl gönderileceğini ve hem önceden serileştirilmiş hem de serileştirilmemiş verilerin nasıl ele alınacağını öğreneceğiz.

Axios Kullanarak POST JSON İstekleri Nasıl Gönderilir

POST isteği için kullanılır veri gönder bir son noktaya. Örneğin kullanıcıların bilgilerini ilettikleri bir kayıt sayfamız varsa bu bilgiler bir POST JSON isteği kullanılarak belirttiğimiz uç noktaya JSON olarak gönderilebilir.

Biz kullanın axios.post() Axios ile iki ana parametre alan bir POST isteği gönderme yöntemi – bitiş noktasının URL'si (url) ve göndermek istediğimiz verileri temsil eden nesne (data):

axios.post(url[, data[, config]])

Bu iki parametrenin yanı sıra üçüncü bir parametre daha var – config. Gönderdiğimiz POST isteğini yapılandırmak için, özellikle üstbilgileri ayarlamak için kullanılır.

Serileştirilmemiş Veri Gönderme

Axios'un varsayılan olarak veri gönderimi için JSON kullandığını not etmek önemlidir, yani Axios'a aktardığımız herhangi bir nesne, nesneyi otomatik olarak JSON'a serileştirir ve Content-Type başlık application/json. Bunu örnekte açıklayalım – nesneyi yayınladığımızı varsayalım { name: 'John Doe' }:

const result = await axios.post('https://testapi.org/post', { name: 'John Doe' });

Axios, nesneyi otomatik olarak JSON biçiminde seri hale getirecektir:

console.log(result.data.data);

Ve dediğimiz gibi, bizim de Content-Type başlık application/json:

console.log(result.data.headers['Content-Type']);

Serileştirilmiş JSON Dizesi Gönderme

Şimdiye kadar, Axios'un gönderdiğimiz verileri otomatik olarak seri hale getireceğini gördük, ancak bu durumda, ikinci parametre olarak serileştirilmiş bir JSON dizesi göndereceğiz. axios.post() yöntem:

const usersName = JSON.stringify({ name: 'John Doe' });

Axios, içerik türü başlığını şu şekilde ayarlamak yerine, bu verileri form kodlu bir istek gövdesi olarak ele alacaktır. application/json, Aşağıda gösterildiği gibi:

const usersName = JSON.stringify({ name: 'John Doe' });
const result = await axios.post('https://testapi.org/post', usersName);

console.log(result.data.headers['Content-Type']);

Bu sorunu çözmek için, açıkça ayarlamamız gerekir. Content-Type başlık application/json. Bunu geçerek yapabiliriz config çağrılırken argüman axios.post() yöntem:

const usersName = JSON.stringify({ name: 'John Doe' });
customConfig = {
    headers: {
    'Content-Type': 'application/json'
    }
};
const result = await axios.post('https://testapi.org/post', usersName, customConfig);

console.log(result.data.data);
console.log(result.data.headers['Content-Type']);

Sonuç

Bu yazımızda, bu verilerin seri hale getirilebileceğini veya serileştirilmeyebileceğini tam olarak bilerek Axios ile POST JSON isteklerinin nasıl gönderileceğini öğrendik ve her iki senaryoyu da ele aldık.