0

angular.min.jsを読み込んでいるときにコンソールにエラーが表示されます(エラー:制限付きURIへのアクセスが拒否されました)。私はそれが同じ起源の政策のためだと思うが、私はこれには新しく、この仕事をどうやって作るのか分からない。サーバーなどをセットアップする必要がありますか?エラー:制限付きURIへのアクセスが拒否されました - 同じ発信元ポリシーですか?

<!DOCTYPE html> 
<html lang="en" ng-app="myApp" ng-cloak> 
    <head> 
    <meta charset="utf-8"> 
    <title>my app</title> 
    <meta name="description" content=""> 
    <meta name="viewport" content="width=device-width, initial-scale=1"> 
    <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.5.7/angular.min.js"></script> 
    <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.5.7/angular-animate.min.js"></script> 
    <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.5.7/angular-aria.min.js"></script> 
    <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.5.7/angular-messages.min.js"></script> 
    <script src="https://ajax.googleapis.com/ajax/libs/angular_material/1.1.0-rc.5/angular-material.min.js"></script> 
    <link rel="stylesheet" href="https://ajax.googleapis.com/ajax/libs/angular_material/1.1.0-rc.5/angular-material.min.css">  
    <link rel="stylesheet" href="./style.css" type="text/css"> 
    <link href='https://fonts.googleapis.com/css?family=Open+Sans:400,700,400italic, 700italic' rel='stylesheet' type='text/css'> 
    </head> 
    <body layout="column" ng-controller="myctrl"> 
     <h1>Purchase Order</h1> 
     <div> 
     <div class="row"> 
      <label>Name</label> 
      <label>Price</label> 
      <label>Quantity</label> 
      <label>Total</label> 
     </div> 
     <div class="row"> 
      <input/> 
      <input/> 
      <ol class="completions"></ol> 
      <label>0</label> 
      <label>0</label> 
     </div> 
     <div class="row"> 
      <input/> 
      <input/> 
      <ol class="completions"> 
      <li>Suggestion 1</li> 
      <li>Suggestion 2</li> 
      <li>Suggestion 3</li> 
      </ol> 
      <label>0</label> 
      <label>0</label> 
     </div> 
     </div> 
     <p> 
     </p> 
    <script src="../src/main.js"></script> 
    </body> 
</html> 

とJS:あなたのような

var myApp = angular.module('myApp', ['ngMaterial']); 

     myApp.controller('myctrl', ['$scope', '$http', function($scope, $http){ 
      $http({ 
       method: 'GET', 
       url: 'api.js' }) 
       .then(function(response) { 
       $scope.products = response.data; 
      }, function(error) { 
       displayError("Something went wrong"); 
      }); 
     }]); 
+0

何、>エラーになる同じ

UPDATE

からhttp://yourdomain.com/api.js:あなたはテストのために、ブラウザ上の完全なURLを渡すことでテストすることができます行は正確にエラーをスローしますか?そして、あなたはapi.jsでロードしようとしていますか? – Kindzoku

+0

この[post](http://stackoverflow.com/questions/26805093/dynamic-directive-loading-using-angularjs-error-access-to-restricted-uri-deni)が役立つかもしれません。もちろん、サーバーに展開する必要があります。 – Saad

+0

"https://ajax.googleapis.com/ajax/libs/angularjs/1.5.7/angular.min.js"はエラー – summerfreeze

答えて

2

ルックは、クロスサイト・ドメインについての問題を抱えて

は、ここに私のHTMLです。 サーバーサイトの設定に属しています。お使いのサーバが指定したドメインからのクライアントコール

例許可する必要があります意味:あなたはあなたのコードのクライアント(angularjs、jsが...)

http://example.com/foo.html に置き、http://apidomain.com/api/testでAPIを呼び出す場合。

クロスサイト発行します私はあなたのURLに見たときにあなたがいない設定APIサーバー場合は、正しい

をたまたましかし:api.js - >が問題になる可能性があり、サーバーは、APIへの直接取得することができないので、ここにあります.js。あなたはJSONからデータを取得したい場合は、単に使用$ HTTPサービス

$http.get('yourFolder/data.json').then(function(response) { 
     $scope.data = response.data; 
     }); 
+0

はい、api.jsが問題です。私は今でもAPIで何をしていますか?多分それをどこかにホストしますか? – summerfreeze

+0

私はあなたがあなたのApiをどの言語で書くのか分かりません:それは:Java、.Netです。 Php、NodeJs ...あなたのAPI言語によれば、サーバーになるように設定が違います –

+0

JSONならどうなりますか? – summerfreeze