• Najnowsze pytania
  • Bez odpowiedzi
  • Zadaj pytanie
  • Kategorie
  • Tagi
  • Zdobyte punkty
  • Ekipa ninja
  • IRC
  • FAQ
  • Regulamin
  • Książki warte uwagi

Javascript Api Cors error

Aruba Cloud - Virtual Private Server VPS
0 głosów
213 wizyt
pytanie zadane 7 stycznia 2020 w JavaScript przez saseta00 Użytkownik (700 p.)
edycja 7 stycznia 2020 przez saseta00

Hejka. piszę w celach edukacyjnych stronkę z informacjami odnośnie kryptowalut.
Korzystam z API od cryptocompare do którego łączę się za pomocą fetch/await do adresu url na którego końcu jest mój access key choć bez tez działa.  Postanowiłem prócz cen pobierać również inne dane, poniżej link do nich:
https://min-api.cryptocompare.com/data/news/feeds
gdzie według dokumentacji powinienem dodać na końcu url &api_key=mójapikey  jednak wtedy mi nie działa a na sucho tak.  

W czym problem? 
Google chrome na komputerze/telefonie odbiera wszystkie dane bez problemu, jednak zauważyłem że Opera jeśli chodzi o pobranie właśnie tych danych z linku wyżej (gdzie pobieram z tego api trochę więcej)  wywala błąd w konsoli odnośnie CORS'ów. Wywala ten błąd jeśli odczytuję stronę z servera (wrzuciłem na cba)  a lokalnie jeśli otwieram z komputera to wszystko działa.
 

Access to fetch at 'https://min-api.cryptocompare.com/data/news/feeds' from origin has been blocked by CORS policy: The 'Access-Control-Allow-Origin' header has a value 'null' that is not equal to the supplied origin. Have the server send the header with a valid value, or, if an opaque response serves your needs, set the request's mode to 'no-cors' to fetch the resource with CORS disabled.

Nie wyświetla tego jednego segmentu strony który wykorzystuje te dane. 
Nie rozumiem tego dlaczego lokalnie nie ma Opera problemu z corsami i dlaczego chrome nie ma w ogóle a Opera po wrzuceniu na server ma i tylko na tym kanale, gdzie korzystam z innych i działają ale na prawdę mało się na tym znam, ale starałem się znaleźć odpowiedź. 

Info z dokumentacji:

Rozpisuję się ale głównie chodzi mi o jedną rzecz, ponieważ wystarczy pewnie dodać mój klucz do 'headersów' skoro w url nie można go dodać, tylko że to jedyne co potrafiłem znaleźć w internecie i nie wiem jak to jeśli chodzi o javascript. Poniżej wrzucam przykładowy mój kod z połączenie, gdzie i w jakiej formie tutaj mogę to zrobić?

async function news_feeds() {
const response = await fetch('https://min-api.cryptocompare.com/data/news/feeds');
const logi = await response.json();
console.log(logi);
    



 

1 odpowiedź

+1 głos
odpowiedź 7 stycznia 2020 przez Paweł Nąckiewicz Nałogowiec (48,990 p.)

W dokumentacji masz fajny przykład jak dokładać hedersy do zapytań.

komentarz 7 stycznia 2020 przez saseta00 Użytkownik (700 p.)

Dziękuje za pomoc, jednak zaglądam tam już po raz n'ty i chyba moja wiedza na temat javascripta pozwala mi tylko się tam jeszcze bardziej zagubić, choć staram się. 

Nie wiem jak pokryć informację z dokumentacji mojego api:

API KEY in HEADER - add the following header to your request: authorization: Apikey {your_api_key}.

z tym wykorzystaniem headers w dokumentacji mozilli 

myHeaders.append('Content-Type', 'text/plain');

I moim kodem, w którym chodzi tylko o wysyłanie poprzez getelement wartości do ID z htmla

async function news_feeds() {
const response = await fetch('https://min-api.cryptocompare.com/data/news/feeds');
const logi = await response.json();
console.log(logi);
    
//     zródła artykułów
document.getElementById("feed0").textContent = logi[0].name;
document.getElementById("feed1").textContent = logi[1].name;
document.getElementById("feed2").textContent = logi[2].name;

news_feeds();

Proszę o jeszcze jakaś wskazówkę 

komentarz 8 stycznia 2020 przez Paweł Nąckiewicz Nałogowiec (48,990 p.)
async function postData(url = '', data = {}) {
  // Default options are marked with *
  const response = await fetch(url, {
    method: 'POST', // *GET, POST, PUT, DELETE, etc.
    mode: 'cors', // no-cors, *cors, same-origin
    cache: 'no-cache', // *default, no-cache, reload, force-cache, only-if-cached
    credentials: 'same-origin', // include, *same-origin, omit
    headers: {
      'Content-Type': 'application/json'
      // 'Content-Type': 'application/x-www-form-urlencoded',
    },
    redirect: 'follow', // manual, *follow, error
    referrerPolicy: 'no-referrer', // no-referrer, *client
    body: JSON.stringify(data) // body data type must match "Content-Type" header
  });
  return await response.json(); // parses JSON response into native JavaScript objects
}

 

Podobne pytania

+1 głos
0 odpowiedzi 587 wizyt
pytanie zadane 29 kwietnia 2020 w JavaScript przez Rafixstan. Obywatel (1,070 p.)
0 głosów
1 odpowiedź 271 wizyt
pytanie zadane 8 sierpnia 2019 w PHP przez kordix Gaduła (3,910 p.)

93,332 zapytań

142,325 odpowiedzi

322,400 komentarzy

62,669 pasjonatów

Motyw:

Akcja Pajacyk

Pajacyk od wielu lat dożywia dzieci. Pomóż klikając w zielony brzuszek na stronie. Dziękujemy! ♡

Oto polecana książka warta uwagi.
Pełną listę książek znajdziesz tutaj

Wprowadzenie do ITsec, tom 1 Wprowadzenie do ITsec, tom 2

Można już zamawiać dwa tomy książek o ITsec pt. "Wprowadzenie do bezpieczeństwa IT" - mamy dla Was kod: pasja (użyjcie go w koszyku), dzięki któremu uzyskamy aż 15% zniżki! Dziękujemy ekipie Sekuraka za fajny rabat dla naszej Społeczności!

...