1

I've been working on this for months now and have talked with my host, the company etc and I can make my api call work on their developer page which has example code to test their API but for the life of me I cannot get it to work on my Wordpress site and it is very much needed.

My initial code is as follows:

const options = {
  method: 'POST',
  headers: {
    Accept: '*/*',
    'Content-Type': 'application/json',
    Authorization: 'Basic XXXXXXXREDACTEDXXXXX'
  },
  body: JSON.stringify({firstName: 'John', lastName: 'Doe', phoneNumber: '5444455555'})
};

fetch('https://a.eztexting.com/v1/contacts', options)
  .then(response => response.json())
  .then(response => console.log(response))
  .catch(err => console.error(err));

The first error I receive is: Access to fetch at 'https://a.eztexting.com/v1/contacts' from origin 'https://businessofimagination.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.

after trying many different headers all over Wordpress and my theme I finally included: "mode: 'no-cors'," into my code

updated code is as follows:

const options = {
  method: 'POST',
  mode: 'no-cors',
  headers: {
    Accept: '*/*',
    'Content-Type': 'application/json',
    Authorization: 'Basic XXXXXXREDACTEDXXXXXX'
  },
  body: JSON.stringify({firstName: 'John', lastName: 'Doe', phoneNumber: '5444455555'})
};

fetch('https://a.eztexting.com/v1/contacts', options)
  .then(response => response.json())
  .then(response => console.log(response))
  .catch(err => console.error(err));

Now the errors I receive are: POST https://a.eztexting.com/v1/contacts 403 (403 forbidden) and SyntaxError: Unexpected end of input

I don't understand why it refuses to work, or what in Wordpress is preventing this. Please any help would be incredible. This has been an incredibly frustrating journey for something that in theory should work fairly seamlessly.

Nicholas Goehner
  • 11
  • 2
  • I do not think you want to set your mode as 'no-cors', [for the following reason](https://stackoverflow.com/a/43268098/18467520). I would try removing that and setting your header to include `Access-Control-Allow-Origin: *`. – jnchaba Apr 29 '22 at 00:39
  • Removed the 'no-cors' and added the above to the headers: headers: { Accept: '*/*', 'Content-Type': 'application/json', 'Access-Control-Allow-Origin': '*', Authorization: 'Basic XXXXXXREDACTEDXXXXXX' }, Same outcome as first above: 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. – Nicholas Goehner Apr 29 '22 at 04:41
  • Is there a reason you chose to use javascript over using `wp_remote_post` and php method? – Howard E Apr 29 '22 at 23:12
  • Hey Howard, I'm not at all familiar with wp_remote_post. is there a way to get what I need done using php? – Nicholas Goehner May 01 '22 at 23:13

0 Answers0