ReactJS- Youtube Data API request error 400

Question

I was using YouTube Data API. I did set up the parameters but when opening network from developer tools it is showing error: 'Required parameter:part'

axios code-

import axios from 'axios';

const KEY='[my key]'

export default axios.create({
    baseURL:'https://www.googleapis.com/youtube/v3',
    params:
    {
        part:'snippet',
        maxResults:5,
        key: KEY
    }
})

The callback function which is sending API request

termSearch= (term)=>
    {   
        console.log(term)
        youtube.get('/search',{
            params:
            {
                q:term
            }
        })

I expected to receive the JSON response but console is showing- Error:GET https://www.googleapis.com/youtube/v3/search?q=asdas 400

score 6 · Accepted Answer · answered Jun 28 '19 at 20:24

Looks like there is an open issue on Axios where request parameters are not getting merged with instance parameters. So your params object from your axios.create(...) are not being used properly in your callback.

Maybe you could try downgrading Axios to version: 0.18.1 until a fix has been patched in? This seems to be the workaround used by others at this particular instance in time.

Hopefully that helps!

score 0 · Answer 2 · edited Jan 19 '21 at 20:02

In call back function before q parameter add all the parameter of Param code from Axios code, your call back function should be like:

termSearch= (term)=>
    {   
        console.log(term)
        youtube.get('/search',{
            params:
            {
             part:'snippet',
        maxResults:5,
        key: 'your_Api_KEY'
                q:term
            }
        })

and don't change your Axios code. It should be like this

import axios from 'axios';
const KEY='[my key]'
export default axios.create({
        baseURL:'https://www.googleapis.com/youtube/v3',
        params:
        {
            part:'snippet',
            maxResults:5,
            key: KEY
        }
    })

ReactJS- Youtube Data API request error 400

2 Answers2