@Mdmitr

Как правильно добавить токен в Fetch Api?

Доброе утро, как правильно добавить токен чтобы работало? токен тестовый
такой код не работает
const token = '321d6a221f8926b5ec41ae89a3b2ae7b';
fetch(`http://api.travelpayouts.com/v2/prices/latest`, 
	{
		headers : {'x-access-token': '321d6a221f8926b5ec41ae89a3b2ae7b'}})
  .then(res => res.json())
  .then(data => console.log(data))


в примере на php работает
<?php

$curl = curl_init();

curl_setopt_array($curl, array(
  CURLOPT_URL => "http://api.travelpayouts.com/v2/prices/latest",
  CURLOPT_RETURNTRANSFER => true,
  CURLOPT_ENCODING => "",
  CURLOPT_MAXREDIRS => 10,
  CURLOPT_TIMEOUT => 30,
  CURLOPT_HTTP_VERSION => CURL_HTTP_VERSION_1_1,
  CURLOPT_CUSTOMREQUEST => "GET",
  CURLOPT_HTTPHEADER => array(
    "x-access-token: 321d6a221f8926b5ec41ae89a3b2ae7b"
  ),
));

$response = curl_exec($curl);
$err = curl_error($curl);

curl_close($curl);

if ($err) {
  echo "cURL Error #:" . $err;
} else {
  echo $response;
}
  • Вопрос задан
  • 1450 просмотров
Решения вопроса 1
sergiks
@sergiks Куратор тега JavaScript
♬♬
Документация по fetch и Headers

Рабочий код в браузере требует same origin
const token = 'xxxxxx';
var myHeaders = new Headers();
myHeaders.append('x-access-token', token);

var myInit = { method: 'GET',
               headers: myHeaders,
               mode: 'cors',
               cache: 'default' };

var myRequest = new Request('http://api.travelpayouts.com/v2/prices/latest', myInit);

fetch(myRequest)
  .then(res => res.json())
  .then(data => console.log(data))
Но в вашем случае ничего не получится из-за требования Same Origin: через JS в браузере что-то загружать с того сайта можно только страницам, загруженным с него же. Гуглите CORS. Или работайте через nodejs.

Рабочий код под nodejs
const http = require("http");

const token = '321d6a221f8926b5ec41ae89a3b2ae7b';
const url = 'http://api.travelpayouts.com/v2/prices/latest';

http.get(
  url,
  {
      headers: {
      'x-access-token': token
      }
  },
  (res) => {
    const { statusCode } = res;
    const contentType = res.headers['content-type'];
  
    let error;
    if (statusCode !== 200) {
      error = new Error('Request Failed.\n' +
                        `Status Code: ${statusCode}`);
    } else if (!/^application\/json/.test(contentType)) {
      error = new Error('Invalid content-type.\n' +
                        `Expected application/json but received ${contentType}`);
    }
    if (error) {
      console.error(error.message);
      // Consume response data to free up memory
      res.resume();
      return;
    }
  
    res.setEncoding('utf8');
    let rawData = '';
    res.on('data', (chunk) => { rawData += chunk; });
    res.on('end', () => {
      try {
        console.log("raw data:", rawData);
        
        const parsedData = JSON.parse(rawData);
        console.log(parsedData);
      } catch (e) {
        console.error(e.message);
      }
    });
  }
  
).on('error', (e) => {
  console.error(`Got error: ${e.message}`);
});
Ответ написан
Пригласить эксперта
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Войти через центр авторизации
Похожие вопросы