2012-01-30 12 views
6
<link rel="stylesheet/less" href="http://mycdn.s3.amazon.com/css/web/style.less"> 
<script src="http://mycdn.s3.amazon.com/css/less-1.1.5.min.js"></script> 

Quando ho messo il mio file .less nel mio CDN, si dice:Less.js non funziona con i CDN?

XMLHttpRequest non può caricare http://mycdn.s3.amazonaws.com/media/css/bootstrap/lib/bootstrap.less. L'origine http://mydomain.com non è consentita da Access-Control-Allow-Origin.

Perché? Come posso risolvere questo? NON voglio compilare file .css sul lato server. Voglio mantenere loro il lato client.

+0

Possibile duplicato http://stackoverflow.com/questions/8176913/xmlhttprequest-origin-is-not-allowed-by-access-control-allow-origin –

+1

Su una nota per chiunque altro finisca qui: Ho ottenuto lo stesso errore sul server web del mio host web. Mandava erroneamente risposte vuote perché il tipo di file/mime '.less' era sconosciuto. La configurazione del server Web per servire correttamente file .less lo ha risolto. (Non era una richiesta interdominio, tutti i file '.js' /' .less' venivano serviti dalla stessa cartella.) –

risposta

4

questo piuttosto lungo articolo da MDN vi aiuterà a capire cosa sta succedendo - https://developer.mozilla.org/En/HTTP_access_control

Fondamentalmente hai eseguito nel modello di protezione tra domini

Se siete convinti che non si desidera per compilare CSS sul server, potresti provare a servirlo dal tuo sottodominio, ovvero mappare un sottodominio al CDN di Amazon, ma non sono sicuro che risolverà il tuo problema.

In realtà mi chiedo perché non si desidera compilare il lato server .CSS in quanto ciò si tradurrà nella migliore prestazione per i visitatori e consente di ospitare facilmente il CSS su un CDN.

Dopo l'HTML, il CSS è l'elemento successivo più importante da inserire nel browser in modo che possa avviare il layout e il rendering di una pagina, inserendo JS nel mix che stai rallentando (in particolare come JS può bloccare download paralleli in alcuni browser e bloccherà il thread dell'interfaccia utente mentre viene eseguito)

+1

Un altro motivo per precompilare il CSS: gli utenti potrebbero aver disabilitato JavaScript (http: // noscript .netto). Di conseguenza, il CSS LESS non verrà analizzato. –

+0

Pensi che un sottodominio del CDN di Amazon risolva il problema? – TIMEX

+1

Si potrebbe provare ad aggiungere la seguente intestazione HTTP 'Access-Control-Allow-Origin: http: // mycdn.s3.amazon.com' –

0

Se si desidera correggere l'accesso tra domini, è necessario guardare a cose come Cross Origin Resource Sharing (http://en.wikipedia.org/wiki/Cross-Origin_Resource_Sharing) ma questo è supportato solo dai browser moderni, o JSONP ma questo non sarebbe possibile con la tua CDN, penso.

Sono d'accordo con @Andy Davies che, perché non si sta compilando il .less dal momento che questo avrebbe risolto il problema? questo è dovuto alla dimensione del file che viene consegnato o non puoi compilare .less mentre fai il push dei file dal vivo? In Visual Studio è possibile utilizzare componenti aggiuntivi come http://www.mindscapehq.com/products/web-workbench che verranno compilati quando si verificano cambiamenti.