如何在AngularJS1.6.7中使用拦截器？_Angularjs

如何在AngularJS1.6.7中使用拦截器？

angularjs

如何在AngularJS1.6.7中使用拦截器？,angularjs,Angularjs,我正在尝试使用AngularJS1.6.7创建一个小应用程序，并尝试使用拦截器来拦截应用程序的http调用。以下是拦截器的示例： angular.module('movieApp').factory('MovieInterceptor',function(){ var obj = {}; obj.request=function(config){ config.url=config.url+'&api_key=dad844342353fc72ac9b99

我正在尝试使用AngularJS1.6.7创建一个小应用程序，并尝试使用拦截器来拦截应用程序的http调用。以下是拦截器的示例：

angular.module('movieApp').factory('MovieInterceptor',function(){
    var obj = {};
    obj.request=function(config){
        config.url=config.url+'&api_key=dad844342353fc72ac9b99590cb7c78d';
        console.log(config.url);
        return config;
    }
    obj.requestError=function(config){
        console.log(config);
        return config;
    }
    obj.response=function(config){
        console.log(config);
        return config;
    }
    obj.responseError=function(config){
        console.log(config);
        return config;
    }

});
angular.module('movieApp').config(function($httpProvider){
$httpProvider.interceptors.push('MovieInterceptor');
})

以下是进行http调用的服务代码：

angular.module('movieApp').service("MovieService",function($http,$q){
      this.getPopularMovies=function(){
        var obj=$q.defer();
        $http.get('https://api.themoviedb.org/3/discover/movie?sort_by=popularity.desc').then(function(res){
            console.log('The response is ',res.data.results)
            obj.resolve(res.data.results);
        })
        .catch(function(err){
            console.log('the error is ',err)
            obj.reject(err);
        })
        return obj.promise;
    }
})

最后一个是Html文件，仅表明我已包括InReceptor文件和服务文件：

<html>
<head>
<script src="./bower_components/angular/angular.min.js"></script>
<script src="./bower_components/angular-ui-router/release/angular-ui-router.js"></script>
<script src="./assests/js/app.js"></script>

 <script src="./assests/js/interceptors/movie.interceptor.js"></script>
<script src="./assests/js/services/movie.service.js"></script>

<script src="./assests/js/routing.js"></script>

<link rel="stylesheet" href="./bower_components/bootstrap/dist/css/bootstrap.min.css"></link>
<link rel="stylesheet" href="./assests/style.css"></link>
</head>
<body ng-app="movieApp">
<div class="container">

<div class="row">
<div class="col-lg-12">
<div class="jumbotron">
<h1>Search Movie</h1>
<form>
<div class="col-lg-10">
<input class="form-control" type="text" name="search" placeholder="search"> 
</div>
<div class="col-lg-2">
<button class="btn btn-primary">Search</button>
</div>
</form>
</div>
</div>
</div>

<div class="col-lg-12">
<a ui-sref="home">Home</a>
<ui-view></ui-view>
</div>



</body>
</html>


搜索电影
搜寻
在角上。js:88
at Object.$get（angular.js:4932）
在Object.invoke（angular.js:5097）
在angular.js:4884
在Object.d[as get]（angular.js:5038）
在angular.js:11641
在p（angular.js:408）
在Ff.$get（angular.js:11639）
在Object.invoke（angular.js:5097）
在angular.js:4884
你知道怎么解决这个问题吗？
如有任何建议，将不胜感激。
谢谢
只需点击错误——它解释了错误
从工厂构造函数返回一些东西是很重要的
angular.module('movieApp').factory('MovieInterceptor',function(){
    var obj = {};
    obj.request=function(config){
        config.url=config.url+'&api_key=dad844342353fc72ac9b99590cb7c78d';
        console.log(config.url);
        return config;
    }
    obj.requestError=function(config){
        console.log(config);
        ̶r̶e̶t̶u̶r̶n̶ throw config;
    }
    obj.response=function(config){
        console.log(config);
        return config;
    }
    obj.responseError=function(config){
        console.log(config);
        ̶r̶e̶t̶u̶r̶n̶ throw config;
    }

   //IMPORTANT
    ̲r̲e̲t̲u̲r̲n̲ ̲o̲b̲j̲;̲    
});

同样重要的是重新抛出错误，否则它们将从拒绝变成成功的承诺
另外，不要使用：
有关更多信息，请参见
错误提示，提供程序“MovieInterceptor”必须从$get factory方法返回一个值。
如果您遵循链接并阅读它。只需添加returnobj在你的工厂里，同样，请阅读：你的拦截器坏了：它将每个错误转化为成功。阅读，因为你使用的是承诺反模式。使用链接。只需点击错误——它解释了错误。
angular.module('movieApp').service("MovieService",function($http,$q){
      this.getPopularMovies=function(){
        ̶ ̶v̶a̶r̶ ̶o̶b̶j̶=̶$̶q̶.̶d̶e̶f̶e̶r̶(̶)̶;̶            
         ͟r͟e͟t͟u͟r͟n͟ $http.get('https://api.themoviedb.org/3/discover/movie?sort_by=popularity.desc').then(function(res){
            console.log('The response is ',res.data.results)
            ̶o̶b̶j̶.̶r̶e̶s̶o̶l̶v̶e̶(̶r̶e̶s̶.̶d̶a̶t̶a̶.̶r̶e̶s̶u̶l̶t̶s̶)̶;̶
            return res.data.results;
        })
        .catch(function(err){
            console.log('the error is ',err)
            ̶o̶b̶j̶.̶r̶e̶j̶e̶c̶t̶(̶e̶r̶r̶)̶;̶
            throw err;
        })
        ̶r̶e̶t̶u̶r̶n̶ ̶o̶b̶j̶.̶p̶r̶o̶m̶i̶s̶e̶;̶
    }
})