Does anyone know how to embed a booking flow from square on a custom website? Using Angular to add an iframe that pops up when clicking a button that will take you to the appointment booking section.

Here’s how I’m currently doing it:

.html

<iframe
  [src]="getSanitizedURL()"
  allow="payment https://squareup.com"
  frameborder="0"
  sandbox="allow-same-origin allow-scripts"></iframe>

.ts

import {
  AfterViewInit,
  ChangeDetectorRef,
  Component,
  Inject
} from '@angular/core';
import { MAT_DIALOG_DATA } from '@angular/material/dialog';
import { DomSanitizer, SafeResourceUrl } from '@angular/platform-browser';

interface DialogData {
  dialogURL: string;
}

@Component({
  selector: 'app-third-party-dialog',
  standalone: true,
  imports: [],
  templateUrl: './third-party-dialog.component.html',
  styleUrl: './third-party-dialog.component.scss'
})
export class ThirdPartyDialogComponent implements AfterViewInit {
  constructor(
    @Inject(MAT_DIALOG_DATA) public data: DialogData,
    private readonly domSanitizer: DomSanitizer,
    private ref: ChangeDetectorRef
  ) {}

  /*
    Prevent iframe from reloading on mobile.
    Whenever there was a scroll while iframe is open,
    it caused a reload. To fix, we call detach() :)
    Source: /a/54204166/4036593
  */
  ngAfterViewInit(): void {
    this.ref.detach();
  }

  getSanitizedURL(): SafeResourceUrl {
    return this.domSanitizer.bypassSecurityTrustResourceUrl(
      this.data.dialogURL
    );
  }
}

But I get these errors:

Content-Security-Policy: The page’s settings blocked an event handler (script-src-attr) from being executed because it violates the following directive: “script-src 'self' 'unsafe-eval' https://www.googletagmanager.com https://*.doubleclick.net https://www.googleadservices.com https://www.google.com/recaptcha/api.js https://www.gstatic.com https://*.contentsquare.com https://*.contentsquare.net https://connect.facebook.net https://cdn.sprig.com https://*.squarecdn.com https://js.squareup.com https://cdn.cookielaw.org”

and clicking any services I get:

Uncaught DOMException: A parameter or an operation is not supported by the underlying object
    h https://booking-flow-production-c.squarecdn.com/assets/index-VBxawTeB.js:139
    onClick https://booking-flow-production-c.squarecdn.com/assets/index-VBxawTeB.js:139
    yQ https://booking-flow-production-c.squarecdn.com/assets/index-VBxawTeB.js:35
    SQ https://booking-flow-production-c.squarecdn.com/assets/index-VBxawTeB.js:35
    _Q https://booking-flow-production-c.squarecdn.com/assets/index-VBxawTeB.js:35
    B$ https://booking-flow-production-c.squarecdn.com/assets/index-VBxawTeB.js:35
    yD https://booking-flow-production-c.squarecdn.com/assets/index-VBxawTeB.js:35
    OS https://booking-flow-production-c.squarecdn.com/assets/index-VBxawTeB.js:35
    X6 https://booking-flow-production-c.squarecdn.com/assets/index-VBxawTeB.js:38
    HL https://booking-flow-production-c.squarecdn.com/assets/index-VBxawTeB.js:35
    OS https://booking-flow-production-c.squarecdn.com/assets/index-VBxawTeB.js:35
    C6 https://booking-flow-production-c.squarecdn.com/assets/index-VBxawTeB.js:35
    MQ https://booking-flow-production-c.squarecdn.com/assets/index-VBxawTeB.js:35
    bD https://booking-flow-production-c.squarecdn.com/assets/index-VBxawTeB.js:35
    kS https://booking-flow-production-c.squarecdn.com/assets/index-VBxawTeB.js:35
    Hm https://booking-flow-production-c.squarecdn.com/assets/index-VBxawTeB.js:35
    Hm https://booking-flow-production-c.squarecdn.com/assets/index-VBxawTeB.js:35
    createRoot https://booking-flow-production-c.squarecdn.com/assets/index-VBxawTeB.js:38
    FQe https://booking-flow-production-c.squarecdn.com/assets/index-VBxawTeB.js:281
    async* https://booking-flow-production-c.squarecdn.com/assets/index-VBxawTeB.js:281
    <anonymous> https://booking-flow-production-c.squarecdn.com/assets/index-VBxawTeB.js:281
index-VBxawTeB.js:139

2 weeks ago this was working fine, and then suddenly stop working.

tried calling square support, changing ways to embed it, using the script file.