Not allowed to load local resource using expressjs

Question

Not allowed to load local resource using expressjs

I am trying to load an image file from a string (the filename) inside of a text file:

var thisItem = ITEM_COLLECTION_FILE_NAME;
var rs = fs.createReadStream(path.resolve(thisItem));

rs.on("data", function(data) {
if (data) {
lines += data;
}
});

However, when the page loads, I get this error:

Not allowed to load local resource

On forums like this one: http://www.sencha.com/forum/showthread.php?200512-Not-allowed-to-load-local-resource I found advice saying that I should serve the file directory through HTTP. The thing is, my entire application is built on Express, so it already is using http to serve files. Any ideas as to what I'm doing wrong here?

javascript
node.js
express

Answer 1

Your problem is related to Same origin policy. If you are using express you can do something like this:

app.get('/img', function(req, res){
try{
    var full_path = /full/path/to/your/local/file

    fs.exists(full_path, function(exists){
        if(!exists){
            res.render('404.jade', {});
        }else{
            fs.readFile(full_path, "binary", function(err, file) {
                    res.writeHeader(200);  
                    res.write(file, "binary"); 
                    res.end();
            });
        }
    });
}catch (err){
    res.render('500.jade', {});
}
});

This will write your image to the stream. You can also provide your image via a fileserver or webserver serving static files and then access it from your jade tmeplate via http. Due to the policy mentioned above you can not load local resources like file://path/to/local/file