Pdf.js: Comment faire fonctionner pdf.js?

C'est un endroit pour signaler les bogues. Ce n'est pas un forum de support.
Veuillez lire le README sur la première page et regardez le visualiseur et des exemples
http://mozilla.github.io/pdf.js/web/viewer.html
http://jsbin.com/pdfjs-helloworld-v2/edit#html , en direct
http://jsbin.com/pdfjs-prevnext-v2/edit#html , en direct

Merci benbro,
Je ne le savais pas - j'ai jeté un coup d'œil à tous les documents de support en vain.

Souhaitez-vous s'il vous plaît suggérer un site Web qui pourrait offrir un tel soutien?
Merci d'avance.

Toutes les informations que vous recherchez se trouvent sur le README en première page:
https://github.com/mozilla/pdf.js/blob/master/README.md
Regardez sous la section des questions.

@AliND Les exemples fournis par @benbro devraient faire l'affaire. Il est en effet préférable de télécharger l'intégralité du fichier zip ou tp cloner le référentiel. Je l'ai fait fonctionner en clonant simplement le référentiel et en l'exécutant sur une instance XAMPP locale. N'oubliez pas que le visualiseur réel se trouve dans le fichier web/viewer.html , donc la visite du dossier racine ne résultera que dans une liste de dossiers.

Essayez-vous de le faire fonctionner sur un serveur Web ou sur une instance XAMPP / WAMP locale? Veuillez publier des informations supplémentaires (messages d'erreur / avertissements exacts de la console et du système d'exploitation / du navigateur) si vous continuez à recevoir des erreurs. Si vous le téléchargez sur un serveur Web, un lien vers votre visionneuse peut également vous aider à détecter tout problème. Nous serons heureux de vous aider si vous n'arrivez vraiment pas à le comprendre vous-même. :)

@timvandermeij Je vous remercie d'abord pour votre aimable réponse. Je remercie aussi beaucoup @benbro , mais les liens ne m'ont pas aidé à résoudre le problème.

J'ai remarqué que beaucoup de gens ont (avaient) le même problème. Certains l'avaient non résolu, tandis que ceux qui l'avaient résolu n'ont pas montré les étapes! Je crois qu'écrire un si petit guide sur la façon de le faire fonctionner pour les débutants serait très utile.

@timvandermeij , je ne peux pas installer XAMPP ou tout autre agent serveur pour certaines raisons. Je viens de créer un compte gratuit, auquel vous pouvez accéder avec les détails d'utilisateur ftp suivants:
Noms d'hôte: pdfjs.eu.pn
Nom d'utilisateur FTP: 1468147_admin
Mot de passe FTP: bonjour123?

J'ai essayé trois approches différentes et j'ai reçu trois avertissements PDF différents:

1- J'ai tout téléchargé avec WinHTTrack, puis les ai téléchargés et j'obtiens cette erreur:
http://pdfjs.eu.pn/pdf.js/web/viewer.html
ou "InvalidPDFException". Il est étrange, cependant, que je puisse l'ouvrir hors ligne (sans serveur installé) en utilisant Safari, bien que ce ne soit pas entièrement correct.

2- J'obtiens cette erreur (pas de message d'avertissement), mais la page ne s'affiche pas
http://pdfjs.eu.pn/pdf2.js/web/viewer.html

3- Si je télécharge tout le dossier zippé (tous les fichiers), j'arrive à cette erreur:
[une erreur se est produite lors du traitement de cette directive]
et puis, le design est perdu, tout ce qu'il montre, ce sont des boutons et des champs.

J'apprécie vraiment votre aide.
En attente de vos suggestions - Merci beaucoup
AliND

