qiitacli/index.html

   1 <!DOCTYPE html>
   2 <html lang="ja">
   3 <head>
   4     <meta charset="UTF-8">
   5     <title>認証成功</title>
   6 </head>
   7 <body>
   8     <header>
   9         <h1>Qiita OAuth 認証成功画面</h1>
  10     </header>
  11     <main>
  12         <p>認証に成功しました。</p>
  13         <p>以下の文字列をターミナルに貼り付けてください。</p>
  14         <div>
  15             <p>Access Token <button onclick="TokenCopy()">コピー</button></p>
  16             <p><input type="text" name="token" id="token_box" readonly></p>
  17         </div>
  18         <div>
  19             <p>State <button onclick="StateCopy()">コピー</button></p>
  20             <p><input type="text" name="state" id="state_box" readonly></p>
  21         </div>
  22     </main>
  23     <script>
  24         // GETパラメータからrとeの値をそれぞれ取得する
  25         const GetParams = () => {
  26             let ParamsArray = {
  27                 state: undefined,
  28                 token: undefined,
  29             };
  30             let searchParams = new URLSearchParams(document.location.search.substring(1));
  31             ParamsArray["token"] = searchParams.get("code")
  32             ParamsArray["state"] = searchParams.get("state")
  33             return ParamsArray;
  34         }
  35
  36         window.addEventListener("load", ()=>{
  37             document.getElementById("token_box").value = GetParams()["token"]
  38             document.getElementById('state_box').value = GetParams()["state"]
  39         })
  40
  41         // コピーボタン
  42         const CopyToClipBoard = (e) => {
  43             e.select();
  44             document.execCommand("copy");
  45         }
  46
  47         const TokenCopy = () => { CopyToClipBoard(document.getElementById("token_box")); }
  48         const StateCopy = () => { CopyToClipBoard(document.getElementById("state_box")); }
  49     </script>
  50 </body>
  51 </html>