角度設定ヘッダーイメージロード

Question

私は、サーバーへの認証を求めるすべてのリクエストのHTTPヘッダーに特殊な値を設定する必要があります。

私は、次のコードがあります：JSONのため

<img ng-if="content.image" src="{{img(content.image)}}"> 

と

var app = angular.module('myApp', []); 
app.config(['$httpProvider', function($httpProvider) { 
    $httpProvider.defaults.headers.common['Authorization'] = 'myKey'; 
}]) 
app.controller('customersCtrl', function($scope, $http) { 
    $http.get("http://localhost:8080/myPath") .then(function(response) { 
     $scope.content = response.data; 
    }); 

は、すべてが正常に動作しますが、私はイメージのstrugle要求します。 私には何かヒントはありますか？ 'XMLHttpRequestを' オン 'setRequestHeader' を実行できませんでした：あなたは `setRequestHeader（）` `オープン（）`の呼び出しの前に、 は `キャッチされないInvalidStateErrorがあるでしょうを置く場合

Answer 1

iは

// Image returned should be an ArrayBuffer. 
var xhr = new XMLHttpRequest(); 

    //set Authorization Header 
    xhr.setRequestHeader("Authorization", 'myKey'); 
xhr.open("GET", "https://placekitten.com/500/200", true); 

// Ask for the result as an ArrayBuffer. 
xhr.responseType = "arraybuffer"; 

xhr.onload = function(e) { 
    // Obtain a blob: URL for the image data. 
    var arrayBufferView = new Uint8Array(this.response); 
    var blob = new Blob([ arrayBufferView ], { type: "image/jpeg" }); 
    var urlCreator = window.URL || window.webkitURL; 
    var imageUrl = urlCreator.createObjectURL(blob); 
    var img = document.querySelector("#photo"); 
    img.src = imageUrl; 
}; 

xhr.send();