2016-10-03 43 views
0

我想創建服務器上傳圖像和填寫json的形式。我已經嘗試了許多代碼和插件下載到服務器,但我總是得到403錯誤。我的錯誤是什麼?我只使用沒有後端的jQuery或AngularJs。這是一個鏈接:http://salegid.com/dist/最後一個變體:錯誤403當我嘗試上傳文件(圖片)到服務器

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]); 
     }); 
     } 
    } 
    } 
]); 

你能不能幫我,因爲我卡住了。非常感謝。

回答

0

403表示禁止請求。這意味着服務器尚未從您的請求中獲得所需的所有身份驗證憑據。請檢查您的後端,看看需要什麼標題。

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

一個希望,爲什麼請求被禁止可以描述在響應有效載荷的原因(如果有的話),使公衆的服務器。

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

一個希望「隱藏」原始服務器禁止的目標資源的當前存在可能,而不是與404狀態碼未找到響應。

我從您的代碼中看到您沒有設置任何驗證標頭。在AngularJS中,可以使用以下設置應用級驗證標頭:

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

嗨。感謝您的回答。我需要放在那裏'/ * ... * /;'?我有簡單的ftp訪問我的服務器。 –

相關問題