Hi,

You can refer the below OutSystems forum discussions.

Hope it helps.

https://www.outsystems.com/forums/discussion/75505/open-document-in-new-tab-instead-of-downloading/

https://www.outsystems.com/forums/discussion/73748/pdf-preview-in-a-new-window-reactive/

https://www.outsystems.com/forums/discussion/90584/how-to-view-pdf-in-new-tab/

https://www.outsystems.com/forums/discussion/90599/open-link-in-new-tab/

Thanks,

Sriyamini J

@Rita Barbosa,

Can you try with the code below. Hope it helps.

var byteCharacters = atob($parameters.Base64Data);

var byteNumbers = new Array(byteCharacters.length);

for (var i = 0; i < byteCharacters.length; i++) {

    byteNumbers[i] = byteCharacters.charCodeAt(i);

}

var byteArray = new Uint8Array(byteNumbers);

var file = new Blob([byteArray], { type: 'application/pdf' });

var fileURL = URL.createObjectURL(file);

var a = document.createElement('a');

a.href = fileURL;

a.target = '_blank';

a.download = $parameters.FileName || 'document.pdf';

document.body.appendChild(a);

a.click();

setTimeout(function() {

    document.body.removeChild(a);

    window.URL.revokeObjectURL(fileURL);

}, 100);

Hi @Rita Barbosa ,

Refer this link,i hope it will helpful to you,

https://www.outsystems.com/forums/discussion/87562/ultimate-pdf-is-it-possible-to-open-pdf-in-a-new-tab-instead-of-downloading-wit/

Thanks,

Sudha Narayanan 

Hi @Rita Barbosa,

Please refer to the following discussion 

https://www.outsystems.com/forums/discussion/65561/how-to-preview-a-pdf-word-file-without-download-it/

https://www.outsystems.com/forums/discussion/57001/how-to-preview-a-pdf-in-outsystems-without-downloading-it/

https://www.outsystems.com/forums/discussion/87562/ultimate-pdf-is-it-possible-to-open-pdf-in-a-new-tab-instead-of-downloading-wit/

and you can try with javascript code as well

function base64ToBlob(base64Data, contentType = 'application/pdf', sliceSize = 1024) {

    // Decode base64 string

    const byteCharacters = atob(base64Data);

    const byteArrays = [];

    // Process the Base64 string in slices

    for (let offset = 0; offset < byteCharacters.length; offset += sliceSize) {

        const slice = byteCharacters.slice(offset, offset + sliceSize);

        const byteNumbers = new Array(slice.length);

        for (let i = 0; i < slice.length; i++) {

            byteNumbers[i] = slice.charCodeAt(i);

        }

        // Convert slice to a Uint8Array and store it

        const byteArray = new Uint8Array(byteNumbers);

        byteArrays.push(byteArray);

    }

    // Create a Blob from the byte arrays

    return new Blob(byteArrays, { type: contentType });

}

// Use the helper function to convert Base64 data to a PDF Blob

const pdfBlob = base64ToBlob($parameters.Base64Data, 'application/pdf');

// Generate a URL for the Blob and open it in a new tab

const fileURL = URL.createObjectURL(pdfBlob);

window.open(fileURL, "_blank");

Hope this helps

Thanks

Hi @Rita Barbosa ,

There's no guaranteed way to make a PDF always open in a new tab, it really depends on each user's browser settings. Even if you use target="_blank", browsers like Chrome or Edge might handle it differently. That could be why it’s not working as expected in those browsers. 

Chrome, Edge, Firefox, and Safari can be configured to:

• Open PDFs in a new tab,
• Automatically download them,
• Or use a custom PDF viewer plugin.

_____________

I tested your code in Chrome using a simple PDF, and it worked as expected, the page loaded completely. 

Could you check if you have any browser extensions that might be causing a conflict? 

Also, have you considered using a component to help you with this feature?

_________________

EDIT:

I played a bit with the code and managed somehow to get this result, which is similar to yours:

I updated the code by generating an HTML blob that contains an iframe stretched to 100% width and height, giving you a full-page display. This should ensure that the pdf is displayed properly.

I attached a sample OML with the updated code.

Hi , Use This JS : 

const base64String = $parameters.PDF;

 const byteCharacters = atob(base64String);

const byteNumbers = new Array(byteCharacters.length);

for (let i = 0; i < byteCharacters.length; i++) {

    byteNumbers[i] = byteCharacters.charCodeAt(i)

const byteArray = new Uint8Array(byteNumbers);

const blob = new Blob([byteArray], { type: 'application/pdf' });

const blobUrl = URL.createObjectURL(blob);

window.open(blobUrl, '_blank');

// *********** END************

• 
  $parameters.PDF => base64PDF : convert binaryData to base64 using BinaryToBase64 from BinaryData Extention
  

Working OAP Example Bellow : 

Instead of opening the blob directly, open a new HTML page with an embedded  that shows the PDF.

Change your JavaScript like this:

var byteCharacters = atob($parameters.Base64Data);

var byteNumbers = new Array(byteCharacters.length);

for (var i = 0; i < byteCharacters.length; i++) {

    byteNumbers[i] = byteCharacters.charCodeAt(i);

}

var byteArray = new Uint8Array(byteNumbers);

var file = new Blob([byteArray], { type: 'application/pdf' });

var fileURL = URL.createObjectURL(file);

// Create HTML to embed the PDF

var html = `

`;

// Open in new tab

var newTab = window.open();

newTab.document.write(html);

newTab.document.close();

What this does:

• Creates a temporary new HTML page.
• Embeds the PDF properly in an <iframe>.
• The iframe fills 100% width and height.
• Solves the scroll bar, partial loading issue.

Happy Coding