RapidAPI request failed 401

Question

import axios from "axios";

const URL = 'https://youtube-v31.p.rapidapi.com';

const options = {
    params: {
      maxResults: 50,
    },
    headers: {
      'X-RapidAPI-Key': process.env.REACT_APP_RAPID_API_KEY,
      'X-RapidAPI-Host': 'youtube-v31.p.rapidapi.com'
    }
  };

export const fetchAPI = async (url) => {
  const {data}= await axios.get(`${URL}/${url}`, options);
  return data
};

// Another component
useEffect(() => {
    fetchAPI(`search?part=snippet&q=${selectedCategory}`).then((data) =>
      setVideos(data.items)
    );
  }, [selectedCategory]);

error message :

Request failed with status code 401
AxiosError: Request failed with status code 401
    at settle (http://localhost:3000/static/js/bundle.js:63376:12)
    at XMLHttpRequest.onloadend (http://localhost:3000/static/js/bundle.js:62076:66)

console error:

xhr.js:251 
 GET https://youtube-v31.p.rapidapi.com/search?part=snippet&q=New&maxResults=50 401
settle.js:19 Uncaught (in promise) 
AxiosError {message: 'Request failed with status code 401', name: 'AxiosError', code: 'ERR_BAD_REQUEST', config: {…}, request: XMLHttpRequest, …}
code
: 
"ERR_BAD_REQUEST"
config
: 
{transitional: {…}, adapter: Array(2), transformRequest: Array(1), transformResponse: Array(1), timeout: 0, …}
message
: 
"Request failed with status code 401"
name
: 
"AxiosError"
request
: 
XMLHttpRequest {onreadystatechange: null, readyState: 4, timeout: 0, withCredentials: false, upload: XMLHttpRequestUpload, …}
response
: 
{data: {…}, status: 401, statusText: '', headers: AxiosHeaders, config: {…}, …}
stack
: 
"AxiosError: Request failed with status code 401\n    at settle (http://localhost:3000/static/js/bundle.js:63376:12)\n    at XMLHttpRequest.onloadend (http://localhost:3000/static/js/bundle.js:62076:66)"
[[Prototype]]
: 
Error

RapidAPI request failed 401

0 Answers0