Question

我正在创建一个离线翻页书。

如果我在MAMP本地服务器上运行该站点，则javascript会链接到PDF。但是当我尝试运行代码而不是在本地服务器（桌面）上时，它无法加载带有错误的PDF：

XMLHttpRequest cannot load file:///Users/pmdesign7imac/Downloads/wow_book_plugin%202/examples/pdf/pdf_example.pdf. Cross origin requests are only supported for protocol schemes: http, data, chrome, chrome-extension, https.

是否可以在不在服务器上的情况下链接到文件？

CODE：

<!DOCTYPE html>
<html class="no-js">
<head>
    <meta charset="utf-8">
    <title></title>
    <meta name="HandheldFriendly" content="True">
    <meta name="MobileOptimized" content="320">
    <meta name="viewport" content="width=device-width, initial-scale=1, minimal-ui,maximum-scale=2">
    <meta name="viewport" content="width=device-width, initial-scale=1, minimal-ui,maximum-scale=1">
    <meta http-equiv="cleartype" content="on">

    <link rel="stylesheet" href="css/normalize.css">
    <link rel="stylesheet" href="./wow_book/wow_book.css" type="text/css" />
    <link rel="stylesheet" href="css/main.css">

    <script src="js/vendor/modernizr-2.7.1.min.js"></script>
</head>
<body>
    <div class='book_container'>
        <div id="book"></div>
    </div>

    <script src="js/vendor/jquery-1.11.2.min.js"></script>

    <script src="js/helper.js"></script>

    <script type="text/javascript" src="./wow_book/pdf.combined.min.js"></script>
    <script src="./wow_book/wow_book.min.js"></script>
    <script>
        $(function(){
            var bookOptions = {
                 height   : 500
                ,width    : 800
                // ,maxWidth : 800
                ,maxHeight : 600

                ,centeredWhenClosed : true
                ,hardcovers : true
                ,pageNumbers: false
                ,toolbar : "lastLeft, left, right, lastRight, toc, zoomin, zoomout, slideshow, flipsound, fullscreen, thumbnails, download"
                ,thumbnailsPosition : 'left'
                ,responsiveHandleWidth : 50

                ,container: window
                ,containerPadding: "20px"
                ,pdf: "pdf_example.pdf"

            $('#book').wowBook( bookOptions );

        })
    </script>

</body>
</html>

Answer 1

在本地服务器上运行您的网站localhost而不是打开html文件

XMLHttpRequest无法加载file：///

1 个答案: