<p>pdf.js tidak berfungsi dengan requirejs</p>

Dibuat pada 3 Mei 2016  ·  18Komentar  ·  Sumber: mozilla/pdf.js

HTML berikut menunjukkan masalah:

<html> <head> <title>Flexpaper React/Require Sandbox</title> <script src="https://cdnjs.cloudflare.com/ajax/libs/require.js/2.2.0/require.js"></script> <script> require(['pdf'], function(pdf) { console.log('PDFJS Module: ' + pdf); console.log('PDFJS Global: ' + window.PDFJS); }); </script> </head> </html>

pdf.js, mendeteksi keberadaan fungsi "memerlukan" dan "menentukan" dan karenanya TIDAK menyetel instance PDFJS global. Namun, itu juga tidak mengembalikan referensi ke instance itu melalui pemuat modul.

Karena "pdf" dan "window.PDFJS" tidak ditentukan dalam contoh di atas, perpustakaan tidak dapat digunakan dalam aplikasi yang menggunakan require. Ini adalah kasus terlepas dari apakah require digunakan untuk memuat pdf.js atau tidak.

Perhatikan bahwa ini berfungsi dengan benar dengan versi 1.0.1040 tetapi gagal dengan 1.4.20 dan 1.5.188. Saya tidak menguji dengan versi selain yang 3. Perilaku itu konsisten di ketiga versi antara Chrome dan Safari.

Komentar yang paling membantu

Karena saya sedikit kesulitan dengan referensi yang benar di RequireJS juga, saya akan meninggalkan solusi saya, yang merupakan bagian dari konfigurasi RequireJS:

paths: {
    'pdfjs-dist/build/pdf': 'myfolder/pdf.min',
    'pdfjs-dist/build/pdf.worker': 'myfolder/pdf.worker.min'
}

Ketika Anda melakukannya seperti itu, Anda bahkan tidak perlu menetapkan jalur ke pekerja ke PDFJS.workerSrc , seperti yang disarankan dalam contoh , karena pekerja akan ditemukan secara otomatis.

Semua 18 komentar

apa itu 'pdf'? bisa kasih contoh lengkapnya?

Tentu, saya akan menyiapkan repo Github untuk mendemonstrasikan lebih lengkap.

Ini reponya: https://github.com/MartinSnyder/pdfjs-with-requirejs

'pdf' adalah referensi modul yang membutuhkan mencoba untuk kembali ke fungsi itu. Dalam skenario itu, Requirejs secara dinamis memuat pdf.js dan mencoba mengembalikan 'referensi modul' ke fungsi panggilan balik, namun referensi modul tidak disetel. Anda dapat melihat beban dinamis terjadi melalui debugger jaringan browser.

Ini tidak akan menjadi masalah besar secara normal, kecuali bahwa sesuatu di dalam pdf.js mendeteksi bahwa ada pemuat modul dan kemudian TIDAK menyetel objek PDFJS global. Karena keduanya tidak ada, Anda tidak dapat menggunakan perpustakaan saat requirejs ada di halaman.

Perhatikan bahwa ini terjadi bahkan jika Anda tidak menggunakan require untuk memuat objek. Saya meletakkan referensi skrip yang dikomentari ke pdf.js di halaman. Jika yang ditempatkan sebelum membutuhkan, maka global akan diatur dengan benar. Jika itu ditempatkan setelah persyaratan, maka global TIDAK akan disetel.

Ada dua masalah dengan kode:

  1. modul tidak disebut dengan namanya, gunakan 'pdfjs-dist/build/pdf' (dan jika Anda memindahkan pdfjs-dist di tempat yang berbeda, gunakan require.config untuk mengubah lokasi)
  2. Anda menggunakan document.write, yang menghapus dokumen

Cobalah sesuatu seperti:

        require.config({paths: {'pdfjs-dist': './node_modules/pdfjs-dist'}});
        require(['pdfjs-dist/build/pdf'], function(pdf) {
            console.log('PDFJS Module: ' + pdf + '<br>');
            console.log('PDFJS Global: ' + window.PDFJS);
        });

Menutup seperti yang dijawab.

Perhatikan bahwa ini berfungsi dengan benar dengan versi 1.0.1040

Bekerja pada versi ini adalah efek samping dari requirejs memuat skrip sebagai tag skrip biasa -- tidak menunjukkan bahwa itu kompatibel dengan require.js

atur instance PDFJS global

PDFJS global akan dihapus di versi mendatang, jadi jika Anda menggunakan requirejs, Anda dapat menggunakan objek yang sama melalui pdf.PDFJS /

Sehubungan dengan poin 1:
Saya tidak menggunakan node untuk memasukkan pdf.js dalam contoh itu. Saya mengunduh distribusi resmi dan menyalin pdf.js ke direktori root sampel. Oleh karena itu, merujuknya sebagai 'pdf' adalah benar. Anda dapat memverifikasi ini dengan melihat contoh di debugger jaringan dan Anda akan melihat bahwa file tersebut diunduh dengan benar oleh require.

Sehubungan dengan poin 2:
Hal ini dilakukan untuk menyederhanakan contoh. Terlepas dari apa yang dilakukan contoh, referensi tidak ditentukan dan perpustakaan tidak dapat digunakan. Secara khusus, beralih ke console.log juga menunjukkan referensi sebagai tidak terdefinisi.

