View Replies (15)

Resolved Access-Control-Allow-Headers - Cross-Origin Request Blocked

  1. SP Page Builder 3.x
  2. Tuesday, 12 November 2019
Hi, I'm loading a module in SPPB, this module gets data from an API using ajax. The module has been tested on local and remote, http and https. When I publish the module on the same website but on a page that does not load SPPB, it works correctly; That's why I ask here.

This is the code: I am using jquery, with php using file_get_content it is possible but I must use jquery.


	jQuery.ajax({ 

		url : 'https://api.coincap.io/v2/assets', 

		type : 'GET',

		dataType:'json', 

		success : function (data){

			console.log(data);

		}

	})

This is the header that the API returns


Array ( [0] => HTTP/1.1 200 OK [1] => Date: Tue, 12 Nov 2019 15:34:15 GMT [2] => Content-Type: application/json; charset=utf-8 [3] => Connection: close [4] => Set-Cookie: __cfduid=de699e8b34d4188a46c66a5261965bd021573572854; expires=Wed, 11-Nov-20 15:34:14 GMT; path=/; domain=.coincap.io; HttpOnly [5] => X-Powered-By: Express [6] => X-RateLimit-Limit: 180 [7] => X-RateLimit-Remaining: 173 [8] => Access-Control-Allow-Origin: * [9] => Access-Control-Allow-Headers: Origin, X-Requested-With, Content-Type, Accept, Accept-Encoding [10] => ETag: W/"4bd9-3F9ImaVKlhKStu7rqvlUCEKSvyw" [11] => Vary: Accept-Encoding [12] => CF-Cache-Status: DYNAMIC [13] => Expect-CT: max-age=604800, report-uri="https://report-uri.cloudflare.com/cdn-cgi/beacon/expect-ct" [14] => Server: cloudflare [15] => CF-RAY: 534991a3de03162d-LIM )

These are the errors that the log shows


Reason: missing token ‘xyz’ in CORS header ‘Access-Control-Allow-Headers’ from CORS preflight channel





Reason: CORS request did not succeed


Help to discover and solve why it doesn't work within SPPB?
Accepted Answer
Thanks for the help, here I leave the solution for others who have the same problem (maybe there is a better way to do it, but this works for me)


delete $.ajaxSettings.headers["X-CSRF-Token"];

$.ajax({

    .................

})

$.ajaxSettings.headers["X-CSRF-Token"] = Joomla.getOptions('csrf.token');

Remove the header, run ajax, add the header again
  1. more than a month ago
  2. SP Page Builder 3.x
  3. # Permalink
Responses (15)
Hi there,

Thanks for your query. Your query is very important to us. Let me know that, does allow_url_fopen it enable or disable?

-Thanks
  1. more than a month ago
  2. SP Page Builder 3.x
  3. # 1
It's activated, but I don't think it has anything to do with jQuery. As I mentioned using php I can get the data without problems, but I must do it in jquery because I must show dates and times of the client (user's computer). this is the full message that firefox shows:


reason: token 'x-csrf-token' not present in the CORS header 'Access-Control-Allow-Headers' of the preorder CORS channel).


As I repeat, it only happens when it is executed together with SPPB. I have also read another post with CORS problems, here in the forum that has no solution. You know the SPPB scripts more than we do, in order to detect this conflict.

Thanks
  1. more than a month ago
  2. SP Page Builder 3.x
  3. # 2
Hi there,

Thanks for your explanation. I checked the loading of Module addon inside the page builder. But, No problem found. Is it possible to share with me the third party module name (which you inserted into the module addon)? Besides, I would request to you that, please capture a screencast video when you have got this problem.

-Thanks
  1. more than a month ago
  2. SP Page Builder 3.x
  3. # 3
Hello, well I discovered that the problem is generated by the following script


;(function ($) {

	$.ajaxSetup({

		headers: {

			'X-CSRF-Token': Joomla.getOptions('csrf.token')

		}

	});

})(jQuery);

This script is only present on pages created with SP page builder, I suppose it is necessary for its operation.
In the Headers configuration of the API, X-CSRF-Token is not present.
You know how I can overwrite or destroy ajaxsetup() so that it does not request X-CSRF-Token from the API.
please help me with a solution
  1. more than a month ago
  2. SP Page Builder 3.x
  3. # 4
