PDF Embed API's previewFile() method render blank container, no error

[Antonio Ooi]

Today, I deployed my app from localhost to my production site (with different domain name of course). Later, I discovered that every credential for PDF Embed API can only support one single domain; therefore, I tried to create another project with a new credential for my production site. But when I tested it on my localhost with the same API key that I used for localhost again, no error was logged on the browser console except a blank HTML container (with the expected height and width though).

Later I thought it could be due to CORS issue (although less likely, because the PDF URL is hosted my own website with CORS header allowed all (*)), so I tried with the PDF URL given by the demo:

https://documentcloud.adobe.com/view-sdk-demo/PDFs/Bodea%20Brochure.pdf

Still no luck. Below is my code just in case you need to make sure I did it right:

document.addEventListener("adobe_dc_view_sdk.ready", function () {
let adobeDCView = new AdobeDC.View({ clientId: "4d80b79560164302a9aff1c55484356a", divId: "pdfContainer" });
adobeDCView.previewFile({
    content: { location: { url: "https://documentcloud.adobe.com/view-sdk-demo/PDFs/Bodea%20Brochure.pdf" } },
    metaData: { fileName: "download-from-mtn-webstore.pdf" }
}, { embedMode: "IN_LINE" });
});

So what else could it be wrong? Please enlighten me, thanks in advance!

[Antonio Ooi]

After some further investigation, I realized that it was due to my attempt to dynamically render the embed on a dynamically created container element, i.e. the "pdfContainer". The solution is to dynamically add the SDK using jQuery's $.getScript() and call the previewFile() method when done:

$.getScript("https://documentcloud.adobe.com/view-sdk/main.js")
    .done(function (script, textStatus) {                                 
        document.addEventListener("adobe_dc_view_sdk.ready", function () {
            var adobeDCView = new AdobeDC.View({ clientId: envManager.PDFEmbedAPIClientID, divId: "pdfContainer" });
            adobeDCView.previewFile({
                content: { location: { url: urlInfo.pdf.embedLink } },
                metaData: { fileName: "download-from-mtn-webstore.pdf" }
            }, { embedMode: "IN_LINE" });
    });
})

[Antonio Ooi]

Sorry, it was my fault that I did not thoroughly test the outcome -- the downloaded file was ZERO BYTES! I do not know how to unmark the above as answer, so might as well submit another reply here again. I'm still waiting for the answer from Stack Overflow.

Sorry for jumping the gun for too soon, my apologies.