Sehubungan dengan Global PDFJS yang dihapus di versi mendatang:
Saya baik-baik saja dengan itu, tetapi bagaimana cara mereferensikan perpustakaan melalui pdf.PDFJS ketika pdf tidak ditentukan?

Saya tidak menggunakan simpul untuk memasukkan pdf.js dalam contoh itu

Saya tidak menganggap Anda menggunakan node.js.

mengunduh distribusi resmi dan menyalin pdf.js ke direktori root sampel.

PDF.js adalah perpustakaan dan terdiri dari banyak file, misalnya modul pdfjs-dist/build/pdf dapat memuat modul pdfjs-dist/build/pdf.worker

Oleh karena itu, merujuknya sebagai 'pdf' adalah benar.

Anda masih perlu menggunakan nama AMD apa pun yang tercantum dalam definisi, lihat https://github.com/MartinSnyder/pdfjs-with-requirejs/blob/master/pdf.js#L21

Apakah Anda mencoba contoh di atas dengan require.config menunjuk ke perpustakaan lengkap?

Apakah Anda mencoba contoh di atas dengan require.config menunjuk ke perpustakaan lengkap?

Saya baru saja menyelesaikannya sekarang dan berfungsi seperti yang Anda katakan.

Apakah itu berarti Anda tidak dapat menggunakan distribusi "unduhan" yang ditemukan di sini untuk tujuan ini?
https://mozilla.github.io/pdf.js/getting_started/#download

Selama Anda menggunakan paket simpul 'pdfjs-dist' Anda baik-baik saja, tetapi versi yang diunduh tidak seharusnya berfungsi dengan ini?

Selama Anda menggunakan paket simpul 'pdfjs-dist' Anda baik-baik saja, tetapi versi yang diunduh tidak seharusnya berfungsi dengan ini?

Saya pikir itu tidak terkait dengan subjek, tetapi Anda masih dapat menggunakan file pdf.js/pdf.worker.js dari paket ini, arahkan requirejs 'pdfjs-dist' ke lokasi zip (ini akan berfungsi sejak pdf.js dan pdf.js). file worker.js terletak di folder build).

Anda masih perlu menggunakan nama AMD apa pun yang tercantum dalam definisi, lihat https://github.com/MartinSnyder/pdfjs-with-requirejs/blob/master/pdf.js#L21

Ini adalah bagian kunci yang saya lewatkan dari pemahaman saya. Terima kasih telah meluangkan waktu untuk menjelaskannya kepada saya.

Hai, saya memiliki masalah serupa, jadi saya tidak akan membuka yang baru, tetapi tanyakan di sini, saya harap tidak apa-apa.
Saya mencoba menerapkan penampil berdasarkan https://github.com/mozilla/pdf.js/blob/master/examples/components/simpleviewer.js menggunakan require.js. Tetapi ketika saya membutuhkan file pdf.js dan pdf_viewer.js, PDFJS.PDFViewer tidak terdefinisi.

Berikut ini contoh repo: https://github.com/Lazzi/pdfjs-bower-requirejs

@Lazzi modul main.js Anda terlihat sangat aneh untuk AMD, coba:

define('main', ['pdfjs-dist/build/pdf', 'pdfjs-dist/web/pdf_viewer'], function(pdfjsLib, viewer, require) {

kompatibilitasnya bukan AMD, jadi saya tidak tahu cara kerjanya.

Ya, ini bukan AMD, tetapi require.js juga mendukung definisi modul semacam ini: http://requirejs.org/docs/api.html#cjsmodule.

Namun, perubahan yang Anda usulkan tidak memperbaiki masalah saya..

@Lazzi begitu, mari kita coba #7332 (nama AMD AFAIK penting)

@yurydelendik Berhasil ! Anda telah sangat membantu. Terima kasih.

ini dapat bekerja untuk Anda serta ditempatkan di require.config Anda

    map: {
        '*': {
            'pdfjs-dist/build/pdf.worker' : 'path/to/your/install/pdf.worker'
        }
    },

Fungsi peta pada dasarnya adalah penggantian string global dan '*' adalah dependensi mana yang akan digunakan untuk penggantian string -- sebagian besar digunakan untuk menyertakan versi lib yang berbeda untuk lib lain. Seperti memiliki 2 versi JQuery yang berjalan secara paralel. Hati-hati menggunakan -- karena ini hanya penggantian string, Anda mungkin akan mengganti jalur di dependensi lain jika cocok.

'*' dalam kasus ini mungkin hanya akan menjadi ketergantungan pdf.js utama.

Karena saya sedikit kesulitan dengan referensi yang benar di RequireJS juga, saya akan meninggalkan solusi saya, yang merupakan bagian dari konfigurasi RequireJS:

paths: {
    'pdfjs-dist/build/pdf': 'myfolder/pdf.min',
    'pdfjs-dist/build/pdf.worker': 'myfolder/pdf.worker.min'
}

Ketika Anda melakukannya seperti itu, Anda bahkan tidak perlu menetapkan jalur ke pekerja ke PDFJS.workerSrc , seperti yang disarankan dalam contoh , karena pekerja akan ditemukan secara otomatis.

Terima kasih @dmaxweiler! Saya berjuang dengan masalah yang sama -- saya mengalami kesulitan memuat pdf.js dengan benar saat menggunakan RequireJS juga. Solusi Anda berhasil untuk saya! Luar biasa. Terima kasih atas bantuan Anda.

Apakah halaman ini membantu?
0 / 5 - 0 peringkat