En regardant http://pdfjs.eu.pn/pdf.js/build/pdf.js , il y a "GET" remplacé par "GET.html" sur votre serveur (probablement un programme de mise en miroir), par exemple:

      };

      xhr.open('GET.html', this.url);
      for (var property in this.httpHeaders) {
        var value = this.httpHeaders[property];

A le http://mozilla.github.io/pdf.js/build/pdf.js il est sans ".html". Clôture du problème comme invalide.

utilisez git pour extraire le brach gh-pages avec le code de production: git clone -b gh-pages https://github.com/mozilla/pdf.js.git pdfjs-gh-pages

Merci beaucoup @yurydelendik - J'apprécie vraiment votre contribution.

Cependant, je suis novice avec php et javascript.

J'ai essayé votre conseil (GET), et c'est effectivement utile. Maintenant, le chargeur affiche, mais pas le document. En fait, lorsque j'ai téléchargé les dossiers web & src pour la première fois, je l'ai fait, en fonction de votre indice dans le fil suivant:
https://github.com/mozilla/pdf.js/issues/2371 (veuillez noter que l'erreur que j'ai reçue dans ce cas était: [une erreur s'est produite lors du traitement de cette directive])

Je ne connais pas Yury, mais il semble que de nombreux débutants soient confrontés au même problème. Je veux dire, je crois fermement qu'il existe un moyen simple, comme dans l'exemple suivant (mentionné précédemment), où il vous suffit de télécharger les dossiers pour le faire fonctionner, ce sera très utile pour moi, ainsi que pour beaucoup d'autres.
http://www.worldwidewhat.net/2011/08/render-pdf-files-with-html5/

Je ne veux pas avoir l'air de mettre mon bruit dans les affaires des autres, mais fournir un très court tutoriel à ce sujet pour les débutants, dans la page principale Pdf.js, serait très utile.

Que mon problème soit résolu ou non, je vous remercie tous pour votre aimable assistance.
Tout le meilleur //
AliND

Pour les débutants, beaucoup de choses peuvent mal tourner. La première chose que je recommande aux débutants est de suivre le fichier README, les FAQ et les conseils fournis dans les numéros. Avez-vous pu configurer node.js, cloner un projet à l'aide de git et le construire? Avez-vous essayé de suivre mes conseils pour utiliser la commande git ci-dessus?

Le déploiement du pdf.js sur la plate-forme personnalisée est hors de la portée de ce projet, cependant nous serons heureux d'accepter les instructions détaillées étape par étape des contributeurs / experts pour une plate-forme particulière (sous forme de page wiki). Si vous pensez qu'il nous manque quelque chose et que vous savez comment résoudre le cas courant, veuillez créer une page wiki.

@AliND Il semble que certains fichiers vous manquent. Le visualiseur sur http://pdfjs.eu.pn/pdf.js/web/viewer.html me semble correct, mais la console affirme que:

 "NetworkError: 404 Not Found - http://pdfjs.eu.pn/pdf.js/build/compressed.tracemonkey-pldi-09.pdf"

c'est-à-dire que le fichier PDF n'existe pas à cet emplacement. Placez-le là, et ça devrait aller.

Le deuxième lien ne fonctionne pas car il vous manque les fichiers suivants:

 "NetworkError: 404 Not Found - http://pdfjs.eu.pn/pdf2.js/external/webL10n/l10n.js"
 l10n.js
 "NetworkError: 404 Not Found - http://pdfjs.eu.pn/pdf2.js/external/jpgjs/jpg.js"
 jpg.js
 "NetworkError: 404 Not Found - http://pdfjs.eu.pn/pdf2.js/external/webL10n/l10n.js"
 l10n.js
 "NetworkError: 404 Not Found - http://pdfjs.eu.pn/pdf2.js/external/jpgjs/jpg.js"

Veuillez vérifier et vous assurer que les fichiers mentionnés se trouvent sur ce chemin. Pour ce que je peux dire, cela devrait le faire. Astuce: utilisez la console Firefox ( CTRL + Shift + K ) pour voir les erreurs que j'ai mentionnées ci-dessus; ils vous aideront à déceler tout problème.

@AliND http://pdfjs.eu.pn/pdf.js/web/viewer.html fonctionne maintenant partiellement car j'ai ajouté le fichier PDF au répertoire de construction. Le fait que cela soit nécessaire peut indiquer que quelque chose de louche s'est produit pendant le processus de construction. J'examinerai cela un peu plus pour vous et j'espère vous donner de meilleurs commentaires.

@AliND Ici vous allez: http://pdfjs.eu.pn/pdf3.js/web/viewer.html

Ce que j'ai fait:

1. Téléchargez https://github.com/mozilla/pdf.js/archive/master.zip.
2. Extrayez-le.
3. Téléchargez le dossier entier dans le dossier pdf3.js de votre compte FTP (j'ai omis deux gros fichiers PDF de test car ils ne sont pas nécessaires et le serveur FTP gratuit avait des problèmes avec eux).

Rien de spécial, de si étrange que cela fonctionne pour moi. Le deuxième lien manque définitivement de dossiers, c'est pourquoi cela n'a pas fonctionné. Je n'ai aucune idée de la raison pour laquelle le premier lien ne fonctionne pas comme il le devrait, mais je suppose que la construction de PDF.js n'a pas été entièrement réussie.

Bien que cela fonctionne très bien, je suis d'accord qu'il vaut mieux le construire au lieu de simplement le décompresser. J'espère que vous pouvez travailler avec cela pour le moment. En attendant, je vais essayer de créer moi-même PDF.js et de le tester sur votre serveur. Si je peux faire fonctionner cela, je posterai également les étapes et j'espère que tous les problèmes seront résolus alors :-)

@AliND La version intégrée fonctionne également pour moi, même si https://github.com/mozilla/pdf.js/wiki/Setup-PDF.js-in-a-website-%28Debian-Ubuntu%29#wiki -Setup_testing_environnement, mais cela ne m'a pas tout à fait donné un bon résultat. J'ai fait ce qui suit pour le faire fonctionner sur votre serveur (lien ici: http://pdfjs.eu.pn/pdf.js-build/web/viewer.html):

1. Définissez la fin de ligne correcte si vous êtes sous Windows comme moi: git config --global core.autocrlf input (avant l'étape suivante, ou l'étape 3 échouera!).
2. Clonez le référentiel à partir de mon fork, en utilisant git clone https://github.com/timvandermeij/pdf.js.git (mais vous devez utiliser le référentiel https://github.com/mozilla/pdf.js toujours à jour).
3. Exécutez la commande make: node make generic .
4. Après cela, j'ai ignoré le reste de https://github.com/mozilla/pdf.js/wiki/Setup-PDF.js-in-a-website-%28Debian-Ubuntu%29#wiki -Setup_testing_environnement, depuis cela n'a pas fonctionné pour moi. Il ne copiait pas les bons fichiers. Ce que j'ai fait, c'est d'aller dans le dossier build/generic qui a été créé à l'étape 3 et de télécharger le dossier build et web sur le serveur Web. Cela l'a fait.

J'espère que vos problèmes seront résolus en suivant les étapes que j'ai fournies ici et dans mon commentaire précédent. Bonne chance (et désolé pour le mur de texte!). :-)

