【问题标题】:how to save the pdf file in our local project directory using nodejs如何使用nodejs将pdf文件保存在我们的本地项目目录中
【发布时间】:2018-07-24 14:28:04
【问题描述】:

我正在使用 angularjs 进行文件上传。选择后的文件应该保存在我们的本地项目目录中,名为“uploads”。知道的请告诉我怎么做。

【问题讨论】:

  • 您可以使用 npm 模块将文件保存在服务器上。首先请分享您的代码以提供帮助。
  • 请分享你到目前为止所做的...
  • HTML:

标签: javascript angularjs node.js


【解决方案1】:

pdfController.js

    var myApp = angular.module('filedownload', ['ngFileUpload']);

myApp.controller('fileCtrl', function ($scope, fileUploadService, $http) {


    $scope.uploadFile = function () {
        console.log('file modal');
        var file = $scope.myFile;
        var fileReader = new FileReader();
        fileReader.onload = function (fileLoadedEvent) {
            $scope.base64 = fileLoadedEvent.target.result;

            var dataObj = {
                "pdf": $scope.base64
            }

            var config = {
                headers: {
                    'Content-Type': 'application/json'
                }
            }
            $http.post('http://localhost:3001/upload', dataObj, config)
            .then(function (response) {
                console.log('Success response: ', response);
            }, function (response) {
                console.log('Error response: ',response);
            });
        };
        fileReader.readAsDataURL(file);
        
        myApp.service('fileUploadService', function ($http, $q) {

    this.uploadFileToUrl = function (file, uploadUrl) {
        console.log('file in service: ', file);
        console.log('uploadUrl in service: ', uploadUrl);
        //FormData, object of key/value pair for form fields and values
        var fileFormData = new FormData();
        fileFormData.append('file', file);


        var deffered = $q.defer();
        $http.post(uploadUrl, fileFormData, {
            transformRequest: angular.identity,
            headers: { 'Content-Type': 'application/pdf', 'Accept': 'application/pdf' }

        }).then(function (success) {
            console.log('Success: ', success);
            deffered.resolve(success);
        }, function (error) {
            console.log('Error: ', error);
            deffered.resolve(error);
        })

        return deffered.promise;
    }
});

/*
A directive to enable two way binding of file field
*/
myApp.directive('demoFileModel', function ($parse) {
    return {
        restrict: 'A', //the directive can be used as an attribute only

        /*
         link is a function that defines functionality of directive
         scope: scope associated with the element
         element: element on which this directive used
         attrs: key value pair of element attributes
         */
        link: function (scope, element, attrs) {
            var model = $parse(attrs.demoFileModel),
                modelSetter = model.assign; //define a setter for demoFileModel

            //Bind change event on the element
            element.bind('change', function () {
                //Call apply on scope, it checks for value changes and reflect them on UI
                scope.$apply(function () {
                    //set the model value
                    modelSetter(scope, element[0].files[0]);
                });
            });
        }
    };
});

【讨论】:

    【解决方案2】:

    HTML:

    <div class="panel panel-default">
            <div class="panel-body">
                <form>
                    <div class="form-group">
                        <label for="myFileField">Select a file: </label>
                        <input type="file" demo-file-model="myFile" class="form-control" id="myFileField" />
                    </div>
                    <button ng-click="uploadFile()" class="btn btn-primary">Upload File</button>
                </form>
            </div>
        </div>

    【讨论】:

      猜你喜欢
      • 2015-10-25
      • 2023-02-07
      • 2016-04-04
      • 2020-08-25
      • 1970-01-01
      • 1970-01-01
      • 2014-04-15
      • 1970-01-01
      • 1970-01-01
      相关资源
      最近更新 更多