将文件从客户端移动到服务器

时间:2016-08-27 17:02:47

标签: javascript angularjs node.js express upload

我有一个html上传表单和一个控制它的角度控制器。在控制器中,我发现了如何上传文件但我的问题是如何将这些文件移动/上传到服务器?我检查了multer但是我不相信这会在我的情况下起作用,因为我不能在客户端需要它。这是我的控制器目前的样子:

  app.controller('uploadCtrl', function($scope, $location, $http){

  $scope.enableSubmitButton = false;
  $scope.fileSizeError = false;
  var selectedFiles = [];

  //get files selected
  $scope.getFiles = function($files){

    selectedFiles = $files;

    //display upload button if there is a valid file to upload
    if(selectedFiles.length !== 0){
      $scope.enableSubmitButton = true;
    }

  }

  $scope.upload = function(){

    if($scope.enableSubmitButton){

      //disable to prevent clicking again
      $scope.enableSubmitButton = false;

      //correctly shows the file data
      console.dir(selectedFiles);


     //upload files to server
     //What should I do here?

    }

  }

});

1 个答案:

答案 0 :(得分:-1)

这是一个例子

步骤:1 初始化您的应用

import Tkinter, tkFileDialog ,tkMessageBox
from fileManagerModule import fileManager
def load():
    global myFile,flag,msg
    flag=True
    options = {}
    options["title"] = "choose a text File"
    options['initialdir'] = '~/'    
    fileName = tkFileDialog.askopenfilename(**options)
    myFile = fileManager(fileName)
    myText.delete("1.0", Tkinter.END)
    try:
        line = myFile.readFromFile()
        myText.insert("1.0", line)
    except:
        msg=Tkinter.Tk()

        msg.withdraw()

        msg=tkMessageBox.showerror("Error","please choose file to load")

步骤:2 制作名为 var myApp = angular.module('myApp', []); 的指令。它可以使用链接功能和绑定fileModel属性,以便在文件上载时执行更改功能 然后使用文件object.simple设置change它解析文件对象

model scope

步骤:3 创建一个fileUpload myApp.directive('fileModel', ['$parse', function ($parse) { return { restrict: 'A', //define attribute link: function(scope, element, attrs) { var model = $parse(attrs.fileModel); var modelSetter = model.assign; element.bind('change', function(){ scope.$apply(function(){ modelSetter(scope, element[0].files[0]); }); }); } }; }]); ,以便使用service

将文件传输到服务器
$http

步骤:4 使用 myApp.service('fileUpload', ['$http', function ($http) { this.uploadFileToUrl = function(file, uploadUrl){ var fd = new FormData(); //FormData fd.append('file', file); //file object $http.post(uploadUrl, fd, { transformRequest: angular.identity, headers: {'Content-Type': undefined} //define req headers }) .success(function(){ }) .error(function(){ }); } }]); 并调用其fileUpload service函数并传递文件对象和网址

uploadFileToUrl