1

node.jsで作成されたサーバーサイドに投稿する2つのファイルとテキスト領域を含むフォームがあり、node/express(4.0)のアップロード部分を処理します。multerを使用しました。angular-file-uploadでリレーしたAngular側からのアップロードを処理する間

私は、実際に機能するという事実をテストするためだけに、現時点ではエクスプレス部分を非常にシンプルに保とうとしています

/// ノード JS エクスプレス

        app.use(multer({    dest: __dirname + '/public/uploads/', 
                            rename: function (fieldname, filename) {
                                return filename; //.replace(/\W+/g, '-').toLowerCase() + Date.now()
                            }
                      }))

///角度

        cmsApp.controller("MyController", ['$scope', '$location', '$upload', function($scope, $location, $upload) {
            $scope.title = $location;


            //$scope.saveMiscs = function() {
            $scope.submit = function() {
              console.log("saving miscs");
              var file_1 = $scope.formfile1;
              var file_2  = $scope.formfile2;

              //console.log('file is ', JSON.stringify(file_regole), " + " + JSON.stringify(file_statuto));
              $scope.upload = $upload.upload({
                    url: '/api/misc/filupload1', //upload.php script, node.js route, or servlet url
                    file: file_1,       // or list of files ($files) for html5 only
                  }).progress(function(evt) {
                    console.log('percent: ' + parseInt(100.0 * evt.loaded / evt.total));
                  }).success(function(data, status, headers, config) {
                    // file is uploaded successfully
                    console.log("upload completed: ", data);
                  });
            };


            $scope.onFileSelect = function($files) {
                $scope.files = angular.copy($files);
                console.log($scope.files); // Returns my object
            }


            $scope.setFiles = function(element) {
            $scope.$apply(function($scope) {
                console.log(element.files);
                if(element.id == "form__file1")
                  file_1 = element.files;
                else if(element.id == "form__file2")
                  file_2 = element.files;
              });
            };

        }]);

/// Angular HTML

    <form id="modify_form" ng-submit="submit()" ng-controller="MyController" enctype="multipart/form-data">

        <div class="intro_detail" style="margin-top:36px;">
            <div class="dotted blue"></div>
            <div class="box_title">Documents</div>
            Load file 1 here<br>
            <input type="file" id="form_1_fld" class="" name="" 
                    onchange="angular.element(this).scope().setFiles(this);" ng-model="file_1"/><br>
            <br>
            Load file 2 here<br>
            <input type="file" id="form_2_fld" class="" name="" 
                    onchange="angular.element(this).scope().setFiles(this);" ng-model="file_1"/>
            <div class="dotted spacer_small blue"></div>
        </div><!-- END INTRO DETAIL -->

        <div class="form_viewport">

            <div class="full_container">
                <label>Write something in here:</label><br>
                <textarea ng-model="text_desc" id="form__desc"></textarea>
            </div>

            <div class="clearfix"></div>

            <div class="full_container" style="text-align:center; margin-top:50px;">
                <input type="button" class="submit_cancel" value="Cancel" />
                <input type="submit" class="submit_save" value="Save" />
            </div>


        </div><!-- END FORM VIEWPORT -->

    </form>

アンギュラーを含まない単純なフォームで投稿しようとすると、「ファイル」フィールドが1つある単純なマルチパートフォームで、nodejs/multerはファイルを取得し、アップロードは問題ありませんが、エクスプレスを含むこのシナリオを使用すると、サーバーにファイルが投稿されていないようです。

4

0 に答える 0