ファイルをディレクトリにアップロードしようとしていますが、RESTful-APIパラダイムを使用してセットアップする方法を理解できません。FileUpload usings node.js angular restful-apis
I持って、次のクライアント側のコード
クライアント/ Testarea.html
<input type="file" name="fileUpload" value="fileUpload" placeholder="none" file-model="myFile" />
<br>
<br>
<button ng-click='uploadFile()'>Upload</button>"
クライアント/ Testarea.controller.js
$scope.uploadFile = function()
{
var file = $scope.myFile;
var uploadUrl = "/multer";
var fd = new FormData();
fd.append = ('file', file);
TestareaSvc.uploadFileSrv(uploadUrl, fd,
{
transformRequest: angular.identity,
headers:
{
"Content-Type": undefined
}
});
};
指令
angular
.module('test')
.directive('fileModel', ['$parse',
function ($parse)
{
return {
restrict: 'A',
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]);
});
});
}
};
}]);
CLIENトン/ Testarea.service.js
this.uploadFileSrv = function(uploadURL, fd, obj)
{
console.log('TestareaSvc - uploadFileSrv');
function uploadFileSrvSuccess(response)
{
console.log('Upload File Success');
return response;
}
function uploadFileSrvFailed(error)
{
console.log('Upload File Failed');
return error;
}
var doc = new Object();
doc.uploadURL = uploadURL;
doc.fd = fd;
doc.obj = obj;
return $http.post('/api/testareas', doc)
.then(uploadFileSrvSuccess)
.catch(uploadFileSrvFailed);
};
Serverコード
API/Testarea.controller.js
//* Using Rails-like standard naming convention for endpoints.
//* GET /api/testareas -> index
//* POST /api/testareas -> create
//* GET /api/testareas/:id -> show
//* PUT /api/testareas/:id -> update
//* DELETE /api/testareas/:id -> destroy
var multer = require('multer');
var storage = multer.diskStorage({
destination: function (req, file, cb) {
cb(null, './uploads/')
},
filename: function(req, file, cb) {
cb(null, file.originalname + '-' + Date.now() + ".txt")
}
});
var upload = multer({ storage: storage });
// Gets a list of Testareas
exports.index = function(req, res) {
console.log(‘index’)
};
// Gets a single Testarea from the DB
exports.show = function(req, res) {
console.log('exports.show');
};
// Creates a new Testarea in the DB
exports.create = function(req, res) {
console.log('exports.create');
};
// Updates an existing Testarea in the DB
exports.update = function(req, res) {
console.log('exports.update');
};
// Deletes a Testarea from the DB
exports.destroy = function(req, res) {
console.log('exports.destroy');
};
function handleError(res, err) {
console.log('handleError');
return res.status(500).send(err);
}
client.testarea.htmlは、ユーザーにWebページの情報を表示しますユーザは、ファイルマネージャからファイルを選択する。ファイルを選択すると、指定したフォルダ(/ multer)にファイルがアップロードされます。
クライアント/ testarea.htmlは、クライアント/ testarea.controller.jsと通信します。 client.testarea.controller.jsには、ファイル属性の抽出に必要なディレクティブが含まれています。 client/testarea.controller.jsは、client/testarea.service.jsと通信します。フォルダはWebサーバー上に存在するため。 client/testarea.service.jsはapi/testarea.controller.jsと通信します。 api/testarea.controllerがファイルをwebserverにアップロードします。
クライアント/ testarea.htmlから必要な情報をapi/testarea.controller.jsに伝えることができます。私の最初の質問は、「さまざまなスクリプトに適切な情報を渡していますか?」です。しかし、大きな問題は、ファイルをアップロードすることができないということです。私はapi/testarea.controller.jsを取得し、適切な情報を確実に渡す方法を知らない。
私はmulterを使用してファイルアップロードの例を多数見てきましたが、すべての例でクライアントサイドコーディングを使用しました。 APIコントローラーに制御を渡す単一の例が見つかりませんでした。
TIA
この質問への追加として、私は私がアップロードディレクトリの場所を確認する方法について説明を得ることができます。 TIA –