Passing value from external function to document function

New Here ,
Mar 20, 2021 Mar 20, 2021

Copy link to clipboard

Copied

Hi,

I am using below function to open pdf using Embed PDF API by using Session and Authentication.

 

document.addEventListener("adobe_dc_view_sdk.ready", function () {

	/* The PDF embed mode option here */
	const viewerConfig = {
		embedMode: "FULL_WINDOW",
		defaultViewMode: "FIT_PAGE",     //FIT_WIDTH
		showLeftHandPanel: true,
		showAnnotationTools: true,
		showDownloadPDF: true,
		showPrintPDF: true,
		showPageControls: true,
		showDisabledSaveButton: true,
		downloadWithCredentials: true
	};

	/* Initialize the AdobeDC View object */
	var adobeDCView = new AdobeDC.View({
		/* Registered client id */
		clientId: "yourCliendID",
		/* The div id in which PDF should be rendered */
		divId: "adobe-dc-view"
	});

	/* Invoke the file preview API on Adobe DC View object */
	adobeDCView.previewFile({
		/* Pass information on how to access the file */
		content: {
			/* Location of file where it is hosted */
			location: {
			    url: localPDFUrl,
			    headers: [
			        {
			            key: 'ASP.NET_SessionId',
			            value: currSessionID
			        },
			        {
			            key: '.ASPXAUTH',
			            value: currAuthToken
					},
		/* Pass meta data of file */
		metaData: {   
			/* file name */
			fileName: pdfFileName
		}
	}, viewerConfig);
});

 

As you can see from the above code, I need to pass below variable values from outside function. How can I pass the values from external function to above document function?

  1. localPDFUrl
  2. currSessionID
  3. currAuthToken
  4. pdfFileName

 

Please suggest.

Krunal
TOPICS
PDF Embed API

Views

214

Likes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines

correct answers 1 Correct answer

Adobe Employee , Jun 21, 2021 Jun 21, 2021

The correct way would be something like below. This will also take care of the part in case your script loading takes time.

 

function previewFile(localPDFUrl, pdfFileName, currSessionID, currAuthToken) {
	if (AdobeDC && AdobeDC.View) {
		previewFromPDFEmbedAPI(localPDFUrl, pdfFileName, currSessionID, currAuthToken);
	} else {
		document.addEventListener("adobe_dc_view_sdk.ready", function () {
			previewFromPDFEmbedAPI(localPDFUrl, pdfFileName, currSessionID, currAuthToken);
		});
	}
}

functio
...

Likes

Translate

Translate
New Here ,
Mar 24, 2021 Mar 24, 2021

Copy link to clipboard

Copied

Any Suggestions or Comments?

Krunal

Likes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
New Here ,
Mar 24, 2021 Mar 24, 2021

Copy link to clipboard

Copied

Removed document.addEventListener and created it as a normal function as below-

function previewFile() {}

and call the same from other event where necessary by passing all values or accessing it directly inside function previewFile.

Thanks.

Krunal

Likes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Community Beginner ,
Jun 17, 2021 Jun 17, 2021

Copy link to clipboard

Copied

Can you provide a code sample of the solution? It would be very helpful for others who are trying to figure this out. Thanks!

Likes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Adobe Employee ,
Jun 21, 2021 Jun 21, 2021

Copy link to clipboard

Copied

The correct way would be something like below. This will also take care of the part in case your script loading takes time.

 

function previewFile(localPDFUrl, pdfFileName, currSessionID, currAuthToken) {
	if (AdobeDC && AdobeDC.View) {
		previewFromPDFEmbedAPI(localPDFUrl, pdfFileName, currSessionID, currAuthToken);
	} else {
		document.addEventListener("adobe_dc_view_sdk.ready", function () {
			previewFromPDFEmbedAPI(localPDFUrl, pdfFileName, currSessionID, currAuthToken);
		});
	}
}

function previewFromPDFEmbedAPI(localPDFUrl, pdfFileName, currSessionID, currAuthToken) {
	/* The PDF embed mode option here */
	const viewerConfig = {
		embedMode: "FULL_WINDOW",
		defaultViewMode: "FIT_PAGE",     //FIT_WIDTH
		showLeftHandPanel: true,
		showAnnotationTools: true,
		showDownloadPDF: true,
		showPrintPDF: true,
		showPageControls: true,
		showDisabledSaveButton: true,
		downloadWithCredentials: true
	};

	/* Initialize the AdobeDC View object */
	var adobeDCView = new AdobeDC.View({
		/* Registered client id */
		clientId: "yourCliendID",
		/* The div id in which PDF should be rendered */
		divId: "adobe-dc-view"
	});

	/* Invoke the file preview API on Adobe DC View object */
	adobeDCView.previewFile({
		/* Pass information on how to access the file */
		content: {
			/* Location of file where it is hosted */
			location: {
			    url: localPDFUrl,
			    headers: [
			        {
			            key: 'ASP.NET_SessionId',
			            value: currSessionID
			        },
			        {
			            key: '.ASPXAUTH',
			            value: currAuthToken
					},
		/* Pass meta data of file */
		metaData: {   
			/* file name */
			fileName: pdfFileName
		}
	}, viewerConfig);
}

 

 

Likes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
New Here ,
May 29, 2022 May 29, 2022

Copy link to clipboard

Copied

LATEST

Hello,

 

I had the same situation where I send the URL parameter from a Flask route. Here is how I've done it:

 

FLASK ROUTE

 

 

@app.route("/document", methods=['GET', 'POST'])
def document():   
   # Microsoft blob storage SAS token creation for accessing PDF file in blob storage
    blob = get_blob_sas(BLOB_NAME_PATH, STORAGE_ACCOUNT_KEY, BLOB_CONTAINER_NAME, document_to_retrieve)   
    blob_url = 'https://'+BLOB_NAME_PATH+'.blob.core.windows.net/'+BLOB_CONTAINER_NAME+'/'+document_to_retrieve+'?'+blob
# URL and Filename parameters to send to Adobe Embed API    
    urldata = [blob_url, document_to_retrieve]
     return render_template('view.html', title='SYSTRA Semantic Selected Document', urldata=urldata)

 

HTML PAGE

 

<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8"/>
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1"/>
    <meta id="viewport" name="viewport" content="width=device-width, initial-scale=1"/>

    <script type="text/javascript" src="{{ url_for('static', filename='view.js') }}"></script>
    <script type="text/javascript">
        varPDF = previewFile({{urldata|tojson}})
    </script>
</head>
<body style="margin: 0px">

    <div id="adobe-dc-view"></div>
    <script type="text/javascript" src="https://documentcloud.adobe.com/view-sdk/main.js"></script>
</body>
</html>

 

JAVASCRIPT FUNCTIONS

 

function previewFile(urldata) {

    var myURL = urldata[0];
    var myFileName = urldata[1];

	if(window.AdobeDC) displayPDF(myURL, myFileName);
	else document.addEventListener("adobe_dc_view_sdk.ready", 
		() => displayPDF(myURL, myFileName));
}

function displayPDF(myURL, myFileName) {

	document.write('displayPDF');
    const viewerConfig = {
		embedMode: "FULL_WINDOW",
		defaultViewMode: "FIT_PAGE",    
		showLeftHandPanel: true,
		showAnnotationTools: true,
		showDownloadPDF: true,
		showPrintPDF: true,
		showPageControls: true,
		showDisabledSaveButton: true,
		downloadWithCredentials: true
	};

    var adobeDCView = new AdobeDC.View({
		clientId: '<CLIENT_ID_KEY_HERE',
		divId: "adobe-dc-view"
	});

    adobeDCView.previewFile({
        content: {
            location: {
                url: myURL,
            },
        },
        metaData: {
            fileName: myFileName
        }
    }, viewerConfig);
}

 

It works great on Azure App Services.

 

All the best and manye thanks to Adobe.

 

Pierre-Emmanuel FEGA

zepef@hotmail.com

Likes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines