I have designed application using Node.js and I have converted into Desktop Application using ElectronJS. Downloading JSON object as a file is not downloading automatically to my downloads Folder, Instead it is asking Popup window to choose the path to save the file.
Below Code I have used:
HTML: <a id="downloadAnchorElem" style="display:none"></a>
var dataStr = "data:text/json;charset=utf-8," +
encodeURIComponent(JSON.stringify(storageObj));
var dlAnchorElem = document.getElementById('downloadAnchorElem');
dlAnchorElem.setAttribute("href", dataStr );
dlAnchorElem.setAttribute("download", "scene.json");
dlAnchorElem.click();
If i run this code as a normal webapplication, it is downloading automatically whereas if i run the same on on Desktop Application using ElectronJS NOT downloading automatically. Kindly tell me why this is happening and Alternative solution is appreciable.
electron-dl is your friend!. As its description goes in the github, it really simplifies file downloads for your Electron app.
Here is an example how you can initiate the download.
const {app, BrowserWindow, ipcMain} = require('electron');
const {download} = require('electron-dl');
ipcMain.on('download-btn', (e, args) => {
download(BrowserWindow.getFocusedWindow(), args.url)
.then(dl => console.log(dl.getSavePath()))
.catch(console.error);
});
Hope this helps!
Related
I am using React Native v0.67.2 and looking to generate PDF from HTML using react-native-html-to-pdf. This is the function I use to generate the PDF, but the location of generated Pdf isn't showing in the iOS file manager.
const createPDF = async () => {
let options = {
html: '<h1>PDF TEST</h1>',
fileName: 'testFile',
directory: 'Documents',
};
let file = await RNHTMLtoPDF.convert(options);
// console.log(file.filePath);
alert(file.filePath);
}
The file exists in an unknown location, but I'm expecting the downloaded PDF file in the 'Documents' directory of iPhone Files. How do I move the PDF to this location and resolve this issue?
Thank you in advance.
Duplicate of:
pdf created by react native html to pdf is not showing in provided path
On IOS you can only use that Documents path that you already have.
You cannot make it save anywhere else.
Directory where the file will be created (Documents folder in example above). Please note, on iOS Documents is the only custom value that is accepted.
Ref: https://github.com/christopherdro/react-native-html-to-pdf#options
I'm building an electron app with vue.js + vue-cli-plugin-electron-builder that shows the structure of the public folder which includes a "pdf" folder with PDF files.
I use pdf.js to show the pdfs.
To have that "pdf" folder later in my my app I copy that folder with
extraFiles: [
{
from: "./public/pdf",
to: "pdf"
}
The app shows all folders and included pdf files.
When I click on one pdf name a popup opens and shows the PDF.
Works great in development and in the final build.
I read the folder with this function:
readdir () {
var devPath = path.join(__static, '/pdf/Anbau')
console.log("devPath development : ", devPath);
var readFiles = new Promise((resolve, reject) => {
fs.readdir(devPath, (err,files) => {
if(err) {
alert('Lesen fehlgeschlagen!', {type: 'error'})
reject(err);
} else {
resolve(files);
this.list = files;
console.log('this.list: ', this.list, this.list.length)
}
});
});
},
The problem is now, when I add new folders and pdfs to that
public folder after the app is built, the app shows the new folders and pdfs, but if I click on the generated name "someNewPDF.pdf", pdf.js throws an error.
The console output with the path of the pdf is correct.
I found out that ONLY the files that exist before the build process are later accessible. When I rename a pdf, electron neither can show that file.
It seems like electron creates a map of the files when building the app and later it can't be changed.
So my question is:
What can I do to let the app read dynamically a folder that can be filled / expanded later.
The idea is, that the user can throw his pdf files into a folder and that can be viewed via my app.
I'm quite new in vue and electron.
i've found a solution:
the client can put his files now in a folder "pdf" on the desktop. Inside of this folder are also the necessary files of PDF.js.
The path to the desktop on MAC and Windows is
const desktopPath = app.getPath('desktop')
so now i can
window.open('file://' + desktopPath + '/pdf/web/viewer.html?file=' + url)
while url holds the path to the pdf.
I have several pdf docs for example 4, and I need merge them into 1 pdf file. I was trying to use merge-pdf but documentation for this package is lean, so I got my merged pdf's but it merged into several pages. I should probably use hummus.js or another package, but I'm not sure. Any help?
You can do this on any computer using a free online PDF merger called PDF Joiner, or you can use a free app called PDF Creator on Windows or the built-in Preview program on Mac.
or you can convert it by yourself by using copying content of all pdfs into doc file and save this doc file as pdf
You can use HummusJS for this purpose, here's an example of combining three PDF files. One might want to improve error handling / corner cases etc. but this certainly does the job.
const fs = require("fs")
const hummus = require("hummus");
const memoryStreams = require("memory-streams");
// Combine PDF files into one buffer.
function combinePDFs(...filePaths) {
const pdfBuffers = filePaths.map(filePath => fs.readFileSync(filePath));
const resultStream = new memoryStreams.WritableStream();
const writer = hummus.createWriterToModify(new hummus.PDFRStreamForBuffer(pdfBuffers[0]), new hummus.PDFStreamForResponse(resultStream));
// Add the subsequent files
pdfBuffers.slice(1).forEach(buffer => {
writer.appendPDFPagesFromPDF(new hummus.PDFRStreamForBuffer(buffer));
});
writer.end();
resultStream.end();
return resultStream.toBuffer();
};
const resultBuffer = combinePDFs("pdf1.pdf", "pdf2.pdf", "pdf3.pdf");
fs.writeFileSync("result.pdf", resultBuffer);
I hope you're good!
I have an REST-API with PHP (Flight-PHP as framework) running in one server and I want to download a PDF saved in the server. But I'm having troubles with that.
The API resource that needs to be called to download the PDF is like:
GET /sales/:id/download
If I run the resource mentioned above in a browser, it will download a PDF file and it will display the PDF downloaded without troubles.
Now, in the frontend (a.k.a. a web application running in my browser) I have the following code:
$scope.download = (function (id) {
$http.get($rootScope.api_url + 'sales/' + id + '/download')
.then(function (response) {
var resp = response.data;
var blob = new Blob([resp], {type : 'application/pdf'});
saveAs(blob, folio + ".pdf"); //yup, I'm using SaveAs.js
}, function (reason) {
alert("The file weren't downloaded");
});
});
The code mentioned above downloads me a pdf file... But it is white!
So, after open both PDF's (one generated from the backend and another generated from the js script) it appears me with some chars I can't read (literally, I can't read)
So, my question is, how can I download the file using a different encode? And, which is the better way to encode this file to avoid the loss of chars?
I'm a beginner programmer and I'm trying to download and temporarily save a file using casperjs.
casper.start("http://www.google.fr/", function() {
var path = 'C:/WINDOWS/TEMP/logo.png';
fs.write(path, this.download("http://www.google.fr/images/srpr/logo3w.png"), 'w');
});
I've tried opening the file in photo viewer, and it reads 'photo viewer does not support the file format'
From the documentation:
Istead of fs.write, use:
this.download("http://www.google.fr/images/srpr/logo3w.png", path);
Hope this helps.