load pdf in javascript错误，但是为什么直接在浏览器中就成功了

Question

all. I am thinking about a issue using pdfTron SDK(an SDK help load pdf) in my application. This SDK is able to load local pdf files, working like a charm. I decide to load an online pdf file in my web application, using pdfTron SDK, eg 'https://cdn.mendix.tencent-cloud.com/documentation/developerportal/tencent-deploy.pdf'. This file is accessible in browser, directly, but when I use scripts, like:

instance.UI.loadDocument('https://cdn.mendix.tencent-cloud.com/documentation/developerportal/tencent-deploy.pdf');
  };

I directly got an error when running the application, which shows

Request URL: https://cdn.mendix.tencent-cloud.com/documentation/developerportal/tencent-deploy.pdf
Request Method: HEAD
Status Code: 403 
Referrer Policy: strict-origin-when-cross-origin

I think this is a CORS issue. But I cannot understand why I can use browser getting this file, while scripts does not. How can I resolve this? Thanks

Answer 1

I would suggest to read the documentation on pdfTron concerning "webview" and "loadDocment".

WebView is used to get the pdf you want to use from any source(file or web), in your case, you need to use "initialDoc" property, that is where you would place "cdn.mendix.tencent-cloud.com/documentation/developerportal/…".

Then "instance.UI.loadDocument" is used to identify the html element where you want to place the fetched document.

Sample

API Docs

Answer 2

I also try a CORS config in my document server(nginx), like this:

add_header Access-Control-Allow-Origin *;
add_header Access-Control-Allow-Methods 'GET, POST, OPTIONS';
add_header Access-Control-Allow-Headers 'DNT,X-Mx-ReqToken,Keep-Alive,User-Agent,X-Requested-With,If-Modified-Since,Cache-Control,Content-Type,Authorization';

This works now. But It seems that if the document server is not yours, you cannot do this. Hope this help!