ng-recaptchav3
Version:
Angular8 library to provide easy extraction for google recaptcha v3, invisible recaptcha and recaptcha v2
387 lines (378 loc) • 10.8 kB
JavaScript
import { InjectionToken, Injectable, Inject, PLATFORM_ID, Optional, EventEmitter, Component, ElementRef, NgZone, Input, HostBinding, Output, NgModule } from '@angular/core';
import { isPlatformBrowser } from '@angular/common';
import { of, BehaviorSubject } from 'rxjs';
/**
* @fileoverview added by tsickle
* @suppress {checkTypes,constantProperty,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
*/
/** @type {?} */
const RECAPTCHA_LANGUAGE = new InjectionToken('recaptcha-language');
class RecaptchaLoaderService {
/**
* @param {?} platformId
* @param {?=} language
*/
constructor(platformId, language) {
this.platformId = platformId;
this.language = language;
this.init();
this.ready = isPlatformBrowser(this.platformId) ? RecaptchaLoaderService.ready.asObservable() : of();
}
/**
* \@internal
* @private
* @return {?}
*/
init() {
if (RecaptchaLoaderService.ready || !isPlatformBrowser(this.platformId)) {
return;
}
window.ngRecaptchaLoaded = (/**
* @return {?}
*/
() => {
RecaptchaLoaderService.ready.next(grecaptcha);
});
RecaptchaLoaderService.ready = new BehaviorSubject(null);
/** @type {?} */
const script = (/** @type {?} */ (document.createElement('script')));
script.innerHTML = '';
/** @type {?} */
const langParam = this.language ? `&hl=${this.language}` : '';
script.src = `https://www.google.com/recaptcha/api.js?render=explicit&onload=ngRecaptchaLoaded${langParam}`;
script.async = true;
script.defer = true;
script.setAttribute('nonce', '');
document.head.appendChild(script);
}
}
/**
* \@internal
* @nocollapse
*/
RecaptchaLoaderService.ready = null;
RecaptchaLoaderService.decorators = [
{ type: Injectable }
];
/** @nocollapse */
RecaptchaLoaderService.ctorParameters = () => [
{ type: undefined, decorators: [{ type: Inject, args: [PLATFORM_ID,] }] },
{ type: String, decorators: [{ type: Optional }, { type: Inject, args: [RECAPTCHA_LANGUAGE,] }] }
];
if (false) {
/**
* \@internal
* @nocollapse
* @type {?}
* @private
*/
RecaptchaLoaderService.ready;
/** @type {?} */
RecaptchaLoaderService.prototype.ready;
/**
* \@internal
* @type {?}
* @private
*/
RecaptchaLoaderService.prototype.language;
/**
* @type {?}
* @private
*/
RecaptchaLoaderService.prototype.platformId;
}
/**
* @fileoverview added by tsickle
* @suppress {checkTypes,constantProperty,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
*/
/** @type {?} */
const RECAPTCHA_SETTINGS = new InjectionToken('recaptcha-settings');
/**
* @record
*/
function RecaptchaSettings() { }
if (false) {
/** @type {?|undefined} */
RecaptchaSettings.prototype.siteKey;
/** @type {?|undefined} */
RecaptchaSettings.prototype.theme;
/** @type {?|undefined} */
RecaptchaSettings.prototype.type;
/** @type {?|undefined} */
RecaptchaSettings.prototype.size;
/** @type {?|undefined} */
RecaptchaSettings.prototype.badge;
}
/**
* @fileoverview added by tsickle
* @suppress {checkTypes,constantProperty,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
*/
/** @type {?} */
let nextId = 0;
class RecaptchaComponent {
/**
* @param {?} elementRef
* @param {?} loader
* @param {?} zone
* @param {?=} settings
*/
constructor(elementRef, loader, zone, settings) {
this.elementRef = elementRef;
this.loader = loader;
this.zone = zone;
this.id = `ngrecaptcha-${nextId++}`;
this.resolved = new EventEmitter();
if (!settings) {
return;
}
this.siteKey = settings.siteKey;
this.theme = settings.theme;
this.type = settings.type;
this.size = settings.size;
this.badge = settings.badge;
}
/**
* @return {?}
*/
ngAfterViewInit() {
this.subscription = this.loader.ready.subscribe((/**
* @param {?} grecaptcha
* @return {?}
*/
(grecaptcha) => {
if (grecaptcha != null) {
this.grecaptcha = grecaptcha;
this.renderRecaptcha();
}
}));
}
/**
* @return {?}
*/
ngOnDestroy() {
// reset the captcha to ensure it does not leave anything behind
// after the component is no longer needed
this.grecaptchaReset();
if (this.subscription) {
this.subscription.unsubscribe();
}
}
/**
* Executes the invisible recaptcha.
* Does nothing if component's size is not set to "invisible".
* @return {?}
*/
execute() {
if (this.size !== 'invisible' || this.widget === null) {
return;
}
if (this.actionName) {
this.grecaptcha.execute(this.widget, { action: this.actionName });
}
else {
this.grecaptcha.execute(this.widget);
}
}
/**
* @return {?}
*/
reset() {
if (this.widget === null) {
return;
}
if (this.grecaptcha.getResponse(this.widget)) {
// Only emit an event in case if something would actually change.
// That way we do not trigger "touching" of the control if someone does a "reset"
// on a non-resolved captcha.
this.resolved.emit(null);
}
this.grecaptchaReset();
}
/**
* \@internal
* @private
* @return {?}
*/
expired() {
this.resolved.emit(null);
}
/**
* \@internal
* @private
* @param {?} response
* @return {?}
*/
captchaReponseCallback(response) {
this.resolved.emit(response);
}
/**
* \@internal
* @private
* @return {?}
*/
grecaptchaReset() {
if (this.widget != null) {
this.zone.runOutsideAngular((/**
* @return {?}
*/
() => this.grecaptcha.reset(this.widget)));
}
}
/**
* \@internal
* @private
* @return {?}
*/
renderRecaptcha() {
this.widget = this.grecaptcha.render(this.elementRef.nativeElement, {
badge: this.badge,
callback: (/**
* @param {?} response
* @return {?}
*/
(response) => {
this.zone.run((/**
* @return {?}
*/
() => this.captchaReponseCallback(response)));
}),
'expired-callback': (/**
* @return {?}
*/
() => {
this.zone.run((/**
* @return {?}
*/
() => this.expired()));
}),
sitekey: this.siteKey,
size: this.size,
tabindex: this.tabIndex,
theme: this.theme,
type: this.type
});
}
}
RecaptchaComponent.decorators = [
{ type: Component, args: [{
exportAs: 'reCaptcha',
selector: 're-captcha',
template: ''
}] }
];
/** @nocollapse */
RecaptchaComponent.ctorParameters = () => [
{ type: ElementRef },
{ type: RecaptchaLoaderService },
{ type: NgZone },
{ type: undefined, decorators: [{ type: Optional }, { type: Inject, args: [RECAPTCHA_SETTINGS,] }] }
];
RecaptchaComponent.propDecorators = {
id: [{ type: Input }, { type: HostBinding, args: ['attr.id',] }],
siteKey: [{ type: Input }],
theme: [{ type: Input }],
type: [{ type: Input }],
size: [{ type: Input }],
tabIndex: [{ type: Input }],
badge: [{ type: Input }],
actionName: [{ type: Input }],
resolved: [{ type: Output }]
};
if (false) {
/** @type {?} */
RecaptchaComponent.prototype.id;
/** @type {?} */
RecaptchaComponent.prototype.siteKey;
/** @type {?} */
RecaptchaComponent.prototype.theme;
/** @type {?} */
RecaptchaComponent.prototype.type;
/** @type {?} */
RecaptchaComponent.prototype.size;
/** @type {?} */
RecaptchaComponent.prototype.tabIndex;
/** @type {?} */
RecaptchaComponent.prototype.badge;
/** @type {?} */
RecaptchaComponent.prototype.actionName;
/** @type {?} */
RecaptchaComponent.prototype.resolved;
/**
* \@internal
* @type {?}
* @private
*/
RecaptchaComponent.prototype.subscription;
/**
* \@internal
* @type {?}
* @private
*/
RecaptchaComponent.prototype.widget;
/**
* \@internal
* @type {?}
* @private
*/
RecaptchaComponent.prototype.grecaptcha;
/**
* @type {?}
* @private
*/
RecaptchaComponent.prototype.elementRef;
/**
* @type {?}
* @private
*/
RecaptchaComponent.prototype.loader;
/**
* @type {?}
* @private
*/
RecaptchaComponent.prototype.zone;
}
/**
* @fileoverview added by tsickle
* @suppress {checkTypes,constantProperty,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
*/
class RecaptchaCommonModule {
}
RecaptchaCommonModule.decorators = [
{ type: NgModule, args: [{
declarations: [RecaptchaComponent],
exports: [RecaptchaComponent],
},] }
];
/**
* @fileoverview added by tsickle
* @suppress {checkTypes,constantProperty,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
*/
class RecaptchaModule {
/**
* @return {?}
*/
static forRoot() {
return {
ngModule: RecaptchaModule,
providers: [
RecaptchaLoaderService
]
};
}
}
RecaptchaModule.decorators = [
{ type: NgModule, args: [{
exports: [RecaptchaComponent],
imports: [RecaptchaCommonModule]
},] }
];
/**
* @fileoverview added by tsickle
* @suppress {checkTypes,constantProperty,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
*/
/**
* @fileoverview added by tsickle
* @suppress {checkTypes,constantProperty,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
*/
export { RECAPTCHA_LANGUAGE, RECAPTCHA_SETTINGS, RecaptchaComponent, RecaptchaLoaderService, RecaptchaModule, RecaptchaCommonModule as ɵa };
//# sourceMappingURL=ng-recaptchav3.js.map