gwt - pdf.js例外を使用するとJavaScriptExceptionが発生します:(ReferenceError）：PDFJSが定義されていません

Question

    **In html file add script tag**



         <head>
             <script type="text/javascript" src="https://raw.github.com/mozilla/pdf.js/gh-pages/build/pdf.js"></script>
            </head>
            <body>
             <button id="prev" onclick="goPrevious()">Previous</button>
                <button id="next" onclick="goNext()">Next</button>
                &nbsp; &nbsp;
                <span>Page: <span id="page_num"></span> 
                 <span id="page_count"></span></span>
              </div>

             <div>
                <canvas id="the-canvas" width="700" style="border:1px solid black"></canvas>
              </div>
            </body>

クライアント側（pdf.java）では、JSNIを使用してJavaスクリプト機能を呼び出し、パブリックフォルダーにpdf.jsファイルを貼り付けて、次のように.gwt.xmlを呼び出します。

**I am just follow this link http://jsbin.com/pdfjs-prevnext-v2/1/edit**






            public void onModuleLoad() {
                alert1();
                }


            private native void alert1 ()
            /*-{
        var url = 'http://cdn.mozilla.net/pdfjs/tracemonkey.pdf';

        PDFJS.disableWorker = true;

        var pdfDoc = null,
            pageNum = 1,
            scale = 0.8,
            canvas = document.getElementById('the-canvas'),
            ctx = canvas.getContext('2d');

        function renderPage(num) {
            // Using promise to fetch the page
            pdfDoc.getPage(num).then(function(page) {
                var viewport = page.getViewport(canvas.width / page.getViewport(1.0).width);
                canvas.height = viewport.height;
                // Render PDF page into canvas context
                var renderContext = {
                    canvasContext: ctx,
                    viewport: viewport
                };
                page.render(renderContext);
            });


            document.getElementById('page_num').textContent = pageNum;
            document.getElementById('page_count').textContent = pdfDoc.numPages;
        }


        function goPrevious() {
            if (pageNum <= 1) return;
            pageNum--;
            renderPage(pageNum);
        }



        function goNext() {
            if (pageNum >= pdfDoc.numPages) return;
            pageNum++;
            renderPage(pageNum);
        }



        PDFJS.getDocument(url).then(function getPdfHelloWorld(_pdfDoc) {
            pdfDoc = _pdfDoc;
            renderPage(pageNum);
        });

            }-*/;

11：27：17.679[エラー][pdf]モジュールエントリポイントクラスcom.ruchi.client.Pdfをロードできません（詳細については、関連する例外を参照してください）com.google.gwt.core.client.JavaScriptException：（ReferenceError）：PDFJSはcom.google.gwt.dev.shell.ModuleSpaceOOPHM.doInvoke（ModuleSpaceOOPHM.java:136）のcom.google.gwt.dev.shell.BrowserChannelServer.invokeJavascript（BrowserChannelServer.java:248）で定義されていません.dev.shell.ModuleSpace.invokeNative（ModuleSpace.java:561）at com.google.gwt.dev.shell.ModuleSpace.invokeNativeVoid（ModuleSpace.java:289）at com.google.gwt.dev.shell.JavaScriptHost.invokeNativeVoid （JavaScriptHost.java:107）at com.ruchi.client.Pdf.alert1（Pdf.java）at com.ruchi.client.Pdf.onModuleLoad（Pdf.java:27）atsun.reflect。NativeMethodAccessorImpl.invoke0（Native Method）at sun.reflect.NativeMethodAccessorImpl.invoke（Unknown Source）at sun.reflect.DelegatingMethodAccessorImpl.invoke（Unknown Source）at java.lang.reflect.Method.invoke（Unknown Source）atcom.google。 gwt.dev.shell.ModuleSpace.onLoad（ModuleSpace.java:396）at com.google.gwt.dev.shell.OophmSessionHandler.loadModule（OophmSessionHandler.java:200）atcom.google.gwt.dev.shell.BrowserChannelServer。 processConnection（BrowserChannelServer.java:525）at com.google.gwt.dev.shell.BrowserChannelServer.run（BrowserChannelServer.java:363）at java.lang.Thread.run（Unknown Source）DelegatingMethodAccessorImpl.invoke（Unknown Source）at java.lang.reflect.Method.invoke（Unknown Source）at com.google.gwt.dev.shell.ModuleSpace.onLoad（ModuleSpace.java:396）at com.google.gwt.dev .shell.OophmSessionHandler.loadModule（OophmSessionHandler.java:200）at com.google.gwt.dev.shell.BrowserChannelServer.processConnection（BrowserChannelServer.java:525）at com.google.gwt.dev.shell.BrowserChannelServer.run（BrowserChannelServer .java：363）at java.lang.Thread.run（Unknown Source）DelegatingMethodAccessorImpl.invoke（Unknown Source）at java.lang.reflect.Method.invoke（Unknown Source）at com.google.gwt.dev.shell.ModuleSpace.onLoad（ModuleSpace.java:396）at com.google.gwt.dev .shell.OophmSessionHandler.loadModule（OophmSessionHandler.java:200）at com.google.gwt.dev.shell.BrowserChannelServer.processConnection（BrowserChannelServer.java:525）at com.google.gwt.dev.shell.BrowserChannelServer.run（BrowserChannelServer .java：363）at java.lang.Thread.run（Unknown Source）shell.BrowserChannelServer.processConnection（BrowserChannelServer.java:525）at com.google.gwt.dev.shell.BrowserChannelServer.run（BrowserChannelServer.java:363）at java.lang.Thread.run（Unknown Source）shell.BrowserChannelServer.processConnection（BrowserChannelServer.java:525）at com.google.gwt.dev.shell.BrowserChannelServer.run（BrowserChannelServer.java:363）at java.lang.Thread.run（Unknown Source）

    plz suggest me what i do....

score 3 · Accepted Answer

JavaScriptコードをやみくもにコピーしてJSNIブロックに貼り付けているだけです。

あなたのhtml jsブロックにある場合の例

function test() {
  alert('hello');  
}

あなたのJSNIで

private static native int test() /*-{
    var v = $wnd.test();
    return v;
  }-*/;

$wndの使い方に気づきましたか

1) HTML には

    <span>Page: <span id="page_num"></span> of <span id="page_count"></span></span>
    <div>
        <canvas id="the-canvas" width="700" style="border: 1px solid black"></canvas>
    </div>

