angular的http请求本地文件出现跨域提醒

来源：互联网发布：金九银十原油利多数据编辑：程序博客网时间：2024/05/22 13:02

用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文件就可以获取到数据了。

阅读全文

1 0