1

我有一个使用 Google 登录的页面。它大部分时间都运行良好;然而,有时我没有收到代码中定义的“240 像素宽的深色主题按钮”,而是收到一个白色的小按钮,上面写着“登录”。当页面仅加载白色小按钮时,登录无法正常工作。代码不是动态的,所以我不知道为什么有时它会呈现白色按钮而不是蓝色按钮。

这就是我所期待的: 这很好。

有时它会像这样出现: 这是不好的。

我的 Bootstrap 4 + JS 代码如下:

<div class="container">
    <div class="row justify-content-center col-sm-10 col-md-8 col-lg-6 mx-auto">
        <div id="sign_in_button" class="g-signin2 my-5"></div>

        <div class="w-100 clearfix"></div>

        <div id="sign_out_canvas" class="d-none my-5">
            <button name="sign_out_button" id="sign_out_button" type="button" class="btn btn-light btn-sm">
                <i class="fas fa-sign-out-alt mx-1"></i>
                Sign out
            </button>
            <a href="javascript:void();" onclick="signOut();"></a>
        </div>
    </div>
</div>
</cfoutput>

<script>
    function renderButton() {
        gapi.signin2.render('sign_in_button', {
            'scope': 'profile email',
            'width': 240,
            'height': 50,
            'longtitle': true,
            'theme': 'dark',
            'onsuccess': onSuccess,
            'onfailure': onFailure
        });
    }

    function onSuccess(googleUser) {
        console.log('Google User logged in successfully.');

        $('div#sign_out_canvas').toggleClass('d-none');
        var profile = googleUser.getBasicProfile();

        $.ajax({
            url: '/model/security.cfc',
            method: 'POST',
            data: {
                method: 'signIn',
                'id': profile.getId(),
                'full_name': profile.getName(),
                'given_name': profile.getGivenName(),
                'family_name': profile.getFamilyName(),
                'image_url': profile.getImageUrl(),
                'email': profile.getEmail()
            }
        }).done(function(Data) {
            window.location.replace("/?Action=Home.Home");
        });
    }

    function onFailure(error) {
        console.log(error);
    }
</script>
4

1 回答 1

0

什么触发了 renderButton()?

似乎它不会经常触发,这就是默认(非主题深蓝色按钮)出现的原因。

因为它不会触发,所以你的白色按钮会留下来,所以你需要解决的是为什么它不会触发?是连接问题吗?您的其他一些代码中是否存在错误,因此您的脚本永远不会进一步触发?

发生错误时检查您的控制台,您可能会发现无法触发的原因,以及为什么 renderButton 没有触发。

于 2018-12-03T11:08:44.660 回答