Let me give you a bit of history on what I'm trying to do.

I'm using a Flex application, as a container for a web app. So within this Flex app, it has a web controller, which loads a full fledged Angularjs application. All the files are stored locally within the Flex app.

When I attempt to run it, it cannot load any of the templates; they are loaded using the $routeProvider, and data is pulled using the $http.get.

The core problem is that it's not allowing me to pull local files using JavaScript, even though it's being run off the file-system (not using a web server).

I also tested it on Chrome, and have the same exact issue - giving the following error.

Origin null is not allowed by Access-Control-Allow-Origin.

With Chrome, it can be fixed using --allow-file-access-from-files, but can't figure out how to get it working via the Flex/Flash web controller.

Any help would be greatly appreciated.

Let me give you a bit of history on what I'm trying to do.

I'm using a Flex application, as a container for a web app. So within this Flex app, it has a web controller, which loads a full fledged Angularjs application. All the files are stored locally within the Flex app.

When I attempt to run it, it cannot load any of the templates; they are loaded using the $routeProvider, and data is pulled using the $http.get.

The core problem is that it's not allowing me to pull local files using JavaScript, even though it's being run off the file-system (not using a web server).

I also tested it on Chrome, and have the same exact issue - giving the following error.

Origin null is not allowed by Access-Control-Allow-Origin.

With Chrome, it can be fixed using --allow-file-access-from-files, but can't figure out how to get it working via the Flex/Flash web controller.

Any help would be greatly appreciated.

• javascript
• apache-flex
• angularjs
• cross-domain
• local-files

Share Follow asked May 10, 2013 at 20:27 xil3xil3 16.4k88 gold badges6767 silver badges103103 bronze badges 2

• I'm confused. Are you building an AIR Desktop app? IF so, then Flex should have no cross domain issues. If you are building a browser based app; what does it mean to use a Flex Application as a container for a web app? – JeffryHouser Commented May 10, 2013 at 21:08
• It's a desktop app, which shouldn't have any issues, but it does. – xil3 Commented May 13, 2013 at 0:10

Add a ment  | 

4 Answers 4

Sorted by: Reset to default 2 +100

If you haven't already done so. Try setting up a crossdomain policy for your application.

The problem is definitely due to CORS, the browser enforces this security constraint. In your case the browser is the flex web control.

You may not be able to get around this problem without using a web server. When the request is made for a file, the Cross Origin Resource Sharing policy will not allow the resource to be loaded without prior authorization from the host serving the file, This authorization es in the form of an http header such as the following:

Access-Control-Allow-Origin: *

Unfortunately, you probably can't. I don't know what engine Flex wraps in it's web controllers, but the reason you are bumping in to this is security.

It's in place for good reason, it's to prevent JS from having direct access to your file system.

I would suggest one of two workarounds.

• Bundle a simple webserver. For example https://stackoverflow./questions/530787/simple-http-web-server

• Modify the AngularJS App (and possibly $routeProvider) to use the new File API

• It's a bit of a hassel but copy all the contents of your template in to the main file in <script type="text/ng-template" id="some-id"></script>

Also, you could try to use $http.jsonp instead of $http.get, although you may have to change angularJS code....

I believe there are at least 2 implementations of rendering a webpage within Flex. I quickly checked the docs for StageWebView and found that the file:// uri scheme allows for Local XMLHttpRequests (basically what $http.get is doing).