1

I'm using Angular 5 and I want to load html response from http POST into iframe.

i have function like this:

private getCallback(signature: any): Observable<any> {

    const payload = `<payload><example>test</example></payload>`;

    const body = new HttpParams()
      .set('payload', payload)
      .set('signature', signature.data.payloadSignature);

    return this.http.post('https://test.com/start', body, {
      responseType: 'text',
      headers: {
        'Content-Type': 'application/x-www-form-urlencoded',
        'Access-Control-Allow-Origin': '*',
      },
    });

When i subscribe to getCallback method then console.log the response, i got html page. I store the html page into store service:

this.getCallback('').subscribe(res=>{
      this.service.setStore({
        html: res,
      });
      this.router.navigateByUrl('/iframe');

then load it on [srcdoc] iframe component like this: iframe.component.ts

@Component({
  template: `
    <div class="container-max-width">
      <div id="iframe" class="iframe-container">
        <iframe
          [srcdoc]="data.html | safe: 'html'"
        ></iframe>
      </div>
    </div>
  `,
  styleUrls: ['./iframe.component.scss'],
})

The iframe loaded the page, but i got error Refused to apply style from '<URL>' because its MIME type ('text/html') is not a supported stylesheet MIME type, and strict MIME checking is enabled.

Is there any tips to handle this?

PS: When I hit The API on http post method, the api should redirect me into their website. But since i don't know how to handle the redirect directly into iframe, I store the page into service store then loaded it like above

Abdurachman Ghifary
  • 35
  • 3
  • This feels wrong to me, can you explain for what reasons you want to use an iframe? – john Smith Jun 12 '20 at 11:04
  • The reason i use iframe because the ux team doesnt want end user to see thier are being redirected to external website @johnSmith – Abdurachman Ghifary Jun 12 '20 at 11:28
  • did you take a look at this? https://stackoverflow.com/questions/48248832/stylesheet-not-loaded-because-of-mime-type maybe your styleheet starts with comments – john Smith Jun 12 '20 at 21:18

0 Answers0