I am generating a PDF client side with jsPDF. I need to send it to my Express server using Axios. At the end I need to send it via email with Nodemailer. Where am I wrong?

Client side code:

//doc creation ....
var res = doc.output('datauristring');   //this line!!!!
axios.post('/mailsender', res).then((res) => {
    if(res.status === 'ok') console.log("Yeah!");
    else console.log(":(");
});

Server side code:

...

api_router.post('/mailsender', (req, res) => {
    mail.send(req.body, (res) => {
        res.status(200).json({"status": res ? 'ok' : 'error' });
    });
});

mail.js that is:

const nodemailer = require('nodemailer');

let transporter = nodemailer.createTransport({
    host: 'smtp.mail.yahoo',
    port: 465,
    secure: true,
    auth: {
        user: '[email protected]',
        pass: 'password'
    }
});


exports.send = function (data, callback) {
    let mailOptions = {
        from: '"My application" <[email protected]>',
        to: "receiverAddress",
        subject: "Attachment experiment",
        text: "My <3",
        attachments: [
            {
                filename: 'attachment.pdf',
                content: data,
                contentType: 'application/pdf',
                encoding: 'base64'    //this line!!!!
            }
        ]
    };

    transporter.sendMail(mailOptions, (error, info) => {
        if (error) {
            return console.log(error);
            callback(false);
        }
        callback(true);
    });
}

All is working fine, except that if I try to open the attachment in the received mail, Preview says that the file is damaged. The same if I try to open it with google chrome or with other PDF readers. Probably, the two lines with a ment has to be changed. Thank you for your attention!

I am generating a PDF client side with jsPDF. I need to send it to my Express server using Axios. At the end I need to send it via email with Nodemailer. Where am I wrong?

Client side code:

//doc creation ....
var res = doc.output('datauristring');   //this line!!!!
axios.post('/mailsender', res).then((res) => {
    if(res.status === 'ok') console.log("Yeah!");
    else console.log(":(");
});

Server side code:

...

api_router.post('/mailsender', (req, res) => {
    mail.send(req.body, (res) => {
        res.status(200).json({"status": res ? 'ok' : 'error' });
    });
});

mail.js that is:

const nodemailer = require('nodemailer');

let transporter = nodemailer.createTransport({
    host: 'smtp.mail.yahoo.',
    port: 465,
    secure: true,
    auth: {
        user: '[email protected]',
        pass: 'password'
    }
});


exports.send = function (data, callback) {
    let mailOptions = {
        from: '"My application" <[email protected]>',
        to: "receiverAddress",
        subject: "Attachment experiment",
        text: "My <3",
        attachments: [
            {
                filename: 'attachment.pdf',
                content: data,
                contentType: 'application/pdf',
                encoding: 'base64'    //this line!!!!
            }
        ]
    };

    transporter.sendMail(mailOptions, (error, info) => {
        if (error) {
            return console.log(error);
            callback(false);
        }
        callback(true);
    });
}

All is working fine, except that if I try to open the attachment in the received mail, Preview says that the file is damaged. The same if I try to open it with google chrome or with other PDF readers. Probably, the two lines with a ment has to be changed. Thank you for your attention!

• javascript
• reactjs
• axios
• jspdf
• nodemailer

• I stumbled upon your post after trying to solve a similar issue. I tried your way of doing it but still not getting the right results. Is there any way you could look at my post and see if you can help me? stackoverflow./questions/61754787/… – Michael Commented May 12, 2020 at 16:06

3 Answers 3

It was very simple: I had only to change the the attachment part in this way:

attachments: [
    {
        path: data
    }
]

Below code worked for me , i used axios in client to post the pdf and nodemailer in server side in node.js to send pdf as attachment

Client :

const out = pdf.output('datauristring');
const response = await axios.post(`/email/sendReport`, {
  pdf: out.split('base64,')[1],
});

Server:

let mailOptions = {
    from: '"My application" <[email protected]>',
    to: "receiverAddress",
    subject: "Attachment experiment",
    text: "My <3",
    attachments: [
        {
            filename: 'attachment.pdf',
            content: req.body.pdf,
            contentType: 'application/pdf',
            encoding: 'base64'
        }
    ]
};

I am saving pdf on the server and also sending pdf in Laravel mail from jsPDF.I'm posting my code.perhaps it helps someone.

 sendPdfInMail() { 
      const doc = new jsPDF() 
      doc.text('Pdf from jspdf!', 10, 10)  
      var formData = new FormData()
      formData.append('file',          doc.output('datauristring').split('base64,')[1])
      axiosIns
        .post('auth/currency_statement', formData, {
          headers: {
            'Content-Type': 'multipart/form-data',
          },
        })
        .then(function (response) {
          console.log(response)
        })
        .catch(function (err) {
          console.log(err.response)
          alert('error')
        })
    },

<script src="https://cdnjs.cloudflare./ajax/libs/vue/2.5.17/vue.js"></script>

PHP Laravel (Server Code)

public function send_currency_statement(Request $request) {

  $data["email"] = "[email protected]";
  $data["title"] = "Currency statement";
  $data["body"] = "Please check your invoice";



  $fileName = time().
  '.pdf';
  $path = public_path('temp/').$fileName;
  //Decode pdf content
  $pdf_decoded = base64_decode($request - > file);
  //Write data back to pdf file
  $pdf = fopen('temp/'.$fileName, 'w');
  fwrite($pdf, $pdf_decoded);
  //close output file
  fclose($pdf);


  Mail::send('emails.myTestMail', $data, function($message) use($data, $path) {
    $message - > to($data["email"], $data["email"]) -
      >
      subject($data["title"]);
    $message - > attach($path);
  });



  return response() - > json(['message' => 'send successfully']);

}