CORS 오류 - $ 컴파일 오류가 발생하고 XMLHttpRequest가 오류를로드 할 수 없습니까?

정확한 URL을 제공하더라도 내 Angular 지시문을 가져올 수없는 이유는 무엇입니까? $ 컴파일 오류가 발생하고 XMLHttpRequest가 오류를로드 할 수 없습니까?

각도 응용 프로그램으로 시작했는데 2 가지 오류가 계속 발생하면서 지시문을 포함 할 수 없습니다.

XMLHttpRequest cannot load/Cross origin requests are only supported for protocol schemes: http, data, chrome, chrome-extension, https, chrome-extension-resource.

나는 조금 연구하고 t가 이해가 안되는 것을 방지하려면 서버를 설정하는 제안이 있었다. 왜 내가 정말 필요하지 않으면 그냥 각도/HTML을 백엔드없이 사용하여 응용 프로그램을 구축 할 수 없습니다. 그 오류의 원인은 무엇입니까? 템플릿의 URL 그러나 incorrectly- 철자 때 분명히 발생

Error: $compile:upload

, 나는 루트에서 (templateUrl를 : 'JS/네비게이션 바/navbar.html') 전체 경로를 제공하거나이 그게 잘못된거야? 감사합니다.

프로젝트 1/index.html을 :

<!DOCTYPE html> 
<html lang="en"> 

<head> 
    <title>page</title> 
    <link rel="stylesheet" type="text/css" href="public/css/style.css" /> 
    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/materialize/0.97.8/css/materialize.min.css"> 

    <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script> 
    <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.6.1/angular.min.js"> </script> 

    <script src="https://cdnjs.cloudflare.com/ajax/libs/angular-ui-router/0.3.2/angular-ui-router.min.js"></script> 

    <script src="https://cdnjs.cloudflare.com/ajax/libs/materialize/0.97.8/js/materialize.min.js"></script> 
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/angular-materialize/0.2.1/angular-materialize.min.js"></script> 
    <script src="js/app.js"></script> 
    <script src="js/navbar/navbar.js"></script> 
</head> 

<body ng-app="myApp"> 
    <header></header> 

    <navbar></navbar> 
    <ui-view></ui-view> 
</body> 

</html>

프로젝트 1은/JS /은

'use strict'; 
var app=angular.module('myApp', ['ui.router', 'ui.materialize']);

프로젝트 1/JS/메뉴 바/navbar.js

'use strict'; 

app.directive('navbar', function() { 
    return { 
     restrict: 'E', 
     templateUrl: 'js/navbar/navbar.html' 
    } 
});

프로젝트 1을 app.js /js/navbar/navbar.html

<div class="navbar navbar-static-top navbar-inverse"> 
    <div class="container"> 
     <ul class="nav navbar-nav"> 
      <li> 
      Hello 
      </li> 
     </ul> 
    </div> 
</div>

출처

2017-01-07 javascripting

항상 각도 앱을 실행하려면 서버를 사용해야합니다. 그렇지 않으면 교차점 오류가 발생할 수 있습니다. 서버의 뜻은

'use strict'; 
app.directive('navbar', function() { 
    return { 
     restrict: 'E', 
     templateUrl: 'navbar.html' 
    } 
});

내가 조금 plunker 그래서 우리는 당신의 코드가 오류없는 확신 한 것으로 당신의 지시를 편집 paths.Then 파일을 resove하는 데 도움이됩니다.

절대 경로 사용에 대해서는 잘 모르겠지만 사용하려고한다면 "C : projects/project1/js/navbar/navbar.js"와 같이 입력해야합니다. http- 서버로 설치하고 사용하기 쉽습니다. 나는 그 질문에 대답하기를 바랍니다.

출처

2017-01-07 04:41:33

감사합니다. 방금 노드 익스프레스 서버를 추가하고 지금 작동합니다. 왜 서버를 만들지 않으면 모난 응용 프로그램이 작동하지 않는지 설명해 주시겠습니까? 만약 jus simple html을 사용했다면, 이것이 효과가있을 것입니다. – javascripting

사실 나는 틀 렸습니다. 아무 것도 작동하지 않고 XMLHttpRequest 오류가 발생하지 않지만 Im 지시문에 의해 발생해야하는 $ 컴파일 오류 (index.html 파일에서 지시문을 제거하면 오류가 사라집니다). 나는 templateUrl을 'navbar.html'을 'nabber.html'으로 바꾸었다. – javascripting

CORS 오류 - $ 컴파일 오류가 발생하고 XMLHttpRequest가 오류를로드 할 수 없습니까?

답변

관련 문제