Having trouble integrating telegram authorization into my Angular project. I've set up a bot and added the correct host settings on Windows. Following this guide, I have implemented the code as suggested. However, I am encountering an error:
Refused to frame 'https://oauth.telegram.org/' because an ancestor violates the following Content Security Policy directive: "frame-ancestors http://host.de".
@Component({
selector: 'app-telegram-login-widget',
template: `
<div #script style.display="none">
<ng-content></ng-content>
</div>`,
styleUrls: ['./telegram-login-widget.component.css']
})
export class TelegramLoginWidgetComponent implements AfterViewInit {
@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);
}
ngAfterViewInit() {
this.convertToScript();
}
}