编写angular项目时,遇到此困难:
angular.js:12011 XMLHttpRequest cannot load file:///E:/angular/imooc/chapter2/bookstore/app/tpls/hello.html. Cross origin requests are only supported for protocol schemes: http, data, chrome, chrome-extension, https, chrome-extension-resource.
 
分析:
因为许多浏览器(包括chrome、opera)限制使用XHR时调用file://协议。
而AngularJS的模板tpl通过XHR下载,而使用本地打开(file://,即直接打开网页),就会导致以上错误。
 
对于该问题,有3种解决方案:
①使用Web服务器运行你的项目(有像很多简单的解决办法https://code.google.com/p/mongoose/或几行的node.js脚本)。
②使用index.html文件嵌入模板<script>指令:参考网址http://docs.angularjs.org/api/ng.directive:script,所以模板不再需要通过XHR加载。
③更改浏览器设置为允许XHR调用过file://协议。例如,这可以在Chrome中完成,像这样:允许谷歌Chrome浏览器使用XMLHttpRequest从本地文件加载URL,推荐方式为"chrome.exe --allow-file-access-from-files"(在命令行中先进入chrome.exe的目录,再执行此命令)。(参考网址:http://stackoverflow.com/questions/4819060/allow-google-chrome-to-use-xmlhttprequest-to-load-a-url-from-a-local-file
 
我自己试了方案③,还是行不通,最终采用方案①中的node,安装http-server(轻量级server),在项目目录下,命令行运行启动http-server,则项目下的文件都可以在服务器上跑,这样angular通过XHR加载模板时,调用的是http协议,打开网页就不会出现上述错误了。
 
可能讲得不太清晰,如有写得不好的,欢迎吐槽留言提问,有更好的解决方案欢迎共享,O(∩_∩)O谢谢!

Angular通过XHR加载模板而限制使用file://(解决方案)的更多相关文章

  1. NOPI导出加载模板

    ListExcel导出(加载模板) /// <summary> /// List根据模板导出ExcelMemoryStream /// </summary> /// <p ...

  2. Lodop 动态加载模板,动态加载数据

    最近需要使用Lodop打印控件,所以就研究了一下,期间从网上找了诸多的东西,基本全是对HTML进行打印的,没有找到我想要的,就只好自己动手丰衣足食. 这篇文章主要讲述的是Lodop与数据的结合使用,官 ...

  3. Freemarker提供了3种加载模板目录的方法

    Freemarker提供了3种加载模板目录的方法 原创 2016年08月24日 14:50:13 标签: freemarker / Configuration 8197 Freemarker提供了3种 ...

  4. MarkDown富文本编辑器怎么加载模板文件

    我们只需要一段加载代码就可以搞定MarkDown加载模板文件. $("#md-demo").bind('click', function () { $.get("/Lib ...

  5. Angular 使用 frame 加载网络资源显示路径不安全问题

    Angular 使用 frame 加载网络资源显示路径不安全问题 做项目的时候,angular 使用 frame 加载网络pdf文件的时候出现 unsafe value 问题,路径不安全.解决办法. ...

  6. iOS开发——加载、滑动翻阅大量图片解决方案详解

    加载.滑动翻阅大量图片解决方案详解     今天分享一下私人相册中,读取加载.滑动翻阅大量图片解决方案,我想强调的是,编程思想无关乎平台限制. 我要详细说一下,在缩略图界面点击任意小缩略图后,进入高清 ...

  7. Xcode6.1标准Framework静态库制作方法。工程转Framework,静态库加xib和图片。完美解决方案。

    http://www.cocoachina.com/bbs/read.php?tid-282490.html Xcode6.1标准Framework静态库制作方法.工程转Framework,静态库加x ...

  8. winform水晶报表编译错误,未能加载文件或程序集"file:///C:\Program Files\SAP BusinessObjects\Crystal Reports for .NET Framewor "

    未能加载文件或程序集“file:///C:\Program Files\SAP BusinessObjects\Crystal Reports for .NET Framework 4.0\Commo ...

  9. 未能加载文件或程序集“file:///C:\Program Files (x86)\SAP BusinessObjects\Crystal Reports for .NET Framework 4.0

    未能加载文件或程序集"file:///C:\Program Files (x86)\SAP BusinessObjects\Crystal Reports for .NET Framewor ...

随机推荐

  1. 【干货分享】流程DEMO-资产请购单

    流程名: 资产请购  业务描述: 流程发起时,会检查预算,如果预算不够,流程必须经过总裁审批,如果预算够用,将发起流程,同时占用相应金额的预算,但撤销流程会释放相应金额的预算.  流程相关文件: 流程 ...

  2. 利用PowerShell复制SQLServer账户的所有权限

    问题 对于DBA或者其他运维人员来说授权一个账户的相同权限给另一个账户是一个很普通的任务.但是随着服务器.数据库.应用.使用人员地增加就变得很枯燥乏味又耗时费力的工作.那么有什么容易的办法来实现这个任 ...

  3. Linux上课笔记--随手记Linux命令

    初次接触Linux就是感觉这系统不够友好不够人性化,因为首先接触电脑就是win,图形化界面什么操作都可以清晰看到.随着更多的接触越来越发现Linux的强大,虽然我只是一个小白,可我就是爱上他了.现在就 ...

  4. Quartz

    Quartz是一个开源的作业调度框架,它完全由Java写成,并设计用于J2SE和J2EE应用中.它提供了巨大的灵 活性而不牺牲简单性.你能够用它来为执行一个作业而创建简单的或复杂的调度. eg: ja ...

  5. Web 前端攻防(2014版)

    在百度 FEX 团队时写的.有次让我写点前端开发中注意的安全规范,结果写着写着就跑题了,写了一堆纯前端实现的攻击方式...当然还有防范措施. 文章就懒得粘过来了~ 直接贴个地址算了:) http:// ...

  6. mono for android 自定义titleBar Actionbar 顶部导航栏 修改 样式 学习

    以前的我是没有做笔记的习惯的,学习了后觉得自己能记住,但是最近发现很多学的东西都忘记了,所有现在一有新的知识,就记下来吧. 最近又做一个mono for android 的项目 这次调整比较大,上次做 ...

  7. html5 audio总结

    前言 html5中对音频,视频播放原生支持.最近做了一个音乐播放器,得益于快过年了,才能抽出一点时间来总结一下.总的来说,html5对audio的支持非常强大, 难怪flash要死.浏览器上装播放插件 ...

  8. 速算1/Sqrt(x)背后的数学原理

    概述 平方根倒数速算法,是用于快速计算1/Sqrt(x)的值的一种算法,在这里x需取符合IEEE 754标准格式的32位正浮点数.让我们先来看这段代码: float Q_rsqrt( float nu ...

  9. 简单例子了解View的事件分发

    什么是事件分发 我们在写自定义ViewGroup或者自定义View的时候经常要处理用户的点击事件,如果我们的View在最底层,他在很多ViewGroup里面,我们如何让我们的点击事件准确传递到View ...

  10. Alcatraz 的安装和删除

    Xcode 所有的插件都安装在目录: ~/Library/Application Support/Developer/Shared/Xcode/Plug-ins/ 你也可以手工切换到这个目录来删除插件 ...