Javascript 自定义登录按钮未保存登录状态_Javascript_Google Signin_Google Api Js Client

Javascript 自定义登录按钮未保存登录状态

javascript

Javascript 自定义登录按钮未保存登录状态,javascript,google-signin,google-api-js-client,Javascript,Google Signin,Google Api Js Client,我使用了谷歌的预制，自定义谷歌登录按钮，但它不保存登录状态。它会说我已签名并在控制台中打印我的信息，没有任何问题，但一旦我重新加载页面，我将不再登录。有没有办法避免这种情况？我想自动登录，直到调用signOut（）到目前为止我的代码（很抱歉混乱）： var googleUser={}； var startApp=函数（）{ load（'auth2'，function（）{ //检索GoogleAuth库的单例并设置客户端。 auth2=gapi.auth2.init({ 客户端id:'260

我使用了谷歌的预制，自定义谷歌登录按钮，但它不保存登录状态。它会说我已签名并在控制台中打印我的信息，没有任何问题，但一旦我重新加载页面，我将不再登录。有没有办法避免这种情况？我想自动登录，直到调用

signOut（）

到目前为止我的代码（很抱歉混乱）：


var googleUser={}；
var startApp=函数（）{
load（'auth2'，function（）{
//检索GoogleAuth库的单例并设置客户端。
auth2=gapi.auth2.init({
客户端id:'260399017237-RD58MSBKIQ4JC8CR6PKQQ2JG1TG85MA.apps.googleusercontent.com'，
cookiepolicy:“单主机源”，
//除“配置文件”和“电子邮件”之外的请求范围
//范围：“附加范围”
});
attachSignin（document.getElementById（'googleBtn'）；
});
};
功能附加信号（元件）{
console.log（element.id）；
auth2.attachClickHandler（元素，{}，
功能（谷歌用户）{
document.getElementById（'name'）。innerText=“已登录：”+
googleUser.getBasicProfile（）.getName（）；
}，函数（错误）{
console.log（错误，未定义，2）；
});
}
#谷歌{
背景色：#00bff；
-webkit边界半径：100%；
-moz边界半径：100%；
边界半径：100%；
显示：内联块；
光标：指针；
颜色：#2D90DE；
高度：80px；
宽度：80px；
}
#谷歌btn：悬停{
背景色：#FFFFFF；
}
#谷歌btn:hover.fa谷歌{
背景：圆锥梯度（从-45度，#ea4335 110度，#4285f4 90度188度，#34a853 180度270度，#fbbc05 270度）73%55%/150%150%无重复；
-webkit背景剪辑：文本；
背景剪辑：文本；
颜色：透明；
-webkit文本填充颜色：透明；
}
谷歌公司{
颜色：#2D90DE；
}
startApp（）；

您可以将登录信息保存在cookie或本地存储器中。放置一个每次检查本地存储值的方法，并相应地添加重定向。我不知道应该存储什么信息。你必须在google响应中接收到一些令牌，你可以存储它。或者用户响应

<head>
  <link href="https://fonts.googleapis.com/css?family=Roboto" rel="stylesheet" type="text/css">
  <script src="https://apis.google.com/js/api:client.js"></script>
  <script src="https://kit.fontawesome.com/2ef8ddb166.js" crossorigin="anonymous" SameSite="Lax"></script>
  <script>
  var googleUser = {};
  var startApp = function() {
    gapi.load('auth2', function(){
      // Retrieve the singleton for the GoogleAuth library and set up the client.
      auth2 = gapi.auth2.init({
        client_id: '260399017237-rd58msbkiq4jc8cr6pkqqq2jg1tg85ma.apps.googleusercontent.com',
        cookiepolicy: 'single_host_origin',
        // Request scopes in addition to 'profile' and 'email'
        //scope: 'additional_scope'
      });
      attachSignin(document.getElementById('googleBtn'));
    });
  };

  function attachSignin(element) {
    console.log(element.id);
    auth2.attachClickHandler(element, {},
        function(googleUser) {
          document.getElementById('name').innerText = "Signed in: " +
              googleUser.getBasicProfile().getName();
        }, function(error) {
          console.log(error, undefined, 2);
        });
  }
  </script>
  <style type="text/css">

    #googleBtn {
    background-color: #00BFFF;
    -webkit-border-radius: 100%;
    -moz-border-radius: 100%;
    border-radius: 100%;
    display: inline-block;
    cursor: pointer;
    color: #2D90DE;
    height: 80px;
    width: 80px;
}


#googleBtn:hover{
    background-color: #FFFFFF;
}

#googleBtn:hover .fa-google{
    background: conic-gradient(from -45deg, #ea4335 110deg, #4285f4 90deg 188deg, #34a853 180deg 270deg, #fbbc05 270deg) 73% 55%/150% 150% no-repeat;
    -webkit-background-clip: text;
    background-clip: text;
    color: transparent;
    -webkit-text-fill-color: transparent;
}

.fa-google {
  color: #2D90DE;
}
  </style>
  </head>
  <body>
  <a id="googleBtn"><i class="fa fa-google fa-4x" style="padding-top: 8px;" aria-hidden="true"></i></a>
  <div id="name"></div>
  <script>startApp();</script>
</body>
</html>