angular的http请求本地文件出现跨域提醒
2017-08-31 18:00
246 查看
用angular测试请求本地的json数据,请求出错,提示跨域,我的代码如下:
<!DOCTYPE html>
<html>
<head lang="en">
<meta charset="UTF-8">
<title>angular使用http请求数据</title>
<script src="https://cdn.bootcss.com/angular.js/1.4.6/angular.min.js"></script>
</head>
<body ng-app="app" ng-controller="testCtrl">
<h1>angular使用http请求数据</h1>
请求结果:{{resultData}}
<script>
var module=angular.module("app",[]);
module.controller("testCtrl",function($scope,$http){
$http({
method:"GET",
url:"test.json"
}).then(function successCallback(res){
$scope.resultData=res.data;
}).then(function errorCallback(res){
$scope.resultData="请求出错啦";
});
});
</script>
</body>
</html>
test.json代码如下:
{
"sites": [
{
"Name": "Google",
"Url": "www.google.com",
"Country": "USA"
},
{
"Name": "Facebook",
"Url": "www.facebook.com",
"Country": "USA"
},
{
"Name": "微博",
"Url": "www.weibo.com",
"Country": "CN"
}
]
} 原因:因为浏览器为了出于安全考虑把请求本地视为跨域请求。
解决办法:
第一步:关闭谷歌浏览器;
第二步:ctrl+r输入cmd进入控制台,输入如下命令:
"C:\Program Files (x86)\Google\Chrome\Application\chrome.exe" --allow-file-access-from-files
注意:一定要先关闭浏览器才生效哦;然后再打开html文件就可以获取到数据了。
<!DOCTYPE html>
<html>
<head lang="en">
<meta charset="UTF-8">
<title>angular使用http请求数据</title>
<script src="https://cdn.bootcss.com/angular.js/1.4.6/angular.min.js"></script>
</head>
<body ng-app="app" ng-controller="testCtrl">
<h1>angular使用http请求数据</h1>
请求结果:{{resultData}}
<script>
var module=angular.module("app",[]);
module.controller("testCtrl",function($scope,$http){
$http({
method:"GET",
url:"test.json"
}).then(function successCallback(res){
$scope.resultData=res.data;
}).then(function errorCallback(res){
$scope.resultData="请求出错啦";
});
});
</script>
</body>
</html>
test.json代码如下:
{
"sites": [
{
"Name": "Google",
"Url": "www.google.com",
"Country": "USA"
},
{
"Name": "Facebook",
"Url": "www.facebook.com",
"Country": "USA"
},
{
"Name": "微博",
"Url": "www.weibo.com",
"Country": "CN"
}
]
} 原因:因为浏览器为了出于安全考虑把请求本地视为跨域请求。
解决办法:
第一步:关闭谷歌浏览器;
第二步:ctrl+r输入cmd进入控制台,输入如下命令:
"C:\Program Files (x86)\Google\Chrome\Application\chrome.exe" --allow-file-access-from-files
注意:一定要先关闭浏览器才生效哦;然后再打开html文件就可以获取到数据了。
相关文章推荐
- 如何将本地的文件变成http请求获取
- 解析HTTP POST方式请求的xml数据、本地XML文件数据, 并返回JSON字符串
- IIS7.5配置Asp.net项目出现HTTP 错误 404.17 - Not Found 请求的内容似乎是脚本,因而将无法由静态文件处理程序来处理。
- 全栈工程师之路-中级篇之小程序开发-第二章第四节小程序http请求与请求本地json文件
- HTTP请求json文件出现中文乱码的解决方案
- iis部署网站(asp.net或者wcf)出现HTTP 错误 404.17 - Not Found 请求的内容似乎是脚本,因而将无法由静态文件处理程序来处理。
- 解决在运行配置文件中指定的扩展时出现异常。 ---> System.Web.HttpException: 超过了最大请求长度问
- ajax加载本地html文件出现 XMLHttpRequest cannot load的问题
- 在运行配置文件中指定的扩展时出现异常。 System.Web.HttpException: 超过了最大请求长度。
- mac上的chrome解决跨域问题(打不开本地文件请求)
- Angular开发(十四)-利用angular的http转发、即代理http 请求,处理项目中请求跨域的问题
- $http——ajax跨域请求的angular方式
- Win7中IIS出现“HTTP 错误 404.17 - Not Found 请求的内容似乎是脚本,因而将无法由静态文件处理程序来处理。”错误(已解决)
- chrome本地文件加载跨域请求
- Win7中IIS出现“HTTP 错误 404.17 - Not Found 请求的内容似乎是脚本,因而将无法由静态文件处理程序来处理。
- 配置scut协议生成器的时候需要配置iis,出现常见错误——Win7中IIS出现“HTTP 错误 404.17 - Not Found 请求的内容似乎是脚本,因而将无法由静态文件处理程序来处理。
- http请求本地文件,路径中含有空格的处理 QT
- 浏览器拦截跨域请求处理方法(已阻止跨源请求:同源策略禁止读取远程资源) 原文地址:http://my.oschina.net/lichaoqiang/blog/317823 在浏览器请求中,出现跨
- Win7中IIS出现“HTTP 错误 404.17 - Not Found 请求的内容似乎是脚本,因而将无法由静态文件处理程序来处理。”错误(已解决)
- Angular 通过 $http.post 写入本地 JSON 文件