Мой просмотрщик PDF выдает ошибки политики получения - PullRequest
Новая
       46

Мой просмотрщик PDF выдает ошибки политики получения

0 голосов
/ 28 апреля 2020

У меня есть html код для встраивания PDF-файла в веб-браузер для просмотра их с использованием библиотеки PDF JS, но при его запуске в консоли веб-браузера выдается следующая ошибка: 

Access to fetch at 'http://www.orimi.com/pdf-test.pdf' from origin 'null' has been blocked by CORS policy: No 'Access-Control-Allow-Origin' header is present on the requested resource. If an opaque response serves your needs, set the request's mode to 'no-cors' to fetch the resource with CORS disabled.
pdf.min.js:1 GET http://www.orimi.com/pdf-test.pdf net::ERR_FAILED

_createStreamSink @ pdf.min.js:1
_onComObjOnMessage @ pdf.min.js:1
iframe.html:1 Uncaught (in promise) e {name: "UnknownErrorException", message: "Failed to fetch", details: "UnknownErrorException: Failed to fetch"}

Ниже приведен код моего средства просмотра PDF для javascript / html, пожалуйста, дайте мне знать, как решить эту проблему. Я что-то упустил?: 

<html lang="en">
<head>

<script     src="https://cdnjs.cloudflare.com/ajax/libs/pdf.js/2.0.943/pdf.min.js"></script>

    <style>
        #canvas_container {
            width: 800px;
            height: 450px;
            overflow: auto;
            background: #333;
            text-align: center;
            border: solid 3px;
        }
    </style>

</head>



<body>

    <div id="my_pdf_viewer">

         <!-- previewer -->
        <div id="canvas_container">
            <canvas id="pdf_renderer"></canvas>
        </div>

        <!-- page buttons -->
        <div id="navigation_controls">
            <button id="go_previous">Previous</button>
            <input id="current_page" value="1" type="number"/>
            <button id="go_next">Next</button>
        </div>


        <!-- zoomo -->
        <div id="zoom_controls">  
            <button id="zoom_in">+</button>
            <button id="zoom_out">-</button>
        </div>

    </div>


  <script>
        var myState = {
            pdf: null,
            currentPage: 1,
            zoom: 1
        }

        function render() {
          myState.pdf.getPage(myState.currentPage).then((page) => {

        // more code here

         });

            var canvas = document.getElementById("pdf_renderer");
        var ctx = canvas.getContext('2d');

        var viewport = page.getViewport(myState.zoom);
        canvas.width = viewport.width;
        canvas.height = viewport.height;
        page.render({
            canvasContext: ctx,
            viewport: viewport
        });

        }


        pdfjsLib.getDocument('http://www.orimi.com/pdf-test.pdf').then((pdf) => {

        myState.pdf = pdf;
        render();

        });


    </script>

</body>

</html>

Вышеупомянутый код использует библиотеку pdf. js.

...