草庐IT

javascript - 无法读取 null 的属性 'style' - Google 登录按钮

coder 2024-05-10 原文

我正在尝试为我的网站实现 Google 登录。登录按钮会正确显示,并且最初会成功登录。当我在使用该网站后注销并尝试移至登录页面时,我的问题就出现了(我使用的是 React,所以都是一页)。我使用完全相同的函数来呈现登录页面,但它给了我一个“cb=gapi.loaded_0:249 Uncaught TypeError: Cannot read property 'style' of null”。 gapi的错误就出现在这里(至少我是这么认为的):

 a.El;window.document.getElementById((c?"not_signed_in":"connected"

这是我最初添加要呈现的登录按钮的方式:

elements.push(h('div.g-signin2',{'data-onsuccess': 'onSignIn'}))
        return h('div.page_content',elements)

我稍后使用 ReactDOM.render 调用进行渲染。

这是我处理注销和登录的方式:

function signOut() {
    var auth2 = gapi.auth2.getAuthInstance();
    auth2.signOut().then(function () {
      // console.log('User signed out.');
      signedin = false;
      auth2 = null;
      renderPage()
    });
  }

var google_idtoken;
var signedin = false;

// set auth2 to null to indicate that google api hasn't been loaded yet
var auth2 = null;

function onSignIn(googleUser) {
    auth2 = gapi.auth2.getAuthInstance({
        client_id: 'ClientID.apps.googleusercontent.com'
    });
    google_idtoken = googleUser.getAuthResponse().id_token;
    wrongemail = true;
  // if(auth2 != null && auth2.isSignedIn.get() == true){

    if ((((auth2.currentUser.get()).getBasicProfile()).getEmail()).split("@").pop() == 'domain.com'){
        signedin = true
        wrongemail = false
    }
    updateSources()
    // renderPage()
}

最佳答案

我遇到了类似的问题,但我不确定它是否与您的问题完全相关。我在 html 中添加了按钮:

<div id="gdbtn" class="g-signin2" data-onsuccess="onSignIn"></div>

但我想根据 Google 的说明自定义按钮的呈现,所以我将平台脚本添加为:

<script src="https://apis.google.com/js/platform.js?onload=renderGDriveButton"></script>

具有以下onload函数:

function renderGDriveButton() {
  gapi.signin2.render('gdbtn', { 
    'height': 50
  });
}

我遇到了与您相同的错误:“未捕获的类型错误:无法读取 null 的属性‘style’”。我的问题是我包含了属性:class="g-signin2"data-onsuccess="onSignIn"一旦我取出这些属性并将按钮添加为:

<div id="gdbtn"></div>

然后错误消失了。似乎与您的问题非常相似。您可以尝试通过 onload 函数添加按钮。只是一个想法。您可以在以下位置查看文档:https://developers.google.com/identity/sign-in/web/build-button

关于javascript - 无法读取 null 的属性 'style' - Google 登录按钮,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/37472453/

有关javascript - 无法读取 null 的属性 'style' - Google 登录按钮的更多相关文章

  1. ruby-on-rails - rails : "missing partial" when calling 'render' in RSpec test - 2

    我正在尝试测试是否存在表单。我是Rails新手。我的new.html.erb_spec.rb文件的内容是:require'spec_helper'describe"messages/new.html.erb"doit"shouldrendertheform"dorender'/messages/new.html.erb'reponse.shouldhave_form_putting_to(@message)with_submit_buttonendendView本身,new.html.erb,有代码:当我运行rspec时,它失败了:1)messages/new.html.erbshou

  2. ruby-on-rails - 由于 "wkhtmltopdf",PDFKIT 显然无法正常工作 - 2

    我在从html页面生成PDF时遇到问题。我正在使用PDFkit。在安装它的过程中,我注意到我需要wkhtmltopdf。所以我也安装了它。我做了PDFkit的文档所说的一切......现在我在尝试加载PDF时遇到了这个错误。这里是错误:commandfailed:"/usr/local/bin/wkhtmltopdf""--margin-right""0.75in""--page-size""Letter""--margin-top""0.75in""--margin-bottom""0.75in""--encoding""UTF-8""--margin-left""0.75in""-

  3. ruby-on-rails - 'compass watch' 是如何工作的/它是如何与 rails 一起使用的 - 2

    我在我的项目目录中完成了compasscreate.和compassinitrails。几个问题:我已将我的.sass文件放在public/stylesheets中。这是放置它们的正确位置吗?当我运行compasswatch时,它不会自动编译这些.sass文件。我必须手动指定文件:compasswatchpublic/stylesheets/myfile.sass等。如何让它自动运行?文件ie.css、print.css和screen.css已放在stylesheets/compiled。如何在编译后不让它们重新出现的情况下删除它们?我自己编译的.sass文件编译成compiled/t

  4. ruby - 如何将脚本文件的末尾读取为数据文件(Perl 或任何其他语言) - 2

    我正在寻找执行以下操作的正确语法(在Perl、Shell或Ruby中):#variabletoaccessthedatalinesappendedasafileEND_OF_SCRIPT_MARKERrawdatastartshereanditcontinues. 最佳答案 Perl用__DATA__做这个:#!/usr/bin/perlusestrict;usewarnings;while(){print;}__DATA__Texttoprintgoeshere 关于ruby-如何将脚

  5. ruby-on-rails - 如果为空或不验证数值,则使属性默认为 0 - 2

    我希望我的UserPrice模型的属性在它们为空或不验证数值时默认为0。这些属性是tax_rate、shipping_cost和price。classCreateUserPrices8,:scale=>2t.decimal:tax_rate,:precision=>8,:scale=>2t.decimal:shipping_cost,:precision=>8,:scale=>2endendend起初,我将所有3列的:default=>0放在表格中,但我不想要这样,因为它已经填充了字段,我想使用占位符。这是我的UserPrice模型:classUserPrice回答before_val

  6. ruby-on-rails - 无法使用 Rails 3.2 创建插件? - 2

    我对最新版本的Rails有疑问。我创建了一个新应用程序(railsnewMyProject),但我没有脚本/生成,只有脚本/rails,当我输入ruby./script/railsgeneratepluginmy_plugin"Couldnotfindgeneratorplugin.".你知道如何生成插件模板吗?没有这个命令可以创建插件吗?PS:我正在使用Rails3.2.1和ruby​​1.8.7[universal-darwin11.0] 最佳答案 随着Rails3.2.0的发布,插件生成器已经被移除。查看变更日志here.现在

  7. ruby-on-rails - Rails 3.2.1 中 ActionMailer 中的未定义方法 'default_content_type=' - 2

    我在我的项目中添加了一个系统来重置用户密码并通过电子邮件将密码发送给他,以防他忘记密码。昨天它运行良好(当我实现它时)。当我今天尝试启动服务器时,出现以下错误。=>BootingWEBrick=>Rails3.2.1applicationstartingindevelopmentonhttp://0.0.0.0:3000=>Callwith-dtodetach=>Ctrl-CtoshutdownserverExiting/Users/vinayshenoy/.rvm/gems/ruby-1.9.3-p0/gems/actionmailer-3.2.1/lib/action_mailer

  8. ruby-on-rails - 在混合/模块中覆盖模型的属性访问器 - 2

    我有一个包含模块的模型。我想在模块中覆盖模型的访问器方法。例如:classBlah这显然行不通。有什么想法可以实现吗? 最佳答案 您的代码看起来是正确的。我们正在毫无困难地使用这个确切的模式。如果我没记错的话,Rails使用#method_missing作为属性setter,因此您的模块将优先,阻止ActiveRecord的setter。如果您正在使用ActiveSupport::Concern(参见thisblogpost),那么您的实例方法需要进入一个特殊的模块:classBlah

  9. ruby - 无法运行 Rails 2.x 应用程序 - 2

    我尝试运行2.x应用程序。我使用rvm并为此应用程序设置其他版本的ruby​​:$rvmuseree-1.8.7-head我尝试运行服务器,然后出现很多错误:$script/serverNOTE:Gem.source_indexisdeprecated,useSpecification.Itwillberemovedonorafter2011-11-01.Gem.source_indexcalledfrom/Users/serg/rails_projects_terminal/work_proj/spohelp/config/../vendor/rails/railties/lib/r

  10. ruby - 在 jRuby 中使用 'fork' 生成进程的替代方案? - 2

    在MRIRuby中我可以这样做:deftransferinternal_server=self.init_serverpid=forkdointernal_server.runend#Maketheserverprocessrunindependently.Process.detach(pid)internal_client=self.init_client#Dootherstuffwithconnectingtointernal_server...internal_client.post('somedata')ensure#KillserverProcess.kill('KILL',

随机推荐