Angular-JWT授權標頭例外

Question

我一直試圖通過angular-upload將Cloudinary集成到我的AngularJS應用程序中。但是，我也遇到過當試圖從我的應用程序上傳此錯誤：

Authorization is not allowed by Access-Control-Allow-Headers

起初我以爲這是一個繁重的問題，因爲我是使用HTTP的服務器來運行Cloudinary示例應用程序，其成功上傳，但我現在意識到這更可能是使用Auth0的angular-jwt實現的結果。這是將授權標頭附加到所有請求，這是cloudinary不接受的。我發現有人用非常類似的問題在這裏不過，我有麻煩搞清楚如何去適應這樣的解決方案，以角智威湯遜

https://github.com/DaftMonk/generator-angular-fullstack/issues/931

。我叫

$httpProvider.interceptors.push('jwtInterceptor');

在我的app.config，但我想它排除請求https://api.cloudinary.com/v1_1/

這是角智威湯遜分佈：

(function() { 


// Create all modules and define dependencies to make sure they exist 
// and are loaded in the correct order to satisfy dependency injection 
// before all nested files are concatenated by Grunt 

// Modules 
angular.module('angular-jwt', 
    [ 
     'angular-jwt.interceptor', 
     'angular-jwt.jwt' 
    ]); 

angular.module('angular-jwt.interceptor', []) 
    .provider('jwtInterceptor', function() { 

    this.urlParam = null; 
    this.authHeader = 'Authorization'; 
    this.authPrefix = 'Bearer '; 
    this.tokenGetter = function() { 
     return null; 
    } 

    var config = this; 

    this.$get = ["$q", "$injector", "$rootScope", function ($q, $injector, $rootScope) { 
     return { 
     request: function (request) { 
      if (request.skipAuthorization) { 
      return request; 
      } 

      if (config.urlParam) { 
      request.params = request.params || {}; 
      // Already has the token in the url itself 
      if (request.params[config.urlParam]) { 
       return request; 
      } 
      } else { 
      request.headers = request.headers || {}; 
      // Already has an Authorization header 
      if (request.headers[config.authHeader]) { 
       return request; 
      } 
      } 

      var tokenPromise = $q.when($injector.invoke(config.tokenGetter, this, { 
      config: request 
      })); 

      return tokenPromise.then(function(token) { 
      if (token) { 
       if (config.urlParam) { 
       request.params[config.urlParam] = token; 
       } else { 
       request.headers[config.authHeader] = config.authPrefix + token; 
       } 
      } 
      return request; 
      }); 
     }, 
     responseError: function (response) { 
      // handle the case where the user is not authenticated 
      if (response.status === 401) { 
      $rootScope.$broadcast('unauthenticated', response); 
      } 
      return $q.reject(response); 
     } 
     }; 
    }]; 
    }); 

angular.module('angular-jwt.jwt', []) 
    .service('jwtHelper', function() { 

    this.urlBase64Decode = function(str) { 
     var output = str.replace(/-/g, '+').replace(/_/g, '/'); 
     switch (output.length % 4) { 
     case 0: { break; } 
     case 2: { output += '=='; break; } 
     case 3: { output += '='; break; } 
     default: { 
      throw 'Illegal base64url string!'; 
     } 
     } 
     return decodeURIComponent(escape(window.atob(output))); //polifyll https://github.com/davidchambers/Base64.js 
    } 


    this.decodeToken = function(token) { 
     var parts = token.split('.'); 

     if (parts.length !== 3) { 
     throw new Error('JWT must have 3 parts'); 
     } 

     var decoded = this.urlBase64Decode(parts[1]); 
     if (!decoded) { 
     throw new Error('Cannot decode the token'); 
     } 

     return JSON.parse(decoded); 
    } 

    this.getTokenExpirationDate = function(token) { 
     var decoded; 
     decoded = this.decodeToken(token); 

     if(typeof decoded.exp === "undefined") { 
     return null; 
     } 

     var d = new Date(0); // The 0 here is the key, which sets the date to the epoch 
     d.setUTCSeconds(decoded.exp); 

     return d; 
    }; 

    this.isTokenExpired = function(token, offsetSeconds) { 
     var d = this.getTokenExpirationDate(token); 
     offsetSeconds = offsetSeconds || 0; 
     if (d === null) { 
     return false; 
     } 

     // Token expired? 
     return !(d.valueOf() > (new Date().valueOf() + (offsetSeconds * 1000))); 
    }; 
    }); 

}()); 

幫助？

Answer 1

jwtInterceptor檢查一個skipAuthorization標誌該請求，並且，如果它被設置爲true不發送授權報頭。

建立你的$ HTTP調用像

$http({ 
    url: 'https://api.cloudinary.com/v1_1/', 
    skipAuthorization: true, 
    method: 'POST', 
    // ... etc 
}).then(successCallback, errorCallback); 

- 更多的angular-jwt Docs