0
329
VistasGetting 401 Unauthorized error while requasting GitHub API
Good evening. My task is to create a website with react that will list through github users. I was following this instruction: https://docs.github.com/en/rest/users/users#get-a-user (for JS). My credentials:
async function searchUsers() {
try {
const octokit = new Octokit({
auth: 'ghp_MY_PERSONAL_TOKEN',
acceptstring: 'application/vnd.github.v3+json'
})
const response = await octokit.request(`GET /users/${name}`, {
username: 'maria98kgm'
});
setUsers(response.data);
setLoading(false);
searchRepos();
}
catch(e) {
setLoading(false);
setUsers('notFound');
console.error('no such a user');
}
}
Whenever i use it too long or push changes to github, it stops working and gives me 401 Unauthorized error:
I cannot solve it for two days already, please help.
·
Juan Pablo Isaza
2 Respuestas
Responde la pregunta0
Explanation of the error.
The 404 status code means your authentication data are not the good ones.
How to solve it.
- First, check your GitHub personal token is ok (i am guessing it is)
- Second, do the following : https://docs.github.com/en/developers/apps/building-github-apps/identifying-and-authorizing-users-for-github-apps
·
Juan Pablo Isaza
Denunciar
0
You don't need any authentication for that endpoint. Here's a working example:
body { font-family: sans-serif; }
button, input[type="text"] { font-size: 1rem; padding: 0.2rem; }
pre { font-family: monospace; font-size: 1rem; }
.vertical { display: flex; flex-direction: column; align-items: flex-start; gap: 0.5rem; }<!-- Babel seemed to have trouble with this, so I'm putting it on window -->
<script type="module">
import {Octokit} from 'https://cdn.skypack.dev/octokit@1.7.1';
window.Octokit = Octokit;
</script>
<div id="root"></div><script src="https://unpkg.com/react@18.1.0/umd/react.development.js"></script><script src="https://unpkg.com/react-dom@18.1.0/umd/react-dom.development.js"></script><script src="https://unpkg.com/@babel/standalone@7.18.1/babel.min.js"></script>
<script type="text/babel" data-type="module" data-presets="env,react">
// import * as ReactDOM from 'react-dom/client';
// import {useState} from 'react';
// import {Octokit} from 'octokit';
// This Stack Overflow snippet demo uses UMD modules instead of the commented import statments above
const {useState} = React;
const octokit = new Octokit();
function App () {
const [user, setUser] = useState('maria98kgm');
const [userData, setUserData] = useState(undefined);
const [error, setError] = useState(undefined);
const updateUserData = async () => {
try {
const username = user.trim();
const response = await octokit.request(`GET /users/${username}`);
setUserData(response.data);
setError(undefined);
}
catch (ex) {
if (ex instanceof Error) setError(ex);
else console.error(ex);
}
};
const displayString = error
? error.toString()
: userData
? JSON.stringify(userData, null, 2)
: 'No data yet';
return (
<div>
<div className="vertical">
<input
type="text"
onChange={ev => setUser(ev.target.value)}
value={user}
/>
<button onClick={updateUserData}>Update user data</button>
</div>
<pre><code>{displayString}</code></pre>
</div>
);
}
const reactRoot = ReactDOM.createRoot(document.getElementById('root'));
reactRoot.render(<App />);
</script>
·
Juan Pablo Isaza
Denunciar
Responde la pregunta