DevTools failed to load SourceMap - node.js

I'm trying to create pages that will take a user information and save them to the database. the user information are {name, age....... picture}, when I put the information without a picture it work fine and the data saved to the database but when I try to put the picture with them it gives me the error.
I'm sorry for the picture quality.
any one can help me with this.
I'm using nodejs and react
thx :)

You would need to send the picture as Base64 in your object, as it follows:
var data = {
name: 'John',
age: 27,
picture: 'data:image/png;base64,R0lGODlhPQBEAJos...',
}
In NodeJS, if using Express, the picture will be req.body.picture. So, all you need to do is store the file, then get the temp path do do what you need.
You can store base64 file doing:
var filePath = './tmp/myPicture.png';
fs.writeFile(filePath, req.body.picture, 'base64', (err) => {
if (err) {
res.json({ err: 'Error while creating temp file from base64.' });
} else {
// Your file was uploaded, so you can read your file here.
}
});

Related

Saving image in local file system using node.js

I was working on a simple code to download missing images from a site and save it in the local system, given its complete URL. I am able to get the data in binary format as response and also I am able to save it properly. But when I try to open the image it shows the format is not supported by the system. I tried to save some js and css file and they are being saved properly and I am able to view them as well. But I am having problem with all the image formats.
Here is the code I wrote:
try {
response = await axios.get(domain + pathOfFile);
console.log(response);
fs.writeFile(localBasePath + pathOfFile, response.data, "binary", (error) => {
if (error) console.log("error while writting file", error.message);
});
} catch (error) {
console.log("error in getting response", error.message);
}
domian: contains the base domain of the site
pathOfFile: contains the path of file on that domain
localBasePath: the base folder where I need to store the image
I even tried to store the response in a buffer and then tried to save the image, but still I am facing the same problem.
Any suggestions would be appreciated.
You need to define responseEncoding while calling axios.get method.
Change your line to:
response = await axios.get(domain + pathOfFile, {responseEncoding: "binary"});

Converting adobe inDesign to pptx (is it even possible?)

I'm struggling to find a solution. I have a bulk of Adobe inDesign files I'm trying to convert over as PDFs
I know you can export to inDesign -> PDF then from Acrobat PDF -> PPTX. This would work well if it was just one or two files. I don't want to keep doing this over and over. I've tried using pdf-powerpoint the only issue with that is it exports each slide as a PNG. I would still like to be able to edit them afterward. I've seen that it is possible to use javascript to automate Adobe products but, after combing through their documentation I'm not sure if it's possible to pipe data into other Adobe products. Any suggestions?
You want to convert a PDF file to a Microsoft Powerpoint file (pptx).
You want to achieve this using Node.js.
If my understanding is correct, how about this workaround? In this workaround, it uses an external API which is ConvertAPI. The pptx file converted by this API can be edited by Microsoft Powerpoint. When you try this, for example, you can also test this using "Free Package". When you try using "Free Package", please Sign Up at "Free Package" and retrieve your Secret key.
Sample script:
const fs = require('fs');
const request = require('request');
const pdfFile = "### PDF file ###"; // Please set PDF filename including the path.
const url = "https://v2.convertapi.com/convert/pdf/to/pptx?Secret=#####"; // Please set your Secret key.
const options = {
url: url,
method: 'POST',
formData: {File: fs.createReadStream(pdfFile)},
};
request(options, function(err, res, body) {
if (err) {
console.log(err);
return;
}
const obj = JSON.parse(body);
obj.Files.forEach(function(e) {
const file = new Buffer(e.FileData, "base64");
fs.writeFile(e.FileName, file, function(err) {
if (err) {
console.log(err);
return;
}
console.log("Done.");
});
});
});
Note:
Before you run ths script, please retrieve your secret key.
In this script, a PDF file is uploaded and converted to pptx file, and download it. Then, it is saved as a pptx file.
This is a simple sample script. So please modify it for your situation.
Reference:
PDF to PPTX API of ConvertAPI
If this workaround was not what you want, I'm sorry.

Uploading image as Binary Data to cognitive Services with Node

