uploading files using express.js and node, limiting extensions - image

I'm working on handling file uploads using express.js and node, and have the basic functionality working. What I need is to implement some security measures -- namely, to limit uploads to certain formats (PNG, JPEG). Is there an easy way to only allow certain formats? Would it go in the body-parser?
app.use(express.bodyParser({
uploadDir: __dirname + '/public/uploads',
keepExtensions: true }));
app.use(express.limit('4mb'));
Are there any other security measures that I should take into account? Is it generally a good idea to wipe EXIF data from the image?
Thanks,
Ben

According to the documentation for connect's bodyParser, any options are also passed to formidable, which does the actual form parsing.
According to formidable docs, you can pass your own onPart handler:
incomingForm.onPart(part)
You may overwrite this method if you are interested in directly accessing the multipart stream. Doing so will disable any 'field' / 'file' events processing which would occur otherwise, making you fully responsible for handling the processing.
incomingForm.onPart = function(part) {
part.addListener('data', function() {
// ...
});
}
If you want to use formidable to only handle certain parts for you, you can do so:
incomingForm.onPart = function(part) {
if (!part.filename) {
// let formidable handle all non-file parts
incomingForm.handlePart(part);
}
}
Taken together, you should be able to do something like this:
function onPart(part) {
if(!part.filename || part.filename.match(/\.(jpg|jpeg|png)$/i)) {
this.handlePart(part);
}
}
app.use(express.bodyParser({onPart: onPart});
Warning: I haven't tested any of this.

I found a potential solution:
In your middleware,
if (req.files[key].type != 'image/png' && req.files[key].type != 'image/jpeg'){
res.send(403);
} else {
next();
}
update: This doesn't actually stop the file from uploading, though.

Related

Cypress: using this vs # for fixtures?

So on Cypress's documents it mentions (here: https://docs.cypress.io/guides/core-concepts/variables-and-aliases#Sharing-Context):
Keep in mind that there are use cases for both approaches because they
have different ergonomics.
When using this.users we have access to it synchronously, whereas when
using cy.get('#users') it becomes an asynchronous command.
You can think of the cy.get('#users') as doing the same thing as
cy.wrap(this.users).
This is in regards to using this.fixture vs using cy.get('#fixture') for example (I realize there are other use cases but lets just stick with fixtures for now)
I realize it explains sync vs async above....but when would you WANT to use a synchonous this to access a fixture vs not? Maybe within a then function/callback? (If you needed to access a fixture within a response to a request or something?
One thing it does is reduce callback nesting when multiple aliases are required in one expression, for example
cy.wrap('1').as('a')
// more actions
cy.wrap('2').as('b')
// more actions
cy.wrap('3').as('c')
// assert all values
cy.get('#a').then(a => {
cy.get('#b').then(b => {
cy.get('#c').then(c => {
expect(a+b+c).to.eq(d)
})
})
})
compare to
cy.wrap('1').as('a')
// more actions
cy.wrap('2').as('b')
// more actions
cy.wrap('3').as('c')
// assert all values
cy.then(function() {
expect(this.a + this.b + this.c).to.eq(d)
})

how the nativescript radlist view load on demand works

This might not be the question but it was the list of doubts which comes when learning native script from scratch.
I had a 1000 or more list of data stored in data table. know i want to display it on a list view but i don't want to read all the data at once. because i have images stored in other directory and want to read that also. So, for 20 to 30 data's the performance is quite good. but for 1000 data it is taking more than 15 minutes to read the data as well as images associated with it. since i'm storing some high quality images.
Therefore i decided to read only 20 data's with their respective images. and display it on list. know when user reaches the 15th data of the list. i decided to read 10 more data from the server.
know when i search this i came across "RadListView Load on Demand".
then i just looked at the code below.
public addMoreItemsFromSource(chunkSize: number) {
let newItems = this._sourceDataItems.splice(0, chunkSize);
this.dataItems.push(newItems);
}
public onLoadMoreItemsRequested(args: LoadOnDemandListViewEventData) {
const that = new WeakRef(this);
const listView: RadListView = args.object;
if (this._sourceDataItems.length > 0) {
setTimeout(function () {
that.get().addMoreItemsFromSource(2);
listView.notifyLoadOnDemandFinished();
}, 1500);
args.returnValue = true;
} else {
args.returnValue = false;
listView.notifyLoadOnDemandFinished(true);
}
}
In nativescript if i want to access binding element xml element. i must use observables in viewmodel or exports.com_name on associated js file.
but in this example it is started with public..! how to use this in javascript.
what is new WeakRef(this) ?
why it is needed ?
how to identify user has scrolled to 15 data, as i want to load more data when he came at 15th data.
after getting data how to update array of list and show it in listview ?
Finally i just want to know how to use load on demand
i tried to create a playground sample of what i have tried but it is giving error. it cannot found module of radlistview.
Remember i'm a fresher So, kindly keep this in mind when answering. thank you,
please modify the question if you feel it is not upto standards.
you can check the updated answer here
https://play.nativescript.org/?template=play-js&id=1Xireo
TypeScript to JavaScript
You may use any TypeScript compiler to convert the source code to JavaScript. There are even online compilers like the official TypeScript Playground for instance.
In my opinion, it's hard to expect ES5 examples any more. ES6-9 introduced a lot of new features that makes JavaScript development much more easier and TypeScript takes JavaScript to next level, interpreter to compiler.
To answer your question, you will use the prototype chain to define methods on your class in ES5.
YourClass.prototype.addMoreItemsFromSource = function (chunkSize) {
var newItems = this._sourceDataItems.splice(0, chunkSize);
this.dataItems.push(newItems);
};
YourClass.prototype.onLoadMoreItemsRequested = (args) {
var that = new WeakRef(this);
var listView = args.object;
if (this._sourceDataItems.length > 0) {
setTimeout(function () {
that.get().addMoreItemsFromSource(2);
listView.notifyLoadOnDemandFinished();
}, 1500);
args.returnValue = true;
} else {
args.returnValue = false;
listView.notifyLoadOnDemandFinished(true);
}
}
If you are using fromObject syntax for your Observable, then these functions can be passed inside
addMoreItemsFromSource: function (chunkSize) {
....
};
WeakRef: It helps managing your memory effiencetly by keeping a loose reference to the target, read more on docs.
How to load more:
If you set loadOnDemandMode to Auto then loadMoreDataRequested event will be triggered whenever user reaches the end of scrolling.
loadOnDemandBufferSize decides how many items before the end of scroll the event should be triggered.
Read more on docs.
How to update the array:
That's exactly what showcased in addMoreItemsFromSource function. Use .push(item) on the ObservableArray that is linked to your list view.

How can I pass object specific params on uploadSuccess with FineUploader?

To piggyback on my previous question here:
How do I block uploads that lack "DateTimeOriginal" exif data with Fine Uploader?
Once I've got the exif data, I'd like to pass it on to my server within the uploadSuccess AJAX call.
I'm aware of being able to add params, but what I don't see in the docs is some way to do something like:
uploadSuccess: {
params: function(id) {
var params = {
DateTimeOriginal: timestamps[id]
}
return params;
}
}
Is there an equivalent way to handle this?
Upon deeper documentation digging, I found this method:
this.setUploadSuccessParams
Which does the trick.
http://docs.fineuploader.com/api/methods-s3.html#setUploadSuccessParams

Get room/rooms of client [duplicate]

I can get room's clients list with this code in socket.io 0.9.
io.sockets.clients(roomName)
How can I do this in socket.io 1.0?
Consider this rather more complete answer linked in a comment above on the question: https://stackoverflow.com/a/24425207/1449799
The clients in a room can be found at
io.nsps[yourNamespace].adapter.rooms[roomName]
This is an associative array with keys that are socket ids. In our case, we wanted to know the number of clients in a room, so we did Object.keys(io.nsps[yourNamespace].adapter.rooms[roomName]).length
In case you haven't seen/used namespaces (like this guy[me]), you can learn about them here http://socket.io/docs/rooms-and-namespaces/ (importantly: the default namespace is '/')
Updated (esp. for #Zettam):
checkout this repo to see this working: https://github.com/thegreatmichael/socket-io-clients
Using #ryan_Hdot link, I made a small temporary function in my code, which avoids maintaining a patch. Here it is :
function getClient(roomId) {
var res = [],
room = io.sockets.adapter.rooms[roomId];
if (room) {
for (var id in room) {
res.push(io.sockets.adapter.nsp.connected[id]);
}
}
return res;
}
If using a namespace :
function getClient (ns, id) {
return io.nsps[ns].adapter.rooms[id]
}
Which I use as a temporary fix for io.sockets.clients(roomId) which becomes findClientsSocketByRoomId(roomId).
EDIT :
Most of the time it is worth considering avoiding using this method if possible.
What I do now is that I usually put a client in it's own room (ie. in a room whose name is it's clientID). I found the code more readable that way, and I don't have to rely on this workaround anymore.
Also, I haven't tested this with a Redis adapter.
If you have to, also see this related question if you are using namespaces.
For those of you using namespaces I made a function too that can handle different namespaces. It's quite the same as the answer of nha.
function get_users_by_room(nsp, room) {
var users = []
for (var id in io.of(nsp).adapter.rooms[room]) {
users.push(io.of(nsp).adapter.nsp.connected[id]);
};
return users;
};
As of at least 1.4.5 nha’s method doesn’t work anymore either, and there is still no public api for getting clients in a room. Here is what works for me.
io.sockets.adapter.rooms[roomId] returns an object that has two properties, sockets, and length. The first is another object that has socketId’s for keys, and boolean’s as the values:
Room {
sockets:
{ '/#vQh0q0gVKgtLGIQGAAAB': true,
'/#p9Z7l6UeYwhBQkdoAAAD': true },
length: 2 }
So my code to get clients looks like this:
var sioRoom = io.sockets.adapter.rooms[roomId];
if( sioRoom ) {
Object.keys(sioRoom.sockets).forEach( function(socketId){
console.log("sioRoom client socket Id: " + socketId );
});
}
You can see this github pull request for discussion on the topic, however, it seems as though that functionality has been stripped from the 1.0 pre release candidate for SocketIO.

Extjs store.on('save', afterSave(resp));

I have a simple ExtJs (3.4) Grid with a Writer. When the user makes some changes the store is saved to the server as follows:
store.on('save', afterSave(resp));
All is fine. However, I want to get a response as to wheather the record has been saved successfully, failed or an update conflict happed. How to best do this?
Are you using Ext.data.proxy.Ajax to load your stores? If so, you can use the reader property to evaluate and handle the server responses.
Another option would be to make AJAX called directly and handle the responses from there as well
I used exception listener to parse the data as suggested here. But, is this the right way to do this.
Ext.data.DataProxy.addListener('exception', function(proxy, type, action,
options, res) {
if (type == 'response') {
var success = Ext.util.JSON.decode(res.responseText).success;
if (success) {
console.log('UPDATE OK');
} else {
console.log('UPDATE FAILED');
}
}
});

Resources