@yurydelendik Je trouve également le manuel sur https://github.com/mozilla/pdf.js/wiki/Setup-PDF.js-in-a-website-%28Debian-Ubuntu%29#wiki -Setup_testing_environnement légèrement déroutant. Dans la section From build to production par exemple, vous copiez quelques fichiers dans un répertoire de production, mais pdf.js lui-même n'est pas copié, ce qui crée un répertoire de production avec uniquement les fichiers de la visionneuse et non les fichiers de base. J'ai le sentiment qu'il manque des étapes là-bas. Pouvez-vous vérifier cela? Je peux également réécrire la page wiki en utilisant les étapes ci-dessus si vous le souhaitez, car je pense que ce sera plus clair pour les débutants (ou nous devons étendre la page wiki actuelle avec plus d'étapes pour inclure les fichiers de base).

@timvandermeij , vous avez donc suivi les instructions d'ubuntu pour le configurer sous Windows? oui, vous aurez besoin d'un environnement spécial pour Windows pour faire cela (pas facile à configurer pour les débutants, par exemple https://github.com/mozilla/pdf.js/wiki/Setting-up-pdf.js-Development-Environment-for -Les fenêtres). Oui, le wiki est déroutant, mais un intérêt pour "l'environnement de test" indique déjà que vous n'êtes pas un débutant. Mais oui, si vous trouvez cela déroutant et que vous avez trouvé le bon moyen, veuillez faire un changement (mais en cas de Windows, cela mérite une autre page wiki)

Ajout d'une entrée à la FAQ: https://github.com/mozilla/pdf.js/wiki/Frequent-Asked-Questions#wiki -gh-pages

@yurydelendik Merci. J'ai pratiquement fait la même chose sur Windows que sur Arch Linux par exemple, mais je vais essayer d'étendre le wiki. :)

