嘗試將文件（圖像）上傳到服務器時出現錯誤403

Question

我想要創建用於上傳圖像並通過表單填充json的服務器。 我嘗試了許多代碼和插件來下載到服務器，但是我總是收到403錯誤。 我的錯是什么 我只使用了沒有后端的jQuery或AngularJs。 這是一個鏈接： http : //salegid.com/dist/最后一個變體：

的HTML

 <div ng-app="myApp">
      <div ng-controller="MyController">
        <input type="file" fileread="uploadme" />
        <img src="{{uploadme}}" width="100" height="50" alt="Image preview...">
        <br/>
        <p>
          Image dataURI:
        <pre>{{uploadme}}</pre>
        </p>
        <br/>
        <button ng-click="uploadImage()">upload image</button>
      </div>
    </div>

JS

var app = angular.module('myApp', [
  'ngResource',
  'ngRoute'
])
  .config(['$routeProvider', function ($routeProvider) {
  $routeProvider
    .when('/', {
      templateUrl: 'index.html',
      controller: 'MyController',
    })
    .otherwise({
      redirectTo: '/'
    });
  }])
  .controller('MyController', ['$scope', '$http', function($scope, $http) {

    //the image
    $scope.uploadme;

    $scope.uploadImage = function() {
      var fd = new FormData();
      var imgBlob = dataURItoBlob($scope.uploadme);
      fd.append('file', imgBlob);
      $http.post(
        'imageURL',
        fd, {
          transformRequest: angular.identity,
          headers: {
            'Content-Type': undefined
          }
        }
        )
        .success(function(response) {
          console.log('success', response);
        })
        .error(function(response) {
          console.log('error', response);
        });
    };


    //you need this function to convert the dataURI
    function dataURItoBlob(dataURI) {
      var binary = atob(dataURI.split(',')[1]);
      var mimeString = dataURI.split(',')[0].split(':')[1].split(';')[0];
      var array = [];
      for (var i = 0; i < binary.length; i++) {
        array.push(binary.charCodeAt(i));
      }
      return new Blob([new Uint8Array(array)], {
        type: mimeString
      });
    };

  }])
  .directive('fileread', [
  function() {
    return {
      scope: {
        fileread: '='
      },
      link: function(scope, element, attributes) {
        element.bind('change', function(changeEvent) {
          var reader = new FileReader();
          reader.onload = function(loadEvent) {
            scope.$apply(function() {
              scope.fileread = loadEvent.target.result;
            });
          }
          reader.readAsDataURL(changeEvent.target.files[0]);
        });
      }
    }
  }
]);

你能幫我，因為我被困住了。 非常感謝。

Answer 1

403表示禁止請求。 這意味着服務器尚未從您的請求中獲得所需的所有身份驗證憑據。 請檢查您的后端，並查看需要哪些標頭。

403 FORBIDDEN服務器理解了請求，但拒絕授權。

希望公開為什么禁止請求的服務器可以在響應有效負載（如果有）中描述該原因。

如果請求中提供了身份驗證憑據，則服務器認為它們不足以授予訪問權限。 客戶端不應該自動使用相同的憑據重復請求。 客戶端可以用新的或不同的證書重復請求。 但是，出於與憑據無關的原因，可能會禁止請求。

希望“隱藏”當前存在的禁止目標資源的原始服務器可以使用404 Not Found狀態碼來響應。

我從您的代碼中看到您沒有設置任何身份驗證標頭。 在AngularJS中，可以使用以下命令設置應用程序級別的身份驗證標頭：

app.config(['$httpProvider', function($httpProvider) {
  $httpProvider.defaults.headers.common['Authorization'] = /* ... */;
}])