Ajax file uploading iframe fallback for expressjs
JavaScript
Switch branches/tags
Nothing to show
Fetching latest commit…
Cannot retrieve the latest commit at this time.
Permalink
Failed to load latest commit information.
lib
.gitignore
.npmignore
README.md
package.json

README.md

Ajax file uploading iframe fallback for expressjs

express framework already provides convenient way for uploading files using bodyParser. Ajax file uploading works great at modern browsers but we need a fallback for some "explorers" (yes, i'm watching at you msie) that doesn't support ajax file uploading. Fallback in this case - loading file using iframe. This lightweight (about 50 lines of code without dependencies) middleware provides iframe file uploading support for server side.

Usage

server setup, at your app.js

var app = express.createServer();
app.use(express.bodyParser());

var iframeFileUpload = require('iframe-file-upload-middleware');
iframeFileUpload.addRedirectResponder(app);
app.post(/^.*\/upload$/, iframeFileUpload.middleware());

now you can bind your handler at some upload url e.g. '/images/upload' and process uploads as you usually do, e.g.

app.post('/images/upload', function(req, res) {
	res.json({filename: path.filename(req.files.image.path)});
});

client setup using jquery file upload

$('input[name=image]').fileupload({
	url: '/images/upload',
	redirect: 'default',
	dataType: 'json'
}).on('fileuploaddone', function(event, data) {
	alert(data.result.filename);
});

now you can upload image using file input and recives it's file name to the client. It will work in browsers (using ajax file upload) and in explorer using (iframe file uploading).