@yurydelendik J'ai étendu la page d'instructions Linux sur https://github.com/mozilla/pdf.js/wiki/Setup-PDF.js-in-a-website-%28Linux%29 pour résoudre les problèmes que j'ai rencontrés avec et aussi pour corriger certaines erreurs textuelles. Cette page me semble bien maintenant. Plus tard dans la journée, je créerai le même type de page, mais je me concentrerai ensuite sur Windows (qui est actuellement une tâche à faire). Espérons que l'ajout de plus d'instructions causera moins de confusion parmi les utilisateurs. :)

Edit: voici la version Windows: https://github.com/mozilla/pdf.js/wiki/Setup-PDF.js-in-a-website-%28Windows%29

J'espère que vous êtes satisfait des modifications apportées aux pages Linux et Windows du wiki. Je pense qu'ils sont plus faciles à comprendre maintenant, et maintenant nous avons aussi de la documentation pour Windows :)

@timvandermeij merci d'avoir fait ça.

@timvandermeij : Ce que vous avez fait est exceptionnel; merci pour chaque seconde que vous y avez passée. Je suis sûr à 100% que cela sera également utile pour beaucoup d'autres. La vérification est en cours, je reviendrai très prochainement avec le résultat.

@yurydelendik : Merci beaucoup pour votre contribution, il semble que Tim a tout fait!

Merci encore et tout le meilleur //
AliND

@AliND , @yurydelendik Très heureux de vous aider! Je voudrais en effet entendre le résultat. :-)

@timvandermeij
Incroyable, tout ce qu'il fallait faire était d'insérer le fichier pdf dans le dossier de construction!

