I am newer to Node.js/Express and am attempting a simple file upload to Azure blob storage. I am using AngularJS for the front end form. When I attempt to upload a file I receive the following error:
TypeError: Cannot read property 'myfile' of undefined
I have seen some examples where they are leveraging a node module named multiparty but am unsure if it applies to this basic upload need. Coming from the jQuery/front end JavaScript world, I would need to base64 encode my file for upload in some cases. Is that the case in this instance? Or am I just missing a simple pass through so that Node/Express can read "myfile"?
Since Express has its own router and I have AngularJS routing in place, could that be causing the issue?
Here is my form in my AngularJS view:
<form action="/upload" method="post" enctype="multipart/form-data">
<input type="file" name="myfile" />
<input type="submit" value="Upload" />
</form>
Here is my server.js config. Please note that I am using Azure blob storage:
var express = require('express');
var azure = require('azure-storage');
// Initialize Express App
var app = express();
var port = process.env.port || 1337;
app.use(express.static(__dirname + "/public")).listen(port);
var accessKey = 'mykey';
var storageAccount = 'myblobaccount';
var blobSvc = azure.createBlobService(storageAccount,accessKey);
// Upload to Azure Blob Storate
app.post('/upload', function (req, res) {
var path = req.files.myfile.path;
blobSvc.createBlockBlobFromLocalFile('mycontainer', 'myblob.png', path, function (error, result, response) {
if (!error) {
console.log("Uploaded" + result);
// file uploaded
}
else {
console.log(error);
}
});
});
Update 1:
If I use the following, it generates a POST 200 OK, but when I look at my blob container using something like Azure Storage Explorer, the blob is not there.
app.post('/upload2', function (req, res) {
var multiparty = require('multiparty');
var container = 'mycontainer';
var form = new multiparty.Form();
form.on('part', function (part) {
if (part.filename) {
var size = part.byteCount - part.byteOffset;
var name = part.filename;
blobSvc.createBlockBlobFromStream(container, name, part, size, function (error) {
if (error) {
//res.send(' Blob create: error ');
}
});
} else {
form.handlePart(part);
}
});
form.parse(req);
res.send('OK');
});
答案 0 :(得分:1)
您可以将文件保存在服务器上,然后将其上传到azure。
fs.readFile(req.files.displayImage.path, function (err, data) {
// ...
var newPath = __dirname + "/uploads/uploadedFileName";
fs.writeFile(newPath, data, function (err) {
res.redirect("back");
});
});
或直接管道到azure,如gist
所示答案 1 :(得分:1)
有一个样本&#34; blobuploader&#34;在GitHub / Azure / azure-sdk-for-node https://github.com/Azure/azure-sdk-for-node/tree/master/examples/blobuploader中。
我参考了这个示例和您的代码,在下面做了一个简单的例子:
var azure = require('azure');
var storageAccount = '<Your Storage Account>';
var accessKey = '<Your Access Key>'
var blobSvc = azure.createBlobService(storageAccount, accessKey);
var express = require('express');
var formidable = require('formidable'); // the same node module as Azure sample
var app = express();
app.use(express.static('public')); // contains a form page using the same code as yours
app.get('/', function(req, res) {
res.send('Hello World!');
});
app.post('/upload', function(req, res) {
var form = new formidable.IncomingForm();
form.parse(req, function(err, fields, files) {
var options = {
contentType: files.myfile.type,
metadata: { fileName: files.myfile.name }
};
blobSvc.createBlockBlobFromLocalFile('mycontainer', files.myfile.name, files.myfile.path, options, function(error, result, response) {
if(!error){
// file uploaded
res.send('file uploaded!');
}
});
});
//console.log(req);
});
var server = app.listen(3000, function() {
var host = server.address().address;
var port = server.address().port;
console.log('Example app listening at http://%s:%s', host, port);
});
有效!
最诚挚的问候。