VMware Cloud Community
Ekiseloff
Contributor
Contributor

Fetch request to VRO (orchestrator)

Help me, please, I really stuck in!

My task is to make up a react.js application that could request VRO via API and print getting data in the web interface.

I've created some Node.js class and can use "node-fetch" library for executing such requests, but when I try to use window.fetch I get

different error messages like these:

1. Access to fetch at 'https://hplab-vro.hplab.ix:8281/vco/api/versions/' from origin 'http://localhost:3000' has been blocked by CORS policy: No 'Access-Control-Allow-Origin' header is present on the requested resource. If an opaque response serves your needs, set the request's mode to 'no-cors' to fetch the resource with CORS disabled.

My solution: insert {mode: 'no-cors'} in Fetch options.

The error disapears, but I get the second error.

2. Cross-Origin Read Blocking (CORB) blocked cross-origin response https://hplab-vro.hplab.ix:8281/vco/api/versions/ with MIME type application/json. See https://www.chromestatus.com/feature/5629709824032768 for more details.

===

My JS code for executing Fetch to VRO:

const apiUrl = 'https://hplab-vro.hplab.ix:8281/vco/api/versions/';

const param = {

   method: 'GET',

   mode: 'no-cors',

   headers: {

   'Accept': '*/*',

   },

};

fetch (apiUrl, param)

  .then(response => response.json())

  .then(json => console.log(json));

Folks, have you got any guesses how to win this struggle? It makes me crazy!

Thanks in advance!

Reply
0 Kudos
1 Reply
iiliev
VMware Employee
VMware Employee

I'm not a Web developer, but these errors seem kind of expected to me.

Does your application have a backend part? If so, you can implement the communication with vRO REST API in your backend, and then make your React.js frontend to call your backend (that is, your backend to act like a proxy between vRO and your frontend).

Reply
0 Kudos