Business
Jobs
  • About Us
  • Solutions
    • Job Postings
      Post your job and receive qualified candidates in 48h.
    • Candidate Assessments
      500+ technical and psychological tests, plus anti-fraud.
    • Headhunting
      Tailor-made executive search from start to finish.
    • Payroll + EOR
      Payroll dispersal and EOR across 15+ LATAM countries.
  • Pricing
  • Jobs

0

1.3K
Views
How to open a pdf in new tab in reactjs?

We have the pdf document save in data base , from webapi I am returning as byte array,Now from UI I have to open the pdf in new tab of browser, and user should able to download the pdf. How can I achieve this requirement of opening and downloading the pdf document?

over 4 years ago · Santiago Trujillo
3 answers
Answer question

0

You can use something like this:

<a href='/api/v1/print/example.pdf' target='_blank' rel='noopener noreferrer'>
over 4 years ago · Santiago Trujillo Report

0

The following code work for me

try {
    await axios
      .get(uri.ApiBaseUrl + "AccountReport/GetTrialBalancePdfReport", {
        responseType: "blob",
        params: {
          ...searchObject,
        },
      })
      .then((response) => {
        //Create a Blob from the PDF Stream
        const file = new Blob([response.data], { type: "application/pdf" });
        //Build a URL from the file
        const fileURL = URL.createObjectURL(file);
        //Open the URL on new Window
         const pdfWindow = window.open();
         pdfWindow.location.href = fileURL;            
      })
      .catch((error) => {
        console.log(error);
      });
  } catch (error) {
    return { error };
  }
over 4 years ago · Santiago Trujillo Report

0

Solution from 2020

   import Pdf from '../Documents/Document.pdf';

   <a href={Pdf} without rel="noopener noreferrer" target="_blank">
      <button trailingIcon="picture_as_pdf" label="Resume">
        PDF
      </button>
   </a>
over 4 years ago · Santiago Trujillo Report
Answer question
Find remote jobs

Discover the new way to find a job!

Top jobs
Top job categories
Business
Post vacancy Pricing Sales
Legal
Terms and conditions Privacy policy
© 2026 PeakU Inc. All Rights Reserved.
Andres GPT
Show me some job opportunities
There's an error!