I am trying to pass the Microsoft Cognitive services facial API an image which the user has uploaded. The image is available on the server in the uploads folder.
Microsoft is expecting the image to be 'application/octet-stream' and passed as binary data.
I am currently unable to find a way to pass the image to the API that is satisfactory for it to be accepted and keep receiving "decoding error, image format unsupported". As far as im aware the image must be uploaded in blob or file format but being new to NodeJs im really unsure on how to achieve this.
So far i have this and have looked a few options but none have worked, the other options i tried returned simmilar errors such as 'file too small or large' but when ive manually tested the same image via Postman it works fine.
image.mv('./uploads/' + req.files.image.name , function(err) {
if (err)
return res.status(500).send(err);
});
var encodedImage = new Buffer(req.files.image.data, 'binary').toString('hex');
let addAPersonFace = cognitive.addAPersonFace(personGroupId, personId, encodedImage);
addAPersonFace.then(function(data) {
res.render('pages/persons/face', { data: data, personGroupId : req.params.persongroupid, personId : req.params.personid} );
})
The package it looks like you're using, cognitive-services, does not appear to support file uploads. You might choose to raise an issue on the GitHub page.
Alternative NPM packages do exist, though, if that's an option. With project-oxford, you would do something like the following:
var oxford = require('project-oxford'),
client = new oxford.Client(YOUR_FACE_API_KEY),
uuid = require('uuid');
var personGroupId = uuid.v4();
var personGroupName = 'my-person-group-name';
var personName = 'my-person-name';
var facePath = './images/face.jpg';
// Skip the person-group creation if you already have one
console.log(JSON.stringify({personGroupId: personGroupId}));
client.face.personGroup.create(personGroupId, personGroupName, '')
.then(function(createPersonGroupResponse) {
// Skip the person creation if you already have one
client.face.person.create(personGroupId, personName)
.then(function(createPersonResponse) {
console.log(JSON.stringify(createPersonResponse))
personId = createPersonResponse.personId;
// Associate an image to the person
client.face.person.addFace(personGroupId, personId, {path: facePath})
.then(function (addFaceResponse) {
console.log(JSON.stringify(addFaceResponse));
})
})
});
Please update to version 0.2.0, this should work now.

How to Store a File to Parse Server with fs

I was having trouble with this, though it probably is a rookie issue. I want to store some file at ../images/icon.png as a File object in my database. I had trouble accessing the actual data and storing it properly. The documentation for Parse.File says you can access the data as
1. an Array of byte value Numbers, or
2. an Object like { base64: "..." } with a base64-encoded String.
3. a File object selected with a file upload control.
but I couldn't figure out how to actually do this.
What I ended up doing was
let iconFile = undefined;
const filePath = path.resolve(__dirname, '..', 'images/icon.png');
fs.readFile(filePath, 'base64', function(err, data) {
if (err) {
console.log(err);
} else {
iconFile = new Parse.File('icon', {base64: data});
}
});
I was getting errors where the path wasn't pointing to the image correctly, so I used node's path (as in require('path') to get it to point correctly.
This code should work for any file type, as far as I can tell.

Upload .xlsx files to express/node and mongoDB

I'm trying to make a web application where a manager can upload a weekly work schedule to the application and then have the application parse out the data into html format.
My question to you guys is how to have the application convert the excel file into JSON while it is being upload. I'm new so I'm not sure how to simultaneously upload the file to Mongo while converting it to JSON.
edit - in my app.js :
xlsxj = require("xlsx-to-json");
xlsxj({
input: "sample.xlsx",
output: "output.json"
}, function(err, result) {
if(err) {
console.error(err);
}else {
console.log(result);
}
});
app.post('/upload' function(req, res) {
??? What to put here ???
});
my input where the user selects file to upload:
.div(style={position: 'absolute', right: '50px', top: '75px'})
unless user.email == "cca#gmail.com"
p Upload New Schedule
#uploadNew
form(action="...", method="post", enctype="multipart/form-data")
input(type="file", name="displayImage")
I'm wondering how I go from there to having the input converted to JSON and stored in the DB
I recommend using js-xlsx to parse the .xlsx file on Node.js. This is a highly tested library that parses the data into a JSON structure you can iterate over to extract data. It doesn't parse charts or handle macros but you likely do not need to.
You may or may not choose to store the data in MongoDB. Mongo is nice for many reasons, but you have to be sure that no attribute has an embedded $ or . as these are reserved and will generate an error. Another approach you may consider to store the XLSX file or the stringified JSON file on S3, using the aws-sdk
xlsxj = require("xlsx-to-json");
app.post('/upload' function(req, res) {
/* upload script here */
xlsxj({
input: "sample.xlsx", //change this names based on the upload file name
output: "output.json"
}, function(err, result) {
if(err) {
console.error(err);
}else {
console.log(result);
}
});
});
There are several npm packages which can convert xlsx data to json format.
You can search them on npm website.
Use this package.
Once the xlsx file is uploaded to the database. Convert it to xlsx and save it to database.

Resources