GoogleでOAuth2フローを学習しています（https://developers.google.com/identity/protocols/oauth2/javascript-implicit-flow#oauth-2.0-endpoints）。GoogleのJSクライアントライブラリを使用していません。GoogleがリダイレクトURLにハッシュ値を返すステップで、次のようになります。
http://localhost:3000/profile#access_token=ya29.A0AfH6SMCKcSSl4-KfeV7oioFYN_LHpJ9Z_cnpY5yHCK4d8U1TdaZ-TXU05XfzNZsmfNA1Csla-f8U3k4Jp9uYzCzmkIJf1qs5k_hle5ArwBm462_TPfuTtn5bbnN-hD5Bn7m9TEpxF3vmez81IU-AgNHhMwgr&token_type=Bearer&expires_in=3599&scope=profile%20https://www.googleapis.com/auth/userinfo.profile
access_tokenのようなハッシュ値から値を取得するにはどうすればよいですか？私がこれまでに持っているのは、＃なしでハッシュ値を取得するこれです：
import React, { useEffect } from 'react';
const Profile = () => {
useEffect(() => {
if (window.location.hash) {
console.log(window.location.hash.substr(1));
} else {
console.log('no hash');
}
});
return (
<div>
<h1>Profile page</h1>
</div>
);
};
export default Profile;
PS：私はNextJSを使用しています
URLSearchParamsこれを簡単にするために使用できます。
const urlParams = new URLSearchParams(window.location.hash.substr(1))
次のようaccess_tokenな値にアクセスできます。
urlParams.get('access_token')
この記事はインターネットから収集されたものであり、転載の際にはソースを示してください。
侵害の場合は、連絡してください[email protected]
コメントを追加