Hi there,

Please create an issue on your site & provide us your access via private message. I will forward it to our developer team.

-Thanks
  1. more than a month ago
  2. SP Page Builder 3.x
  3. # 5
Thanks for the help, here I leave the solution for others who have the same problem (maybe there is a better way to do it, but this works for me)


delete $.ajaxSettings.headers["X-CSRF-Token"];

$.ajax({

    .................

})

$.ajaxSettings.headers["X-CSRF-Token"] = Joomla.getOptions('csrf.token');

Remove the header, run ajax, add the header again
Hi, where you put the code?
  1. more than a month ago
  2. SP Page Builder 3.x
  3. # 6
Thanks for the help, here I leave the solution for others who have the same problem (maybe there is a better way to do it, but this works for me)


delete $.ajaxSettings.headers["X-CSRF-Token"];

$.ajax({

    .................

})

$.ajaxSettings.headers["X-CSRF-Token"] = Joomla.getOptions('csrf.token');

Remove the header, run ajax, add the header again
Hi, where you put the code?


Hi there, Remove the code. Thanks
  1. more than a month ago
  2. SP Page Builder 3.x
  3. # 7
Thanks for the help, here I leave the solution for others who have the same problem (maybe there is a better way to do it, but this works for me)


delete $.ajaxSettings.headers["X-CSRF-Token"];

$.ajax({

    .................

})

$.ajaxSettings.headers["X-CSRF-Token"] = Joomla.getOptions('csrf.token');

Remove the header, run ajax, add the header again
Hi, where you put the code?


in your script.js where you are making the ajax call
  1. more than a month ago
  2. SP Page Builder 3.x
  3. # 8
Thanks for the help, here I leave the solution for others who have the same problem (maybe there is a better way to do it, but this works for me)


delete $.ajaxSettings.headers["X-CSRF-Token"];

$.ajax({

    .................

})

$.ajaxSettings.headers["X-CSRF-Token"] = Joomla.getOptions('csrf.token');

Remove the header, run ajax, add the header again
Hi, where you put the code?


in your script.js where you are making the ajax call


Hi, Mainly the header request blocked by the hosting server. We don't recommend to remove the code. Thanks
  1. more than a month ago
  2. SP Page Builder 3.x
  3. # 9
I put the code and the module works but Sp page builder is useless (invalid token)
  1. more than a month ago
  2. SP Page Builder 3.x
  3. # 10
The problem is that no API will include X-CSRF-Token in the list of allowed headers.
They are telling us that we should not delete the code, but what the code I put here does is, delete the header, execute the ajax and immediately recreate the deleted header. It is the solution that I propose. What solution do Joomshaper developers propose? because this problem will happen every time you want to run ajax to get data from an API, along with sp page builder.
  1. more than a month ago
  2. SP Page Builder 3.x
  3. # 11
Any resolution or response from SP Pagbuilder? This is blocking Constant Contact popup forms from loading as well.
  1. more than a month ago
  2. SP Page Builder 3.x
  3. # 12
I am trying to use an Instagram script, and it is also being rejected for this problem!

No intention has yet been realized to help the customers of this post? This is really bad for you.

I really need this help!!!

My error displayed:

Access to XMLHttpRequest at 'https://www.instagram.com/ZZZZZ/' from origin 'https://www.mysite.com' has been blocked by CORS policy: Request header field x-csrf-token is not allowed by Access-Control-Allow-Headers in preflight response.
  1. more than a month ago
  2. SP Page Builder 3.x
  3. # 13
Thanks for the help, here I leave the solution for others who have the same problem (maybe there is a better way to do it, but this works for me)


delete $.ajaxSettings.headers["X-CSRF-Token"];

$.ajax({

    .................

})

$.ajaxSettings.headers["X-CSRF-Token"] = Joomla.getOptions('csrf.token');

Remove the header, run ajax, add the header again



Alvaro!!

Can you explain more?
Since Joomshaper is not willing to help.

I don't know where to insert this code, and I don't know how, I'm pretty bad with codes.

Thank you!
  1. more than a month ago
  2. SP Page Builder 3.x
  3. # 14


There are no replies made for this post yet.
Be one of the first to reply to this post!


This forum is archived

This forum has been archived. Please use JoomShaper official support system.

Please publish modules in sidebar position.