My domain is blocked by CORS policy: No 'Access-Co​ntrol-Allo​w-Origin' header is present on the requested resource.

Since this week I cannot add a talkback command using Javascript/Ajax. I get the following error in my web browser (Chrome)

Access to XMLHttpRequest at 'https://api.thingspeak.com/talkbacks/32490/commands.json?apikey=xxxxxxxxxxxxxxx&command_string=OFF&position=1' 
from origin 'https://desmon.fr' has been blocked by CORS policy: No 'Access-Control-Allow-Origin' header is present on the requested resource.

However the same code was working perfectly 2 weeks ago. It seems that my website is blocked on ThingSpeak.

When I try to submit the same command using CUIRL it works (from my PC).

curl -X POST https://api.thingspeak.com/talkbacks/32490/commands.json?api_key=xxxxxxxxxxxxxxxxxx -d "command_string=ON&position=1"

Here is the Javascript code I use:

$.ajax({	
    type: 'POST',
    url: 'https://api.thingspeak.com/talkbacks/32490/commands.json?apikey=xxxxxxxxxxxxxxxxxxxxxxx&command_string='+newState+'&position=1', 
    crossDomain : true,
    success: function(data) {

[Vinod]

Can you tell us more about the use case -- why is the web browser posting commands to talkbacks?

Talkbacks are primarily intended for use by devices. The CORS policy we have prevents this use from a web browser which does some additional validation on the client side when making the requests. We can look into putting in headers to prevent the browser from doing these checks depending on the use case.

[jM Desmon]

I use talkback commands to remotely switch on/off my boiler. I use a web page to send commands. How can I work around this issue?

Answer 1

[Vinod]

On further investigation, it appears that there is a difference between your AJAX code and the CURL command:

AJAX request is:

https://api.thingspeak.com/talkbacks/32490/commands.json?apikey=xxxxxxxxxxxxxxx&command_string=OFF&position=1

CURL request is

https://api.thingspeak.com/talkbacks/32490/commands.json?api_key=xxxxxxxxxxxxxxxxxx -d "command_string=ON&position=1

Note the difference "apikey" v/s "api_key".

Can you please modify your AJAX request to use api_key and try again?

[jM Desmon]

You are totally right. I didn't note this difference. I just modified the AJAX request with api_key and it works. I do not understand why but it works. Thank you very much.