API calls using fetch API blocked by CORS policy issue

Question

I am trying to consume API's from my local PC that are stored in a remote server but CORS keeps blocking the calls are made. But when I test these calls on postman, they go through and I receive data. How do IError image resolve this CORS problem? I have attached a screenshot of the problem and I used javascript tech stack in consuming the API's.

Answer 1

Run a proxy server to make the API request and set this custom header Access-Control-Allow-Origin.

const express = require('express');
const request = require('request');

const app = express();

app.use((req, res, next) => {
  res.header('Access-Control-Allow-Origin', '*');
  next();
});

app.get('/api/random', (req, res) => {
  request(
    { url: 'http://YOUR API HERE' },
    (error, response, body) => {
      if (error || response.statusCode !== 200) {
        return res.status(500).json({ type: 'error', message: err.message });
      }

      res.json(JSON.parse(body));
    }
  )
});

const PORT = process.env.PORT || 3000;
app.listen(PORT, () => console.log(`listening on ${PORT}`));