JavaScript - 将 PDF 文件从 URL(跨域)加载到变量中

Question

我想将 PDF 文件从 URL 加载到 JavaScript 变量中(该文件位于另一个域中)，然后打印该文件的 base64 编码字符串。

此脚本允许我浏览计算机上的文件，然后将 base64 字符串打印到浏览器控制台中:

<input id="inputFile" type="file" onchange="convertToBase64();" />

<script type="text/javascript">
    function convertToBase64() {
        //Read File
        var selectedFile = document.getElementById("inputFile").files;
        //Check File is not Empty
        if (selectedFile.length > 0) {
            // Select the very first file from list
            var fileToLoad = selectedFile[0];
            // FileReader function for read the file.
            var fileReader = new FileReader();
            var base64;
            // Onload of file read the file content
            fileReader.onload = function(fileLoadedEvent) {
                base64 = fileLoadedEvent.target.result;
                // Print data in console
                console.log(base64);
            };
            // Convert data to base64
            fileReader.readAsDataURL(fileToLoad);
        }
    }
</script>

我想从此脚本中完全删除输入按钮，并将我的文件从 URL 传递给变量 var selectedFile (例如: http://www.example.com/docs/document.pdf )。

我需要帮助如何实现这一点，因为我不确定 XMLHttpRequest() 是否可以跨域工作，并且我发现脚本主要使用 JSON 文件操作的 Ajax/jQuery 方法，这是我需要的不同的东西。

非常感谢您的帮助。

Answer 1

如果对方(在您的情况下是http://www.example.com)不允许cross-origin requests，则您无法在普通的基于浏览器的JavaScript*中执行此操作从你的起源。

如果对方确实允许您这样做，那么是的，您可以使用 XMLHttpRequest (或 jQuery 的包装器，例如 ajax 或 get )来请求数据并按照您认为合适的方式转换/显示它。

如果对方不这样做，解决这个问题的一种相当典型的方法是在中间使用您自己的服务器:向您的服务器发出请求，让它向另一方发出请求端(服务器端代码没有浏览器施加的 Same Origin Policy block )，然后让您的服务器使用来自其他服务器的数据响应您的请求。

<小时/>

*“正常的基于浏览器的 JavaScript” - 例如，无需使用禁用安全性的特殊标志启动浏览器，或让人们安装扩展程序等。