Search code examples
backbone.jsrequirejs

Require.js - Get cross origin error on !text defines when loaded directly in browser


When I try to open my single page app without it being hosted, in other words, I open the index.html directly in my browser via file->open. I get cross origin errors on my !text "template" files like this:

file:///Users/thegreyspot/' . clipped . '/videoIframeTemplate.html. Cross origin requests are only supported for protocol schemes: http, data, chrome, chrome-extension, https, chrome-extension-resource.

This only applies to the files I loaded with the "!text" designation. For example, the "videoThumpTemplate.html" here:

define([
  'jquery',
  'underscore',
  'backbone',
  'templates/videoThumbTemplate.html'
],function($,_,Backbone, videoThumbTemplate){
...

Do I HAVE to serve from a local server? Or can this be fixed?


Solution

  • This is a known chrome bug, the only way to make chrome load local Ajax content is to open it with the --allow-file-access-from-files flag. Star the chrome issue to keep track of changes and to motivate google to fix it.

    The way to make your plugins work locally is to either run the optimizer with inlineText set to true or load your page through http:// - this gist contains a couple different options to start a server.

    I will close this issue since there is nothing we can do to fix it. -issues#190

    You're better of serving from a local server.. it's very easy to setup a nodejs server... or just use abode brackets, it has a live preview feature that serves stuff via node server.