My website has been blocked by CORS policy

Question

The error I am encountering in the console browser is:

Access to fetch at 'https://website.com/api/imtryingtofetchhere' from origin 
'https://mywebsite.com' has been blocked by CORS policy: Response to preflight
request doesn't pass access control check: 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.

I already tried a lot of methods everything I saw marked as "correct" here in Stack OverFlow, however nothing works. I already tried method using AXIOS before using fetch and still no luck of work. API is working on website like https://reqbin.com and I am now clueless on how to fix this thing.

Things that I've tried fetch & axios and other:

Adding/Removing allowed cross origin
with/without certificates
include/not include credentials
Disabled/Enabled CORS
Adding Head
Tried to add origin to .htaccess and php file still no hope

I also tried both of Axios link

Using jsDelivr CDN:

<script src="https://cdn.jsdelivr.net/npm/axios/dist/axios.min.js"></script>

Using unpkg CDN:

<script src="https://unpkg.com/axios/dist/axios.min.js"></script>

This is working on my discord bot, but on my website it doesn't work...

JS Code from my discord bot:

const hashToMintme = await axios.get(
  `https://www.coinimp.com/api/v2/payout/1mhash?currency=MINTME`,
  {
    headers: {
      'X-API-ID': 'API ID HERE',
      'X-API-KEY': 'API KEY HERE',
    },
  }
);

JS Code from my php website:

<script src="https://cdn.jsdelivr.net/npm/axios/dist/axios.min.js"></script>
<script>
    const axios = require('axios');

    const hashToMintme = await axios.get(`https://www.coinimp.com/api/v2/payout/1mhash?currency=MINTME`, {
        headers: {
            'X-API-ID': 'API ID HERE',
            'X-API-KEY': 'API KEY HERE'
        }
    });
</script>

This is the fetch code:

let headers = {
  'X-API-ID': 'API ID HERE',
  'X-API-KEY': 'API KEY HERE',
};

const hashToMintme = fetch(
  `https://www.coinimp.com/api/v2/payout/1mhash?currency=MINTME`,
  {
    mode: 'cors',
    credentials: 'include',
    method: 'GET',
    headers: headers,
  }
);

I didn't include the other settings since they are useless and not working.

I assume coinimp.com is not under your control. If it doesn't allow cross-origin requests, then you can't access it (or at the least you can't get the response data) in a browser. — AKX, Sep 23 '21 at 10:21
I thought so too, but im just curious that it is working on the discord bot but not in website, they do both GET and same codings. They also have open docs for the API i have keys and things also added the website to the panel. https://www.coinimp.com/documentation — Mashwishi, Sep 23 '21 at 10:23
Your discord bot is not run in the browser, is it? It's being run as a server process that doesn't care about CORS, which is an uniquely browser thing. — AKX, Sep 23 '21 at 10:47
Yes, hmm wonder what I can do alternative to make this work without running or requesting it directly from the browser. Do you have any recommendation on what method to use upon implementing this? — Mashwishi, Sep 23 '21 at 10:54
A server component (you mention PHP, so you can do the fetch in PHP) that does the request and responds to the user. That way you also don't expose your API ID and key to the client. — AKX, Sep 23 '21 at 11:02
I'd contact the developers and ask them to allow CORS. Some developers are kind enough to do this :) — realFishSam, Feb 04 '22 at 13:15

My website has been blocked by CORS policy

0 Answers0