I am trying to fetch Users data using Context in react here is my code
import { createContext,useState } from "react"
const GithubContext = createContext()
const GITHUB_URL = process.env.REACT_APP_GITHUB_URL
const GITHUB_TOKEN = process.env.REACT_APP_GITHUB_TOKEN
export const GithubProvider = ({children}) => {
const [users,setUsers] = useState([])
const [loading,setLoading] = useState(true)
const fetchUsers = async () =>{
const response = await fetch(`${GITHUB_URL}/users`,{
headers:{
Authorization:`token ${GITHUB_TOKEN}`
}
})
const data = await response.json()
console.log(data)
}
return <GithubContext.Provider value = {{
users,
loading,
fetchUsers,
}}>
{children}
</GithubContext.Provider>
}
export default GithubContext
Here GITHUB_URL AND GITHUB_TOKEN are stored under .env file and they are correct And I am Using this context into my another function
import {useEffect,useContext} from 'react'
import GithubContext from "../../Context/Github/GithubContext"
function UserList(){
const {fetchUsers} = useContext(GithubContext)
useEffect (() =>{
fetchUsers()
},[])
return(
<div>
</div>
)
}
export default UserList
I was Expecting to get this response upon hitting the endpoint. This as my Json output but rather I am getting this error message which says bad credentials
When I test this token in POSTMAN It is giving accurate response, But in the React Application it is giving me error message.
{message: 'Bad credentials', documentation_url: 'https://docs.github.com/rest'}
documentation_url
:
"https://docs.github.com/rest"
message
:
"Bad credentials"