Hi @reactj13, you will need to show the url you are trying to use here that gives you the error. Hide your private api key by replacing it with KEY or xxxxx or similar.

import axios from "axios";

const BASE_URL = "https://api.themoviedb.org/3"; const TMDB_TOKEN = "xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx" const headers = { Authorization: "bearer" + TMDB_TOKEN, };

export const fetchDataFromApi = async (url, params) => { try { const { data } = await axios.get(BASE_URL + url, { headers, params }) return data;

} catch (err) {
    console.log(err);
    return err;

}

}

and I m testing the api with my code import { useState, useEffect } from "react"; import { fetchDataFromApi } from "./utils/api";

function App() { useEffect(() => { apiTesting(); }, []); const apiTesting = () => { fetchDataFromApi("/movie/popular").then((res) => { console.log(res); }); }; return

export default App;

{"status_code":7,"status_message":"Invalid API key: You must be granted a valid key.","success":false}

I am not very familiar with javascript so I only may be able to provide limited support. Perhaps someone else will come along to provide more help.

I do believe from the error message that your authentication is incorrect. There are several things I can suggest you look at.

First, read this documentation on authentication. Note that you have two tokens, api key and bearer token. If you are using the authorization header then you -must- be using the bearer token and -not- the api key.

Second, the correct format of the header is "Authorization: Bearer xxxxxxxxxx". I see from your code that you are concating the header strings as '"bearer" + TMDB_TOKEN'. I don't believe that will leave the required space between the work 'bearer' and the token.

Also, I see that you have a trailing comma "," after the Authorization header setting, I'm not sure if that will cause any problems but I would remove it.