Angularjs，文件上傳和IE9

在Angularjs/Nodejs應用程序中發生文件上傳問題。Angularjs，文件上傳和IE9

我實施了這個angular-file-upload指令。使用它，文件上傳適用於所有現代瀏覽器，但在IE9中失敗。通過「失敗」我的意思是，它的行爲就像它的工作......我可以記錄文件上傳進度，並看到它逐步達到100％，成功處理程序觸發成功日誌消息（沒有在觸發錯誤處理程序），但該文件永遠不會出現在上傳目錄中（在同一臺計算機上）。

沒有任何控制檯錯誤，我將上傳目錄權限設置爲777以排除此錯誤。

，我發現是關閉...第一，在IE9上傳的文件從來沒有觸發日誌消息我已經把我的uploadPhoto功能，使路線似乎甚至不能打（上傳文件的思想在現代的那些事瀏覽器會觸發這些日誌消息）。另外，在上傳之後，在開發人員工具的網絡面板中，Type的值不應該是text/html，因爲它在下面。

（以下映射到：URL, Method, Result, Type, Received）：

/path/to/upload-dir/filename.jpg GET 200 text/html 20.7kb

這裏是我的文件上傳的處理程序：

$scope.onFileSelect = function ($file) { 
    $scope.ajaxVisible = true; 
    $scope.uploadError = false; 
    var photo = $file[0]; 
    $scope.upload = $upload.upload({ 
     url: '/upload/photo', 
     file: photo, 
     method: 'POST' 
    }).progress(function (evt) { 
     }).success(function (data, status, headers, config) { 
      $scope.toggleUploadForm(); 
      $scope.imgsrc = 'path/to/upload/dir/' + photo.name; 
      User.currentUser.profile_image = photo.name; 
      User.updateUser(); 
      $scope.ajaxVisible = false; 
     }).error(function (err) { 
      $scope.uploadError = true; 
      $scope.ajaxVisible = false; 
     }); 
};

以下是一個路由處理器（expressjs /節點）：

app.post('/upload/photo', userAPI.uploadPhoto);

這是在路由處理程序中引用的uploadPhoto：

exports.uploadPhoto = function(req, res) { 
    logger.info('inside uploadPhoto'); // <-- never reached using IE9 
    var callbacks = {}; 

    callbacks.uploadSuccess = function(){ 
     res.json('success'); 
    }; 

    callbacks.uploadFailure = function(err){ 
     res.json(400, 'Error uploading image.'); 
    }; 

    user.handlePhotoUpload(req.files, callbacks); 
};

其中，終於，雙手的事關到：

this.handlePhotoUpload = function(params, callbacks) { 
     logger.log('inside handlePhotoUpload'); // <-- never reached using IE9 
     if(params.file.mime !== 'image/png' && params.file.mime !== 'image/jpeg' && params.file.mime !== 'image/gif') { 
      callbacks.uploadFailure('Wrong file type'); 
      return; 
     } 
     fs.readFile(params.file.path, function(err, data){ 
      if(err){ 
       callbacks.uploadFailure(err); 
      } 
      var newPath = path.resolve("./path/to/upload/dir/" + params.file.filename); 
      fs.writeFile(newPath, data, function(err) { 
       if(err){ 
        callbacks.uploadFailure(err); 
       } 

       callbacks.uploadSuccess(); 
      }); 
     }); 
    };

該指令利用在後端的FileAPI library和需要Flash來處理上傳過程。我認爲Flash是問題的根源。我錯過了一些東西，但不知道它可能是什麼。

正如我所說，控制檯（在任何瀏覽器中）和文件上傳中的錯誤都顯示出工作的所有跡象，只是該文件從未出現在上傳目錄中。但是，通過IE9上傳時，通過現代瀏覽器上傳的各種日誌語句永遠不會到達。

有關如何解決此問題的建議與解決方案的建議一樣受歡迎。

來源

2014-02-14 Stuart

所以我解決了這個問題。罪魁禍首是在我自己的代碼（自然...嘆氣），是該位：

if(params.file.mime !== 'image/png' && params.file.mime !== 'image/jpeg' && params.file.mime !== 'image/gif') { 
    callbacks.uploadFailure('Wrong file type'); 
    return; 
}

由於該指令使用閃光燈其上傳回退（換舊，糟糕，瀏覽器，如IE < = 9）的mime上傳類型實際上是application/octet-stream ...不是上述代碼中檢查的圖像MIME類型之一。因此，將MIME類型添加到我的支票中，可以通過Flash上傳圖像（因此，IE < = 9）。

此外，我沒有正確使用我的日誌中的錯誤消息「錯誤的文件類型」。我有：

callbacks.uploadFailure = function(err){ 
    res.json(400, 'Error uploading image.'); 
};

正如你所看到的，err不使用，使特定的信息，錯誤信息被記錄錯誤，我只得到了相對通用的時間消失「錯誤上傳的圖像。」

來源

2014-02-16 00:21:41 Stuart

Angularjs，文件上傳和IE9

回答

相關問題