joywins25 / Challenge_SvelteKit

challenge_sveltekit for a strong fundamental to make my mvp
0 stars 0 forks source link

[solved] has anyone succeeded in using the API of 'Details' at the url : https://developer.themoviedb.org/reference/movie-details ? #1

Closed joywins25 closed 6 months ago

joywins25 commented 6 months ago

please note that I am following the tutorial on sveltekit using API at the url : https://youtu.be/ydR_M0fw9Xc?si=yG13rQwwo-C_qU7Z&t=2146 | SvelteKit For Beginners | Movie App Tutorial - YouTube | developedbyed

I like this tutorial and this movie API, so I am looking for how to use this API to complete the tutorial.

has anyone succeeded in using the API of 'Details' at the url : https://developer.themoviedb.org/reference/movie-details ?

an error 500, strict-origin-when-cross-origin at 'src/routes/movie/[id]/+page.svelte'

the web browser display '{data.title}' as 'undefined' at the path like 'http://localhost:5173/movie/787699'.

I changed to the variable name into 'data' in order to recheck but failed, too.

I concluded that any change has occurred in the movie api
because I tested an other example at the path of 'http://localhost:5173/stock/aapl' and it works well now.

Movie Detail

{data.title}


* file : src\routes\movie\[id]\+page.server.js

// URL : https://developer.themoviedb.org/reference/movie-details

import { MOVIE_API_KEY } from '$env/static/private'; import { error } from '@sveltejs/kit';

export async function load({fetch, params}){

console.log('params.id : ', params.id);

try {
    const url = `https://api.themoviedb.org/3/movie/${params.id}?language=en-US&api_key=${MOVIE_API_KEY}`;
    console.log('url : ', url);

    const res = await fetch(url);        
    const data = await res.json();
    console.log('data : ', data);

    if (res.ok) {
        console.log('okay...');
        return {
            props: { data },
        };
    } else {
        console.log('error...');
        throw new Error('Failed to fetch data');
    }
} catch (error) {
console.error('Error fetching data:', error);
// Handle the error here, potentially by displaying an error message to the user
}        

}

joywins25 commented 6 months ago