Fixed Access-Control-Allow-Origin requirement

[Snoozero]

Did the dynamic javascript loading code change in beta 4? I host my js and data folders on a separate domain, and since the beta4 update, any javascript files loaded dynamically (after the page has loaded) are complaining about the domain not being passed back in the Access-Control-Allow-Origin header.

Should we be setting Access-Control-Allow-Origin on our static domains now, or is this a bug? Is this new in beta 4?

UPDATE: To make your forum work correctly with a CDN, please read through the first page of this bug (you must take two steps to allow swfupload and cross domain javascript loading).

 

[Mike]

As far as I'm aware, nothing changed with respect to this in beta 4. We did move swfupload to respect your JS path, so the cross domain issue could be a problem there, but the dynamic JS loading code is still the same (though it does appear to be using a jQuery Ajax call; I'm somewhat surprised it worked before).

 

[Andy.N]

Update: adding my primary domain to the Access-Control-Allow-Origin header on the static domain resolved the problem. It might be a good idea to document this somewhere.

Update 2: It appears swfupload is now choking as well when using a separate js domain. I had to make a crossdomain.xml allowing the static domain access to the primary to solve this.

I experienced the same issue
http://xenforo.com/community/threads/anyone-use-maxcdn.19155/page-2

To be fair, I only enabled the CDN after beta 3 so I can't say how it worked before.

 

[Mike]

Actually I stand corrected - the JS loading code changed on the PHP side. This does look to be legit.

 

[Snoozero]

I'm not sure if this "bug" really needs fixed. For those of us using static domains, we should probably just be expected to take these few additional steps to set it up correctly. (Although I'm not really sure how it ever worked before >_>)

 

[Andy.N]

For those of us using static domains, we should probably just be expected to take these few additional steps to set it up correctly.

And what those steps would be? If you look at the Maxcdn thread, it's pretty it, unless there are extra steps we don't know.

 

[Snoozero]

And what those steps would be? If you look at the Maxcdn thread, it's pretty it, unless there are extra steps we don't know.

First, you need to configure your CDN to pass the appropriate cors headers with all javascript requests. I believe MaxCDN actually repeats all headers passed to it from the origin server, so you will have to configure your local server to feed this header along with all the javascript files in the /js/ folder.

In my example, my static files are on static.team9000.net, and my homepage is on www.team9000.net. For this to work, I have to add the following headers to all the files on static.team9000.net/js/:

Access-Control-Allow-Origin: www.team9000.net
Access-Control-Allow-Methods: GET,OPTIONS
Access-Control-Allow-Headers: *

Second, for swfupload to work, you will need a crossdomain.xml file on your home domain, allowing the SWF file from your static domain to connect to it. You can see mine here: https://www.team9000.net/crossdomain.xml

 

[Andy.N]

Thanks for the info.
For servers that run nginx, is there anything else needed? I have Wordpress on the front page with W3TC and Xenforo. I didn't notice any problem with WP side yet.

 

[Snoozero]

Thanks for the info.
For servers that run nginx, is there anything else needed? I have Wordpress on the front page with W3TC and Xenforo. I didn't notice any problem with WP side yet.

My server is actually running nginx as well. If your MaxCDN is feeding off your nginx server, you can just add this section to the nginx config for your domain (replace with your home domain of course):

location /js/ {
add_header Access-Control-Allow-Origin https://www.team9000.net/;
add_header Access-Control-Allow-Methods GET,OPTIONS;
add_header Access-Control-Allow-Headers *;
}

 

[Andy.N]

So I take it everything is working for you now with beta 4 and the CDN turned on?

 

[Snoozero]

So I take it everything is working for you now with beta 4 and the CDN turned on?

Yep, it appears everything is working now.

 

[Andy.N]

First, you need to configure your CDN to pass the appropriate Access-Control-Allow-Origin header with all javascript requests. I believe MaxCDN actually repeats all headers passed to it from the origin server, so you will have to configure your local server to feed this header along with all the javascript files in the /js/ folder.

In my example, my static files are on static.team9000.net, and my homepage is on www.team9000.net. For this to work, I have to add a header to all the files on static.team9000.net/js/, which states Access-Control-Allow-Origin: www.team9000.net

Second, for swfupload to work, you will need a crossdomain.xml file on your home domain, allowing the SWF file from your static domain to connect to it. You can see mine here: https://www.team9000.net/crossdomain.xml

I got this almost working.

I have the main domain at www.quantnet.com and the forum under /forum/. I have a MaxCDN at serving files from cdn.quantnet.net

Here is the lines in the XF config file

$config['externalDataUrl'] = 'http://cdn.quantnet.net/forum/data';
$config['javaScriptUrl'] = 'http://cdn.quantnet.net/forum/js';

Here is the directive in nginx config file

######################################
# Andy note - this allows MaxCDN to work per this thread #
# http://xenforo.com/community/threads/access-control-allow-origin-requirement.22242/ #
######################################

location /forum/js/ {
add_header Access-Control-Allow-Origin http://www.quantnet.com/;
}

and my crossdomain.xml is here http://www.quantnet.com/crossdomain.xml
Flash upload seems to work file. Avatar uploading is not working. When you click on the avatar, you will see JS loading but nothing else. Comment out this line

$config['javaScriptUrl'] = 'http://cdn.quantnet.net/forum/js';

and it works again.
Not sure why avatar upload/edit does not work.

 

[Snoozero]

Not sure why avatar upload/edit does not work.

My js directory:

Your js directory:

It appears your nginx instance still isn't inserting the correct header. Are you sure you applied the rule to the correct domain? Did you reload nginx afterward? Keep in mind you may have to convince maxcdn to flush its cache once you have the header working (I have no idea how to do this).

 

[Andy.N]

It appears your nginx instance still isn't inserting the correct header. Are you sure you applied the rule to the correct domain? Did you reload nginx afterward? Keep in mind you may have to convince maxcdn to flush its cache once you have the header working (I have no idea how to do this).

I'm not sure what going on here
If you load my forum www.quantnet.com/forum/ the xenforo.js should be served from http://cdn.quantnet.net/forum/js/xenforo/xenforo.js

I make the change to this file nginx file /etc/nginx/sites-available/quantnet.com and then do a sudo /etc/init.d/nginx start

And I then purge all cache from MaxCDN

 

[Snoozero]

I make the change to this file nginx file /etc/nginx/sites-available/quantnet.com and then do a sudo /etc/init.d/nginx start

/etc/init.d/nginx start will do nothing if nginx is already running. Instead, use

/etc/init.d/nginx reload

 

[Andy.N]

done

can you check?

 

[Snoozero]

Looks like you should be good to go. Now it's up to you to explain it to everyone else

 

[Andy.N]

Looks like you should be good to go. Now it's up to you to explain it to everyone else

All appears good now. Thanks so much for your help.
I'll sure do my part to help fellow XF owners.

 

[Floris]

I just realized today since I changed to the cdn for .js that the spam cleaner link wasn't working.
I thankfully figured it out - after which Mike linked me to this thread. Which explained the rest.

Teamwork +1, big +1. One of the things that I like about xenforo.

 

[Snoozero]

Teamwork +1, big +1. One of the things that I like about xenforo.

All appears good now. Thanks so much for your help.

Noticed today that Firefox is a little more strict when it comes to CORS requests. The method explained above will only work in chrome. For firefox, you need to add these headers IN ADDITION to the Access-Control-Allow-Origin header:

Access-Control-Allow-Methods GET,OPTIONS;
Access-Control-Allow-Headers *;

I have updated the post above with the additional headers.