دعم الموقع

Bonjour, Je m’entraîne à utiliser l'API de movie DB dans le cadre de mes études. Mais j'ai un problème d’accès :

Access to XMLHttpRequest at 'https://www.themoviedb.org/discover/movie?language=fr&sort_by=popularity.desc&include_adult=false&append_to_response=images&(api_key)' from origin 'http://localhost:8080' has been blocked by CORS policy: No 'Access-Control-Allow-Origin' header is present on the requested resource. 

Il semblerait que je sois bloqué par CORS policy, je ne comprends pas trop d'où vient le problème.

Voici une partie de mon code :

const API_URL = "https://www.themoviedb.org/discover/movie?language=fr&sort_by=popularity.desc&include_adult=false&append_to_response=images&(key_api)";

class App extends Component {
    constructor(props) {
        super(props)
        this.state = {}
    }

    componentWillMount() {
       axios.get(`${API_URL}`).then(function(response){
        console.log("-------------------");
        console.log('', response);
        console.log("-------------------");
    });
        //        ${POPULAR_MOVIES_URL}&${API_KEY}
    }

Alors que quand je met cet url :

const test = "https://api.themoviedb.org/3/movie/76341?api_key=(api_key)"

cela marche, et je n'ai pas ce genre d'erreur :/

Quelqu'un peut-il m'aider à comprendre ? Je vous remercie, bonne journée.

4 ردود (على هذه الصفحة 1 من 1)

Jump to last post

Finalement, j'ai résolu le problème. J'ai juste eu à télécharger l'extension sur chrome "Moesif Orign & CORS Changer".

Happy to hear you sorted it out.

Cheers.

Wait but why? :)

This chrome extension you mention probably adds some request headers like "Allow-Control-Allow-Origin": "*", which I added manually to my request code, but I cannot still fetch. Though my app is able to do preflight request as I inspect.

The url for my above requests is http://api.themoviedb.org/3/discover/movie?sort_by=vote_average.desc&api_key=XXXXXXXXXXXXXXXXXX
(same for https://api.themoviedb.org/3/discover/movie?sort_by=vote_average.desc&api_key=XXXXXXXXXXXXXXXXXX)

I can successfully get the data when I try in a new tab.

However I have no problem fetching for example the movie owner of the question wrote in my app without any additional thing, header etc. :
http://api.themoviedb.org/3/movie/76341?api_key=XXXXXXXXXXXXXXXXXX

my code is as follows:

async function getData() {
        let response = await fetch("https://api.themoviedb.org/3/movie/76341?api_key=xxxxxxxxxxxxxxxx");
        let json = await response.json();
        setMovies(json.results);
    }

@fselcukcan Are you having an issue? I can't quite tell if you need help or not. If so, give me some more info as to what is failing.

Cheers.

لم تجد الفلم أو المسلسل ؟ سجل دخولك و انشئها

عام

s ركز شريط البحث
p افتح قائمة الملف الشخصي
esc اغلق النافذة المفتوحة
? افتح نافذة اختصارات لوحة المفاتيح

على كافة صفحات الوسائط

b ارجع للخلف (او للصفحة الام عند التطبيق)
e انتقل لصفحة التعديل

على كافة صفحات موسم المسلسل

(السهم الايمن) انتقل للموسم التالي
(السهم الايسر) انتقل للموسم السابق

على كافة صفحات حلقة المسلسل

(السهم الايمن) انتقل للحلقة التالية
(السهم الايسر) انتقل للحلقة السابقة

على كافة صفحات الصور

a افتح صفحة اضافة الصورة

على كافة صفحات التعديل

t افتح محدد الترجمة
ctrl+ s ارسال النموذج

على صفحات المناقشة

n انشى نقاش جديد
w تبديل حالة المتابعة
p تبديل عام / خاص
c تبديل اغلاق / فتح
a افتح الانشطة
r رد على النقاش
l انتقل لأخر رد
ctrl+ enter أرسل رسالتك
(السهم الايمن) الصفحة التالية
(السهم الايسر) الصفحة السابقة

الاعدادات

هل تريد تقييم او اضافة هذا العنصر للقائمة؟

تسجيل الدخول