How to open external website inside my angular app without x-frame-options same origin error?

Question

I'm having some problems opening an external website inside my Angular Application. I tried to use the iframe, but any other solution will be appreciated.

I'm trying to open this website: https://esaj.tjms.jus.br/cpopg5/open.do inside of my Angular Application.

But I'm getting this error:

Refused to display 'https://esaj.tjms.jus.br/' in a frame because it set 'X-Frame-Options' to 'sameorigin'.

My html component:

Component.ts:

import { Component } from '@angular/core';
import { DomSanitizer, SafeResourceUrl } from '@angular/platform-browser';

@Component({
  selector: 'app-root',
  templateUrl: './app.component.html',
  styleUrls: ['./app.component.scss']
})
export class AppComponent {
  title = 'devmedia';
  url = 'https://esaj.tjms.jus.br/cpopg5/open.do'
  webUrl;
  constructor(private sanitizer: DomSanitizer){
    this.webUrl = this.sanitizer.bypassSecurityTrustResourceUrl(this.url);
    console.log(this.webUrl)
  }
  
}

On the console, I saw a problem that probably means something I should change, but I don't understand, I'm not sure what to do. Image error: https://i.stack.imgur.com/YQ3j2.png

Description error:

Indicate whether a cookie is intended to be set in a cross-site context by specifying its SameSite attribute
Because a cookie’s SameSite attribute was not set or is invalid, it defaults to SameSite=Lax, which prevents the cookie from being set in a cross-site context. This behavior protects user data from accidentally leaking to third parties and cross-site request forgery.
Resolve this issue by updating the attributes of the cookie:
Specify SameSite=None and Secure if the cookie is intended to be set in cross-site contexts. Note that only cookies sent over HTTPS may use the Secure attribute.
Specify SameSite=Strict or SameSite=Lax if the cookie should not be set by cross-site requests.
1 cookie
Name    Domain & Path
JSESSIONID  esaj.tjms.jus.br/cpopg5

Another question,

I'm trying to do this without an application server. Solving this problem, would have to face the same situation when the application is behind an Nginx?

Any help would be appreciated. :)

How to open external website inside my angular app without x-frame-options same origin error?

0 Answers