2) pdf.js をローカルフォルダーに移動します (インターネット経由で要求する html ファイルの aovid スクリプトタグ)。

3) 代わりに<script src="PDF.js" />、module.gwt.xml ファイルに追加します。https://raw.github.com/mozilla/pdf.js/gh-pages/build/pdf.jsを GWT のパブリックフォルダーにコピーします。

4) JSNI コードを変更する

/*-{
    var url = 'http://cdn.mozilla.net/pdfjs/tracemonkey.pdf';

    $wnd.PDFJS.disableWorker = true;

    var pdfDoc = null,
        pageNum = 1,
        scale = 0.8,
        canvas =  $wnd.document.getElementById('the-canvas'),
        ctx = canvas.getContext('2d');

    function renderPage(num) {
        // Using promise to fetch the page
        pdfDoc.getPage(num).then(function(page) {
            var viewport = page.getViewport(canvas.width / page.getViewport(1.0).width);
            canvas.height = viewport.height;
            // Render PDF page into canvas context
            var renderContext = {
                canvasContext: ctx,
                viewport: viewport
            };
            page.render(renderContext);
        });


       $wnd.document.getElementById('page_num').textContent = pageNum;
       $wnd.document.getElementById('page_count').textContent = pdfDoc.numPages;
    }
    function goPrevious() {
        if (pageNum <= 1) return;
        pageNum--;
        renderPage(pageNum);
    }

    function goNext() {
        if (pageNum >= pdfDoc.numPages) return;
        pageNum++;
        renderPage(pageNum);
    }

    $wnd.PDFJS.getDocument(url).then(function getPdfHelloWorld(_pdfDoc) {
        pdfDoc = _pdfDoc;
        renderPage(pageNum);
    });
    }-*/;

5) Next/Prev も同様に解けるはずです。それを解決するためにもう 1 つの質問を提起することは避けてください。「HOMEWork」をやってみるといい

score 1 · Accepted Answer

1

JSNI 101 :$wnd.PDFJSの代わりに使用する必要がありPDFJSます。

于 2013-01-04T09:45:28.350 に答える

gwt - pdf.js例外を使用するとJavaScriptExceptionが発生します:(ReferenceError）：PDFJSが定義されていません

2 に答える 2

Related

Reference