Les seuls dossiers nécessaires sont le Web! et la construction (avec seulement le pdf.js et le fichier pdf à construire). De plus, le dossier locale (avec locale.properties à l'intérieur, si nous copions le fichier de github vers le serveur local) doit être inclus dans le dossier web.

Pour cette méthode assez simple et directe, vous êtes remercié @timvandermeij pour savoir où placer le fichier pdf (dans le dossier de construction) et @yurydelendik pour avoir résolu le problème GET.html.

http://pdfjs.eu.pn/pdffinal/web/viewer.html

Mais il y a toujours un problème, il voit parfaitement dans Firefox, Chrome et Opera. Pour Explorer et Opera, cependant, il y a deux erreurs:
Safari: PDF manquant "sample.pdf". Mais quand même, le chargeur fonctionne bien!
Explorer: juste le style, rien ne charge!

Je veux dire, j'ai l'impression que c'est étrange parce que le Compatibility.js est là, et je me demande ce qui pourrait causer ce comportement pour ces navigateurs. Quoi qu'il en soit, j'ai également téléchargé tous les autres fichiers et dossiers mais je n'ai pas eu de chance !.

@timvandermeij : Si j'utilise votre méthode et télécharge le dossier entier comme je l'ai fait auparavant, j'obtiens l'erreur suivante dans le lien suivant. Veuillez noter que, peu importe si j'extrais et télécharge ou télécharge et extrait -> même problème. En outre, pdf.js-master.zip & mozilla-pdf.js-v0.5.5-1283-gc682c25.zip sont les mêmes fichiers, donc je me demande pourquoi deux à la fois.

Je ne comprends tout simplement pas pourquoi! J'ai même téléchargé le dossier pdf3.js que vous avez téléchargé, je l'ai de nouveau téléchargé! et encore, ça ne marche pas!

Je veux dire, ce qui m'inquiète vraiment, c'est la raison pour laquelle cela ne fonctionne pas avec les deux autres navigateurs!

Des idées?

@timvandermeij J'ai installé GIT et j'ai rencontré différents types de problèmes. Ainsi, je préférerais me concentrer sur la première solution. Je me demande si vous pouvez me fournir des réponses aux deux questions suivantes:
1- Y a-t-il une raison pour laquelle le lien, que j'ai publié dans mon article précédent, ne fonctionne pas dans IE & Safari?
2- Lorsque vous avez téléchargé le dossier maître, avez-vous effectué des modifications par la suite?

Merci encore. J'apprécie votre aide ainsi que celle de @yurydelendik .

Tout le meilleur,
AliND

@timvandermeij @yurydelendik

Je l'ai fait fonctionner, merci Tim - J'ai utilisé l'inspecteur d'éléments Safari cette fois et pour certaines raisons, il se dirige vers web / sample.pdf au lieu de build / sample.pdf. Il en va de même pour Internet Explorer! Veuillez noter que les liens internes dans le fichier pdf ne fonctionnent pas dans IE, mais ce n'est pas un problème.

Sans aucun doute, la méthode de construction est la bonne, bien que l'on puisse créer un viewer.js séparé pour chaque fichier pdf.

Maintenant, si vous allez sur http://pdfjs.eu.pn/pdffinal/web/viewer.html , cela fonctionne dans tous les 5 navigateurs mentionnés. (note: parfois, les navigateurs ne trouvent pas certains fichiers sur ce serveur gratuit, mais sur le serveur payant - cela fonctionne sans aucun problème).

Pour les futurs utilisateurs, un moyen simple est:
1- Cloner http://mozilla.github.io/pdf.js/web/viewer.html (vous pouvez utiliser HTTrack).
2- Vous aurez deux dossiers: web & build (le dernier aura pdf.js qui est le plus important - HTTrack dans ce cas, combinez toutes les actions de build dans ce fichier)
2- Ouvrez le pdf.js (dossier de construction) et changez GET.html en GET
3- Ouvrez viewer.js (dossier Web) et changez le nom du fichier pdf en votre propre nom.
4- Mettez votre fichier pdf dans les dossiers Web (Safari et IE) et de construction (autres navigateurs) (vous pouvez modifier un peu, mettre le pdf.js dans le dossier Web, alors il ne serait pas nécessaire d'inclure le même pdf deux fois, mais cela peut nécessiter du travail!)
5- Télécharger
6- Cela devrait fonctionner maintenant! notez que cette méthode peut avoir des défauts dont je ne suis pas conscient.

@timvandermeij Je ne comprends tout simplement pas pourquoi cela ne fonctionne pas lorsque je télécharge le dossier principal!, car dans votre cas, cela a fonctionné parfaitement!

Quoi qu'il en soit, merci beaucoup pour votre aide et votre soutien, et je le répète, selon les instructions de @yurydelendik & @timvandermeij , "la bonne méthode" est celle de construction; mais comme je suis chercheur en finance, je ne peux pas vraiment approfondir la question des problèmes de temps.

Merci encore et à tous - tout le meilleur //
Ali

@AliND Ravi que vous l'ayez fait fonctionner! En effet, la méthode de construction est la meilleure façon de procéder, mais l'autre méthode devrait également fonctionner correctement. Je n'ai rien fait d'autre que de télécharger le fichier ZIP et de l'extraire sur le serveur. Aucune autre modification. Cela a fonctionné parfaitement, c'est donc étrange que cela n'ait pas fonctionné pour vous. Cependant, le plus important est que cela fonctionne dans tous les navigateurs pour vos besoins.

Merci également d'avoir placé vos étapes ici. Cela pourrait aider les futurs utilisateurs qui rencontrent encore des problèmes avec les pages wiki mises à jour. La manière décrite sur les pages wiki est certainement la voie à suivre et est une méthode de travail, mais si pour une raison quelconque cela ne fonctionne pas pour quelqu'un, vos étapes pourraient vous aider.

Je ne sais pas comment un mauvais lien vers un fichier PDF ne peut que casser Safari et IE, et pas les autres navigateurs. Il y a peut-être un problème avec ce compte gratuit, je ne peux pas le dire.

Heureux que cela fonctionne et tout le meilleur! :-)

@AliND De plus, notez que l'adaptation de viewer.js n'est pas la meilleure façon de procéder. Vous pouvez charger d'autres fichiers en utilisant le paramètre file dans l'URL, comme décrit dans https://github.com/mozilla/pdf.js/wiki/Setup-PDF.js-in-a-website-% 28Linux% 29 # ouverture -pdf-files-from-your-website. De cette façon, vous pouvez utiliser un fichier viewer.js et toujours ouvrir tous les fichiers PDF souhaités.

@timvandermeij Merci encore :)

