在flex (web控件)中使用angularjs时出现跨域错误,并试图加载模板/json(本地文件)

Getting cross-domain errors when using angularjs within flex (web control), and attempting to load templates/json (local files)

本文关键字:加载 文件 json 错误 控件 web flex angularjs      更新时间:2023-09-26

让我给你一点关于我要做的事情的历史。

我正在使用一个Flex应用程序,作为一个web应用程序的容器。所以在这个Flex应用程序中,它有一个web控制器,它加载了一个完整的Angularjs应用程序。所有文件都本地存储在Flex应用程序中。

当我试图运行它时,它无法加载任何模板;它们是用$routeProvider加载的,数据是用$http.get获取的。

核心问题是,它不允许我使用JavaScript拉本地文件,即使它是运行的文件系统(不使用web服务器)。

我也在Chrome上测试了它,并且有相同的问题-给出以下错误。

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

与Chrome,它可以使用--allow-file-access-from-files固定,但无法弄清楚如何通过Flex/Flash web控制器获得它的工作。

如果您还没有这样做。尝试为您的应用程序设置一个跨域策略。

这个问题肯定是由于CORS,浏览器强制了这个安全约束。在你的例子中,浏览器是flex web控件。

如果不使用web服务器,您可能无法解决此问题。当对文件发出请求时,跨域资源共享策略将不允许在没有获得服务该文件的主机的事先授权的情况下加载该资源,该授权以http头的形式出现,如以下所示:

Access-Control-Allow-Origin: *

不幸的是,您可能不能。我不知道Flex在它的web控制器中包装了什么引擎,但是你碰到这个的原因是安全。

设置它有很好的理由,它是为了防止JS直接访问您的文件系统。

我建议以下两种解决方法之一:

  • 捆绑一个简单的web服务器。例如https://stackoverflow.com/questions/530787/simple-http-web-server

  • 修改AngularJS应用(可能还有$routeProvider)来使用新的File API

  • 这有点麻烦,但是将模板的所有内容复制到<script type="text/ng-template" id="some-id"></script>

  • 中的主文件中

另外,您可以尝试使用$http。Jsonp而不是$http。虽然你可能需要修改angularJS代码....

我相信在Flex中至少有两种渲染网页的实现。我很快检查了StageWebView的文档,发现文件://uri方案允许本地xmlhttprequest(基本上是$http。