NodeJS write base64 encoded image to file - node.js

I have searched and tried all of the solutions at stackoverflow but none of them seems working at my instance. Basically I have an image, edited by html5 canvas, upload from client and I need to save it to disk, but unfortunately I can't open the file that I just saved. (I am using Windows 7)
My code:
var base64Data = req.body.image.replace(/^data:image\/(png|gif|jpeg);base64,/,'');
require('fs').writeFile('public/aboutToGiveUp.png', new Buffer(base64Data, 'base64'));

Got same bug, it's because of incorrect url path, You may added app.use("/", express.static(path.join(__dirname, 'public')));, so no need to add the public in the url, check your url path once.
working sample :
url = req.protocol+'://'+req.headers.host+"/"+filename;
url = req.protocol+'://'+req.headers.host+"/images/"+filename; // its in public/images

Try using ./public/aboutToGiveUp.png or make sure that the path is relative to the file containing this code.

Related

node ldapauth jpegPhoto decoding

I finally got node-ldapauth working with the base openldap install.
Now when the user object shows up in node I am trying to save the jpegPhoto to a file for use as the profile pic. But I cannot figure out the format
I have tried (among many other things):
fs.writeFileSync(jpgPath, ldapUser.jpegPhoto);
And:
var jpg = new Buffer(ldapUser.jpegPhoto, 'base64');
fs.writeFileSync(jpgPath, jpg);
Any ideas?
Thanks!
Try this:
const jpg = Buffer.from(ldapUser.jpegPhoto, 'binary')
fs.writeFileSync(jpgPath, jpg);

Chrome extension download file without prompt

I'm making an extension in which the user is setting some configs and, based on his selection, a png file needs to be downloaded (from a remote url) in the background and saved as a file somewhere to make it accessible later. It must be saved as a file and also injected in the page by it's final path.
Reading the [fileSystem][1] api of chrome, all methods are sending a prompt to the user in order to download a file. Is there any way I can save files to a location without prompting the user for download?
In an effort to close this years old question, I'm quoting and expanding on wOxxOm's comments and posting as an answer.
The key is to download the raw data as a blob type using fetch. You can then save it via an anchor tag (a link) using the download attribute. You can simulate the "click" on the link using JavaScript if you need to keep it in the background.
Here's an example (more or less copied another SO post).
const data = ''; // Your binary image data
const a = document.createElement("a");
document.body.appendChild(a);
a.style = "display: none";
const blob = new Blob([data], {type: "octet/stream"}),
const url = window.URL.createObjectURL(blob);
a.href = url;
a.download = fileName; // Optional
a.click();
window.URL.revokeObjectURL(url);
This is not without its faults. For instance, it works best with small file sizes (exact size varies by browser, typically ~2MB max). The download attribute requires HTML5 support.

How to display .gif and .svg files to the client using Node.js?

I am trying to figure out a way using just Node.js to display image on the client's browser. With my code I can only make .png files display , .svg and .gif files get downloaded instead of displayed. Why is this?
I am using this:
var http = require('http');
var fs = require('fs');
var path = require('path');
var server = http.createServer(function(req,res) {
if(path.extname(req.url) == ".gif") {
fs.readFile(path.basename(req.url), function(err, data) {
res.writeHead(200, {'content-type':'image/gif'});
res.end(data);
});
}
});
server.listen(80);
I tested .gif .png. .svg , also changing the content type to the correct file extension name. PNG displays and the rest just get downloaded.
Not looking for a framework solution like Express I want to understand how node.js works and why this is happening.
There was nothing wrong with my code. Only certain gifs and svgs did not show. Probably corrupt files. I tried many other gifs and svgs and it worked properly

Getting the mime type from a request in nodeJS

Im learning nodejs but I ran into a roadblock. Im trying to setup a simple server that will serve static files. My problem is that unless I explicitly type in the extension in the url, I cannot get the file extension. The httpheader 'content-type' comes in as undefined .
Here is my code, pretty simple:
var http = require("http"),
path = require("path"),
fs = require("fs");
var server = http.createServer(function(request, response){
console.log([path.extname(request.url), request.headers['content-type']]);
var fileName = path.basename(request.url) || "index.html",
filePath = __dirname + '/public/' + fileName;
console.log(filePath);
fs.readFile( filePath, function(err,data){
if (err) throw err
response.end(data);
});
})
server.listen(3000)
Any ideas?
FYI I dont just wanna dive into connect or other, I wanna know whats going on before I drop the grind and go straight to modules.
So static web servers generally don't do any deep magic. For example, nginx has a small mapping of file extensions to mime types here: http://trac.nginx.org/nginx/browser/nginx/conf/mime.types
There's likely also some fallback logic defaulting to html. You can also use a database of file "magic numbers" as is used by the file utility to look at the beginning of the file data and guess based on that.
But there's no magic here. It's basically
go by the file extension when available
maybe go by the beginning of the file content as next option
use a default of html because normally only html resources have URLs with no extensions, whereas images, css, js, fonts, multimedia, etc almost always do use file extensions in their URIs
Also note that browsers generally have fairly robust set of checks that will intepret files correctly even when Content-Type headers are mismatched with the actual response body data.

How do you get the filename from the XPages FileUpload Control

In XPages, in the file upload control, after a user selects a file but before it's saved how can you get the filename? I'm not interested in the path as I believe that's not getable due to security issues but I would like to get the filename and extension if at all possible.
Thanks!
Actually you can get the file and fully manipulate it, read it, do whatever you want with it, its stored in the xsp folder on the server, to which you have read/write access... here is a code snippet that interacts with the file, I usually call from beforeRenderResponse...
var fileData:com.ibm.xsp.http.UploadedFile = facesContext.getExternalContext().getRequest().getParameterMap().get(getClientId('<INSERT ID OF UPLOAD CONTROL HERE (ie. fileUpload1)>'));
if (fileData != null) {
var tempFile:java.io.File = fileData.getServerFile();
// Get the path
var filePath:String = tempFile.getParentFile().getAbsolutePath();
// Get file Name
var fileName:String = tempFile.getParentFile().getName();
// Get the Name of the file as it appeared on the client machine - the name on the server will NOT be the same
var clientFileName:String = fileData.getClientFileName();
}
It sounds like you are referring to needing to get the data via CSJS, which you can do with the following code:
var filename = dojo.byId('#{id:fileUpload1}').value.split('\\').pop();
These links should be able to help you.
http://www.bleedyellow.com/blogs/andyc/entry/intercepting_a_file_upload4?lang=en
http://www.bleedyellow.com/blogs/m.leusink/entry/processing_files_uploaded_to_an_xpage?lang=en

Resources