En fait, votre méthode fonctionne parfaitement sur le serveur gratuit; Je viens de l'essayer mais il semble que j'ai le problème avec le serveur payant cette fois! Je viens d'ouvrir un ticket de support pour qu'ils puissent rechercher le problème.

Donc pour les futurs utilisateurs aussi, et mis à part la méthode de construction, ce que @timvandermeij a fait fonctionne parfaitement et c'est beaucoup plus facile que la méthode mentionnée précédemment. Pour référence:
1- Il suffit de télécharger le fichier zip principal, de l'extraire et de le télécharger, ou de télécharger et d'extraire si le panneau de contrôle le permet (la deuxième méthode est beaucoup plus rapide). Bien sûr, certains fichiers et / ou dossiers ne sont pas nécessaires, mais téléchargez simplement le tout: D.
2- Ouvrez le viewer.js (dans le dossier Web) et changez le nom du fichier pdf en votre propre nom. Téléchargez (re-upload) ce viewer.js
3- Téléchargez votre fichier pdf (avec le nom spécifié à l'étape 2) dans le dossier Web.
4- Terminé (si cela ne fonctionne pas, cela signifie qu'il y a un problème avec votre hôte; essayez un hôte gratuit et voyez par vous-même).

Merci encore Tim :)
Tout le meilleur //
Ali

Wow, la méthode du fichier est en effet très utile! :)

@timvandermeij vous avez fourni une solution complète à guichet unique :)

Merci encore et encore et tout le meilleur //
AliND

salut
Dans mon projet, j'ai besoin de charger la page pdf dans une iframe, j'ai donc utilisé la fonction php file_get_contents pour obtenir le contenu de viewer.html. Mais il y a une erreur lors du chargement de pdf
PDF.js v? (construire: ?)
Message: InvalidPDFException
la console est comme ci-dessous,
Erreur: en-tête de flux XRef non valide util.js: 186
à l'erreur (http://bacchus.weibo.com:8080/js/pdfjs/src/shared/util.js:188:15)
à Object.XRef_readXRef comme readXRef
à Object.XRef_parse comme analyse
à Object.PDFDocument_setup comme configuration
à Object.PDFDocument_parse comme analyse
à http://bacchus.weibo.com : 8080 / js / pdfjs / src / core / pdf_manager.js: 106: 26
à LocalPdfManager_ensure comme assurer
sur LocalPdfManager.BasePdfManager_ensureDoc en tant que ensureDoc
à http://bacchus.weibo.com : 8080 / js / pdfjs / src / core / worker.js: 54: 22
comme je suis frais en javascript, je ne comprends pas pourquoi cela s'est produit, est-ce que quelqu'un peut m'aider?

@xiaotun Le fichier PDF semble corrompu. Veuillez ouvrir un nouveau numéro et fournir plus de détails tels que le nom / la version du système d'exploitation, la version PDF.js et le nom / la version du navigateur.

Je reçois Avertissement: TT: fonction non définie: 32 dans la console.

Impossible de charger la source «VM_Unknown»: impossible de récupérer le contenu. VM_ Unknown: 1
@ types / pdfjs-dist pourrait être le problème mais il apparaît dans mon application angulaire sous forme de fichier tgz dans une URL !!!

Le pdf est rendu dans le navigateur ok, mais les entrées de formulaire ne sont pas là!

J'ai essayé de suivre ce tutoriel:
https://medium.com/factory-mind/angular-pdf-forms-fa72b15c3fbd