'http://localhost:3000' has been blocked by CORS policy - For external API

Question

I don't have access to an external API but I am being blocked out by CORS. I have also enabled "Access-Control-Allow-Origin" in the Axios post config. Most answers are tailored to a local api. How do I get around this?


const auth = {
  username: "xxx",
  password: "xxx",
};

const res = await axios.get(
      `https://api.staging.CORP.dev/stuff/{my-key}/pub_id`,
      { auth },  
        {
        headers: {
          "Content-Type": "application/json",
          "Access-Control-Allow-Origin": "*",
        },
      }
    );
    const pub = res.data.map((pub) => ({ puv_id: pub.id }));
    const data = {
      address: {
        postcode: 'PostCode',
      },
      full_name: 'name',
      email: 'email',
      pub_id: pub
    };
    axios
      .post(
        "https://api.staging.CORP.dev/stuff/{public}/orders",
        data,
        { auth },
        {
          headers: {
            "Content-Type": "application/json",
            "Access-Control-Allow-Origin": "*",
          },
        }
      )
      .then((res) => console.log(res))
      .catch((err) => console.log(err.response));

You can refer to [this](https://stackoverflow.com/a/63734701/17349359) here he has given step by step what to do — DarkForest, Mar 01 '22 at 12:47
@DarkForest That post is referring to the back end whereas my request is a request on the font end — Sam, Mar 01 '22 at 12:50

score -1 · Answer 1 · answered Mar 01 '22 at 12:53

-1

You can try adding "proxy": "http://localhost:3000", in your package.json

answered Mar 01 '22 at 12:53

DarkForest

261
8

I'm unable to use this on Heroku production – Sam Mar 01 '22 at 12:54
Also the proxy isn't my local host, its the external api – Samuel Lawrence Mar 01 '22 at 12:58
it should be in the root directory of your project – DarkForest Mar 01 '22 at 13:00
are you tring to run this on your local machine or on a server? – DarkForest Mar 01 '22 at 13:01
@DarkForest Im doing both, when i proxy the external api i get the desired result but does not work on prod – Sam Mar 01 '22 at 14:06
ur sever might be assigning you different port. you can use 'process.env.PORT || 3000' where u define your port – DarkForest Mar 02 '22 at 06:18

'http://localhost:3000' has been blocked by CORS policy - For external API

1 Answers1