您的位置:首页 > 理论基础 > 计算机网络

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文件就可以获取到数据了。
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签:  angular http 跨域 解决
相关文章推荐