如何在Laravel中使用Viewer js

Hello I'm trying to display PDF documents with ViewerJS plugin but it doesn't work properly. As documentation says I have <iframe id="viewer" src = "{{URL::to('/')}}/ViewerJS/#../uploads/files/{{$video->source}}" width='100%' height='600' allowfullscreen webkitallowfullscreen></iframe> I have ViewerJS folder in public folder and my pdf files in public/uploads/files folder. When I use this url it shows my page in frame instead of document. Where is a mistake?

Although this is old question, I would like to share how I got that working:

Step 1: Download ViewerJs - http://viewerjs.org/releases/ViewerJS-latest.zip

Step 2: Extract this in public directory of Laravel (I used it with Laravel 4.0)

Step 3: Now, extract another copy in Views folder. That means, you will have ViewerJs library at two locations. One inside public (public/ViewerJs) folder and another will be at (views/ViewerJs)

Step 4: Add below code in your app/routes.php

//DocumentViewer Library
Route::any('ViewerJS/{all?}', function(){

    return View::make('ViewerJS.index');
});

Step 5: Now, add any sample PDF file in your public folder (for testing purpose)

Step 6: Open below URL in your browser

http://example.com/ViewerJS/index.html#../demodoc.pdf

Please replace example.com (in my case this was localhost/webapp) by your project path and replace demodoc.pdf by name of sample PDF file that you added in public folder.

That's it. This will work fine.

You should do as follows:

  1. copy the content of ViewerJS folder e.g in your public/viewerjs

  2. edit PluginLoader.js, ODFViewerPlugin.js, PDFViewerPlugin.js and search for the string ./ and change it to the relative path of the directory, in my example viewer/
    Ex.: in PluginLoader.js, you will find:

    loadPlugin('./ODFViewerPlugin', function () { Plugin = ODFViewerPlugin; });

    replace this to:

    loadPlugin('viewerjs/ODFViewerPlugin', function () { Plugin = ODFViewerPlugin; });

  3. create a GET route like: Route::get('/ViewerJS/{all?}', array('as' => 'pdfViewer', 'uses' => 'YOURCONTROLLER@pdfViewer'));

  4. create the method in you controller like:

    public function pdfViewer() { return View::make('pdfview.view'); }

  5. Create your the view and paste the entire content of the index.html, it's inside the ViewerJS folder. Don't forget to replace all css and javascript file references with:

    {{ asset('viewerjs/viewer.css') }}

    {{ asset('viewerjs/viewer.js') }}

    {{ asset('viewerjs/PluginLoader.js') }}

  6. Call the route like: http://www.xxxxx.com/ViewerJS#YOUR_PATH_TO_THE_PDF_FILE_UNDER_THE_PUBLIC_FOLDER example: uploads/pdfs/test.pdf
    Note that you don't have to specify public/uploads/pdfs/test.pdf !!