Telegram login widget in an Angular iframe error

i'm adding a telegram login support for my angular site like thi

export class TelegramLoginWidgetComponent implements AfterContentInit {

@ViewChild('script', {static: true}) script: ElementRef;

convertToScript() {
const element = this.script.nativeElement;
const script = document.createElement('script');
script.src = 'https://telegram.org/js/telegram-widget.js?5';
script.setAttribute('data-telegram-login', environment.telegramBotName);
script.setAttribute('data-size', 'large');
// Callback function in global scope
script.setAttribute('data-onauth', 'loginViaTelegram(user)');
script.setAttribute('data-request-access', 'write');
element.parentElement.replaceChild(script, element);
}

ngAfterContentInit(): void {
this.convertToScript();
}

}


the script loads perfectly, the problem is that the iframe that the script loads throws an error

Refused to display 'https://oauth.telegram.org/embed/...' in a frame because an ancestor violates the following Content Security Policy directive: "frame-ancestors http://127.0.0.1".

Continue reading...