web-dev-qa-db-ja.com

angular.jsファイルを取得net :: ERR_ABORTED

私のエラーがどこにあるかを知るためにあなたの助けが必要です。 springboot（backend）x Angularjs（frontend）を使用しています。 localhost：8080をロードしようとすると、GET（angular.js）ファイルnet :: ERR_ABORTEDを取得します。角度ファイルにも間違いはありません。だからここに私のコードがあります：

//for the springcontroller

@RestController
public class EmployeeController {

    @Autowired
    EmployeeService es;

    @RequestMapping(method=RequestMethod.GET,value="/employees")
    public List<Employee> getAllEmployees(){
        return es.getAllEmployees();
    }

    @RequestMapping(method=RequestMethod.GET,value="/employees/{name}")
    public Employee getEmployee(@PathVariable String name){
        return es.getEmployee(name);
    }

    @RequestMapping(method=RequestMethod.POST,value="/employees")
    public void addEmployee(@RequestBody Employee emp){
        es.addEmployee(emp);
    }

    @RequestMapping(method=RequestMethod.PUT,value="/employees/{name}")
    public void updateEmployee(@RequestBody Employee emp,@PathVariable String name){
        es.updateEmployee(emp,name);
    }

    @RequestMapping(method=RequestMethod.DELETE,value="/employees/{name}")
    public void deleteEmployee(@PathVariable String name){
        es.deleteEmployee(name);
    }
}

私のapp.jsの場合：

(function(){
    'use strict';
    var app = angular.module('myApp',['ngRoute','myApp.controller']);

    app.config(function($routeProvider) {
        $routeProvider
        .when('/', {
            templateUrl: 'index.html',
            controller: 'HomeController'
        });
    });

})();

HomeController.jsの場合

var module = angular.module('myApp.controller',['myApp.service']);
module.controller('HomeController',['$scope','HomeService',
    function($scope,HomeService){
        $scope.EmpData = [];

        var onSuccess = function(response){
            $scope.EmpData = response.data;
        };

        var onError = function(error){
            console.log('Error fetching data...');
        };

        function getAllEmployees(){
            HomeService.getAllEmployees().then(onSuccess,onError)
        };
   } //end of function

]);

HomeService.jsの場合

var module = angular.module('myApp.service',[]);
module.service('HomeService',['$http',function($http){
        function doFetchEmployees(){
            var response = $http.get("/employees");
            return response;
        };
        return{
           getAllEmployees : function(){
               return doFetchEmployees();
        }
    };

    }]);

そして最後に私のindex.htmlについて

<html>
<head>
    <meta name="viewport" content="width=device-width, initial-scale=1">

    <script src="src/main/resources/scripts/angular.min.js"></script>
    <script src ="src/main/resources/scripts/angular-route.min.js"></script>
    <script src="src/main/resources/app.js"></script>
    <script src = "src/main/resources/HomeController.js"></script>
    <script src ="src/main/resources/HomeService.js" ></script>
</head>
<body ng-app="myApp" ng-controller="HomeController">
    <h2>Home</h2>
    <br/>
    <a href="#/index.html">Home</a>
    <br/>
    <table>
    <thead>
    <tr>
        <th>Name</th>
        <th>Email</th>
        <th>Address</th>
        <th>telephone</th>
    </tr>
    </thead>
    <tbody ng-repeat="emp in EmpData">
        <tr>
        <td>{{emp.name}}</td>
        <td>{{emp.email}}</td>
        <td>{{emp.address}}</td>
        <td>{{emp.telephone}}</td>
        </tr>
    </tbody>
    </table>

    <br/>
    <a href="http://localhost:8080/adduser.html">Create User</a>
</body>
</html>

そして、ここにすべての私のエラーメッセージがあります：

GET http://localhost:8080/src/main/resources/scripts/angular-route.min.js net::ERR_ABORTED
localhost/:7 GET http://localhost:8080/src/main/resources/app.js net::ERR_ABORTED
localhost/:5 GET http://localhost:8080/src/main/resources/scripts/angular.min.js net::ERR_ABORTED
localhost/:8 GET http://localhost:8080/src/main/resources/HomeController.js net::ERR_ABORTED
localhost/:9 GET http://localhost:8080/src/main/resources/HomeService.js net::ERR_ABORTED
localhost/:6 GET http://localhost:8080/src/main/resources/scripts/angular-route.min.js net::ERR_ABORTED
localhost/:7 GET http://localhost:8080/src/main/resources/app.js net::ERR_ABORTED
localhost/:8 GET http://localhost:8080/src/main/resources/HomeController.js net::ERR_ABORTED
localhost/:9 GET http://localhost:8080/src/main/resources/HomeService.js net::ERR_ABORTED

私のindex.htmlには、{{emp.names}}->このような出力はありません。私はすでにスクリプトタグを本文に入れようとしましたが、それでも同じです。ハードキャッシュのリロードとクリア。まだ運がありません。最後に、localhost：8080にアクセスしようとすると、Eclipseコンソールのログにこれらの3行が表示されますが、これもエラーの原因ですか？

2017-10-18 10:31:22.115  INFO 9176 --- [nio-8080-exec-1] o.a.c.c.C.[Tomcat].[localhost].[/]       : Initializing Spring FrameworkServlet 'dispatcherServlet'
2017-10-18 10:31:22.115  INFO 9176 --- [nio-8080-exec-1] o.s.web.servlet.DispatcherServlet        : FrameworkServlet 'dispatcherServlet': initialization started
2017-10-18 10:31:22.127  INFO 9176 --- [nio-8080-exec-1] o.s.web.servlet.DispatcherServlet        : FrameworkServlet 'dispatcherServlet': initialization completed in 12 ms

私はこれを理解するのに苦労しています。

ここに画像の説明を入力

javaangularjsspring-mvcspring-boot
5
LogronJ

問題は、angularスクリプトの完全なソースパスでした。

次のように変更しました。

<script src="angular.js""></script>
<script src ="angular-route.min.js"></script>
<script src="app.js"></script>
<script src = "HomeController.js"></script>
<script src ="HomeService.js" ></script>
4
LogronJ
<script src="/src/main/resources/scripts/angular.min.js"></script>
<script src ="/src/main/resources/scripts/angular-route.min.js"></script>
<script src="/src/main/resources/app.js"></script>
<script src = "/src/main/resources/HomeController.js"></script>
<script src ="/src/main/resources/HomeService.js" ></script>

「net :: ERR_ABORTED」を削除するには、スクリプトのsrc属性の前にスラッシュが必要です

0
Dhiraj Belure

spring-mvc.xmlに次の行を追加してみて（プロジェクトのdiff。nameの場合があります）、場所フォルダー名を変更します（リソースでない場合、私の条件ではリソースです）

spring-mvc.xml

<mvc:resources mapping="/resources/**" location="/resources/" cache-period="31556926"/>

* .jsp

<script type="text/javascript" src="${ pageContext.request.contextPath }/resources/script/angular.js"></script>

既に追加されている場合は、キャッシュ期間を追加したことを確認してください

0
Bhushan Dafale

同じ問題がありました。しかし、私は..同じウェブサイトが他のサーバーで動作している場合、なぜ私のサーバー上にないのか..だから..私がやったこと.

そのページに直接アクセスしようとしました。 URLを使用します。

https：// localhost：8080/folder/folder/script.js

https：// localhost：8080/folder/folder/style.css

私はそれらのファイルにアクセスできなかったたびに。

次に、フォルダのアクセス許可を確認しました..700だったので、755に変更しました。

今。すべてがうまく実行されています:)

0
MFarooqi