javascript - 如何摆脱 Chrome 中的跨源请求 block ?

标签 javascript angularjs

我对 Angular 非常陌生,尝试在 Angular 指令中使用 templateUrl 。当我尝试在浏览器中运行本地 html 时,它向我显示这些错误 -->

XMLHttpRequest 无法加载文件:///Users/suparnadey/Desktop/workspace/AngularJS/angular_directives/baseChild1.html。仅以下协议(protocol)方案支持跨源请求:http、data、chrome、chrome-extension、https、chrome-extension-resource。

错误:[$compile:tpload] http://errors.angularjs.org/1.5.0-rc.0/ $compile/tpload?p0=baseChild1.html&p1=-1&p2= 错误时(本地) 在文件:///Users/suparnadey/Desktop/workspace/AngularJS/angular_directives/angular.min.js:6:421 在文件:///Users/suparnadey/Desktop/workspace/AngularJS/angular_directives/angular.min.js:149:48 在文件:///Users/suparnadey/Desktop/workspace/AngularJS/angular_directives/angular.min.js:123:217 在 m.$eval (文件:///Users/suparnadey/Desktop/workspace/AngularJS/angular_directives/angular.min.js:137:446) 在 m.$digest (文件:///Users/suparnadey/Desktop/workspace/AngularJS/angular_directives/angular.min.js:135:41) 在 m.$apply (文件:///Users/suparnadey/Desktop/workspace/AngularJS/angular_directives/angular.min.js:138:236) 在文件:///Users/suparnadey/Desktop/workspace/AngularJS/angular_directives/angular.min.js:20:10 在 Object.e [作为调用] (file:///Users/suparnadey/Desktop/workspace/AngularJS/angular_directives/angular.min.js:40:477) 在c处(文件:///Users/suparnadey/Desktop/workspace/AngularJS/angular_directives/angular.min.js:19:440)

Base.html

<!DOCTYPE html>
<html ng-app="iAXApp">

  <head>
    <meta charset="utf-8" />
    <title>IONOS iAX</title>

    <!-- <link rel="stylesheet" type="text/css" href="base.css"> -->

    <script src="angular.min.js"></script>
    <script src="base.js"></script>

  </head>
  <body ng-controller="MainCtrl">

      <main-directive></main-directive>

  </body>

</html>

base.js

var app = angular.module('iAXApp', []);

app.controller('MainCtrl', function($scope) {
    $scope.name = "Publisher";


});

app.directive("mainDirective", function(){
    return{
        restrict: 'E',
        // tamplate: "<h1>{{name}}</h1>",
        templateUrl: "baseChild1.html"
    }
});

baseChild1.html

<h1>{{name}}</h1>

最佳答案

出于标准安全原因,所有现代浏览器都会阻止跨源请求。

安装此 chrome 插件并启用它:chrome plugin to enable cors

如果这不起作用,那么您应该尝试在 http 服务器上运行您的项目。 看看这个答案:http-server to run local projects.

我希望这一定会有所帮助。

关于javascript - 如何摆脱 Chrome 中的跨源请求 block ?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/35335047/

相关文章:

javascript - Javascript 中的多个 If 条件

javascript - Angular .身份未定义

javascript - 如何获取 ng-options 值并在内部值发生变化时触发函数?

AngularJS:ng-repeat 中的 ng-model?

javascript - 从左侧进行切换

javascript - 如何在AngularJS中定义多个主页面?

javascript - 如何将路径更改广播到 AngularJS 应用程序中的所有 View ?

javascript - 将现有的 JS 代码包装为 Angularjs 服务

javascript - AngularJS Controller 不能在嵌套 Controller 中工作

javascript - 对困惑做出回应