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.
The 404 status code means your authentication data are not the good ones.
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>
The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.