Possible to add headers to a response from a server (not controlled by me)?

Viewed 19

I have a react project and I have an API to access endpoints from a server I do not control.

When I send a GET request with a valid argument, for example:

getAllDelegatorRewards: async(address_) => {
        try {
            const res = await axios.get(`${SOME_ENDPOINT}/delegators/${address_}/rewards`);
            ...
            return res;
        }
        catch (err) {
            console.log(err.response.data);
        }
    },

I dont have any issue with CORS, and everything is ok. However, when I send the GET request with an invalid argument, I get the following error:

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

To overcome this, I set up a proxy with cors-anywhere on heroku and now all is well.

I have a couple of questions I'd like to ask:

  1. Since heroku announced they will no longer support free dynos starting end of November 2022, I'm wondering if there is another way to add: "Access-Control-Allow-Origin" : "*" to the reponse I'm getting back from the server that I have no control over?
  2. How is it that when I send a GET request, I dont have to set "Access-Control-Allow-Origin" : "*", but it seems like for the response I'm receiving from the external server, that header needs to be present? [Answered]

Thank you!

0 Answers
Related