javascript - AngularJs http post 无法到达本地文件夹

Question

HTML

 <input type="file" file-model="image" multiple/>
<button type="submit" class="btn-sm" ng-click="uploadFile()">Upload</button>

在 html 中，我有一个这样的输入。

JS

app.directive('fileModel', ['$parse', function ($parse) {
   return {
       restrict: 'A',
       link: function(scope, element, attributes) {
           var model = $parse(attributes.fileModel);
           var modelSetter = model.assign;
           element.bind('change', function(){
               scope.$apply(function(){
                   modelSetter(scope, element[0].files[0]);
               });
           });
       }
   };}]);
app.service('fileUpload', ['$http', function ($http) {
this.uploadFileToUrl = function(file, uploadUrl){
    var fd = new FormData();
    fd.append('file', file);
    $http.post(uploadUrl, fd, {
        transformRequest: angular.identity,
        headers: {'Content-Type': undefined}
    });
};}]);
app.controller('storeController',['$http','$scope','fileUpload',function($http,$scope,fileUpload) {

    $scope.uploadFile = function(){
        var file = $scope.image;


        console.log('file is ' );
        console.dir(file);

        var uploadUrl = "././img/";
        fileUpload.uploadFileToUrl(file, uploadUrl);
    };

我正在尝试使用此代码将图像上传到服务器/本地文件夹。但它在控制台上响应 HTTP 404 错误。

它正确地将文件记录到控制台，但是当我尝试将其发布到文件夹时，不起作用。

根目录下有一个名为 img 的文件夹。网址正确，写入网址没有任何语法错误，但它的响应为

POST http://localhost:63342/Project/img/ 404 (Not Found)

控制台出错。

我该怎么做才能让它发挥作用？

Answer 1

您无法从 JavaScript 访问您的文件夹结构，也无法通过 URL 访问它，当然是出于安全原因。

否则任何人都可以编写一点 JavaScript 并对您的文件做任何他们想做的事。

另外，URL 是虚拟路径，而不是物理路径。您可以将文件保存到物理位置，但不能对虚拟位置执行同样的操作。

您没有说明您的应用程序是如何构造的，假设您有一个像 MVC 这样的后端，您可以在那边执行此操作。只需创建一个从 JavaScript 访问的端点，然后让后端代码处理上传的数据。