CORB does not allow display JSON response

Asked

Viewed 32 times

0

Provided an API that returns the following JSON:

{
    "ResponseStatus": {
        "ResponseCode": 0,
        "ResponseMessage": "Success."
    },
    "Events": [
        {
            "CodEspec": 65957,
            "NomeEspec": "O PIOR ESPETÁCULO        DO MUNDO",
            "DiaHoraEspecs": [
                "2019-05-09T21:30:00",
                "2019-05-10T21:30:00",
                "2019-05-25T21:30:00"
            ]
        }
    ]
}

I am developing the front end in Angular and for this purpose I created this model: Event.ts

export class Event{
  CodEspec: number;
  NomeEspec: string;
  DiaHoraEspecs: Date[];
}

I also created a service to get JSON with the following functionality:

  getEventos():Observable<Event[]>{
    //get todos os eventos
    return this.http.get<Event[]>(`${this.ticketlineUrl}`);
  }

Then in the component called event I called the service and the GET to return the reply and then show.

Events.component.ts

export class EventsComponent implements OnInit {

  events: Event[];

  constructor(private ticketlineservice: TicketlineService) { }

  ngOnInit() {
    this.ticketlineservice.getEventos().subscribe(events => {
      this.events = events;
    });
  }
}

Events.component.html

<div>
    <ul *ngFor="let event of events">
        <li>Evento: {{ event.title }}
                {{ event.CodEspec }}
                {{ event.NomeEspec }}
                {{ event.DiaHoraEspecs }}
        </li>
    </ul>
</div>

Problem: Shows no information, and the console shows the following errors:

Access to XMLHttpRequest at from origin 'http://localhost:4200' has been blocked by CORS policy: No 'Access-Control-Allow-Origin' header is present on the requested resource.

ERROR HttpErrorResponse {headers: HttpHeaders, status: 0, statusText: "Unknown Error", url: "", ok: false, …}

Cross-Origin Read Blocking (CORB) blocked cross-origin response with MIME type application/json. See https://www.chromestatus.com/feature/5629709824032768 for more details.

I’ve used a Chrome extension that solves the Access-Control-Allow-Origin problem, but CORB stands and shows no information.

  • 2

    you have to enable Cors in your backend

  • The back-end is not mine, I wanted an option to test the front-end.

No answers

Browser other questions tagged

You are not signed in. Login or sign up in order to post.