GoogleAuth图书馆加载承诺

时间:2016-07-12 07:08:01

标签: google-authentication gapi

我正在尝试使用promises加载google身份验证库,但是当我尝试调用gapi.auth2.getAuthInstance()并将其返回到promise中时,我失败了;

这是我如何做到这一点:

var loadPlatform = function ($q) {
    var deferred = $q.defer(),
        platform = document.createElement('script');

    platform.src ='https://apis.google.com/js/platform.js';
    platform.type = 'text/javascript';
    platform.async = true;
    platform.defer = true;
    platform.onload = deferred.resolve;
    platform.onerror = deferred.reject;

    document.body.appendChild(platform);

    return deferred.promise;
};

//I return this from other function
return loadPlatform($q)
    .then(function () {
        var deferred = $q.defer();

        gapi.load('auth2', function () {
            deferred.resolve(gapi.auth2);
        });

        return deferred.promise;
    })
    .then(function (auth2) {
        //This function retuns Promise
        //https://developers.google.com/identity/sign-in/web/reference#gapiauth2initparams
        return auth2.init(params);
    })
    .then(function (GoogleAuth) {
        //Here I should have solved GoogleAuth object
    });

一切正常,直到我返回auth2.init(params)然后浏览器冻结。 这里发生了什么?

1 个答案:

答案 0 :(得分:1)

我刚刚经历过同样的问题。

您似乎无法链接<form id="login-form" name="login-form" class="nobottommargin" [formGroup]="form" (ngSubmit)="onSubmit(form.value)"> <p *ngIf="activation" class="activation">We sent you an activation link to your email</p> <input type="radio" [formControl]="form.controls['type']" name="optradio">Personal <input type="radio" [formControl]="form.controls['type']" name="optradio">Professional <div class="form-group"> <input type="text" [formControl]="form.controls['firstname']" placeholder="First Name" class="form-control not-dark formcontrolheight" required> </div> <div class="clear"></div> <div class="form-group"> <input type="text" [formControl]="form.controls['lastname']" id="login-form-password" name="login-form-password" value="" placeholder="Last Name" class="form-control not-dark formcontrolheight" required> <div class="col-sm-12 topmargin-sm bottommargin-lg nopadding text-right pull-right"> <button type="button" class="button button-small">submit</button> </div> export class SignUp { http: Http; emailfailure:any; activation:any; profilefailure:any; form: ControlGroup; constructor(fbld: FormBuilder, http: Http, public router: Router) { this.http = http; this.form = fbld.group({ firstname: ['', Validators.required], lastname: ['', Validators.required], profilename: ['', Validators.required], email: ['', Validators.required], password: ['', Validators.required], repeatpassword: ['', Validators.required], image: [''], phone: ['', phoneValidator], type: ['', ], }, { validator: matchingPasswords('password', 'repeatpassword') }); } 对象的init()承诺。

我不得不把它包起来以避免浏览器冻结。

auth2

有趣的是,我无法直接应用return new Promise<void>(resolve => { gapi.auth2.init({ client_id: this._clientId, scope: 'profile' }).then(() => resolve()); }) 函数。

resolve

<强>更新

如上所述,.then(resolve); 调用的返回对象不是一个承诺,它是一种包装器,只有在您调用{{1}后才返回真实承诺方法

enter image description here

init()