Comment convertir des fichiers PDF au format XML à l'aide de JavaScript

Le format de fichier PDF est un format de fichier largement utilisé qui peut être visualisé sur une variété d'appareils et de plates-formes et préserve la structure et le formatage du document. Cependant, dans certains cas, nous devons modifier ou éditer le contenu des fichiers PDF, et les fichiers PDF ne sont pas un format de fichier facile à éditer ou à modifier. Par conséquent, il sera plus pratique de convertir des fichiers PDF au format XML, car le format XML est facile à analyser et à modifier et peut être adapté à divers environnements d'application.

Cet article expliquera comment utiliser JavaScript pour convertir des fichiers PDF au format XML, ainsi qu'analyser et extraire des données dans des fichiers XML.

PDF vers XML

Étape 1 : Obtenez la bibliothèque PDF.js

Pour convertir des fichiers PDF en fichiers XML en JavaScript, nous devons utiliser la bibliothèque PDF.js. PDF.js est une bibliothèque JavaScript permettant de restituer des fichiers PDF dans des applications Web. La bibliothèque est disponible sur son site officiel (http://mozilla.github.io/pdf.js/).

Étape 2 : Créer une page HTML

Nous devons introduire le fichier de bibliothèque PDF.js et les autres fichiers JavaScript nécessaires dans la page HTML.

<meta charset="UTF-8">
<title>PDF to XML Conversion</title>
<script type="text/javascript" src="pdf.js"></script>
<script type="text/javascript" src="pdf.worker.js"></script>
<script type="text/javascript" src="xmlwriter.js"></script>
<script type="text/javascript" src="pdf2xml.js"></script>

<input type="file" id="pdf-file" onchange="handleFileSelect()">
<div id="pdf-holder"></div>
<div id="xml-holder"></div>

Dans ce HT ML Dans la page, nous avons créé un élément d'entrée pour télécharger des fichiers PDF et deux éléments div pour afficher respectivement les fichiers PDF et les fichiers XML convertis.

Étape 3 : Créer un fichier JavaScript

Nous devons créer un fichier JavaScript nommé pdf2xml.js pour convertir les fichiers PDF en fichiers XML.

var pdfDoc = null,

pageNum = 1,
pageRendering = false,
pageNumPending = null,
canvas = document.createElement('canvas'),
ctx = canvas.getContext('2d');

/**

• Obtenir le texte de la page
  */
  function getPageText(pageNum, textContent) {
  return new Promise(function(resolve, rejet) {

    pageRendering = true;
    pdfDoc.getPage(pageNum).then(function(page) {
  
        var viewport = page.getViewport(1.0);
        canvas.height = viewport.height;
        canvas.width = viewport.width;
  
        var renderContext = {
            canvasContext: ctx,
            viewport: viewport
        };
  
        page.render(renderContext).promise.then(function() {
  
            var textLayer = document.createElement('div');
            textLayer.setAttribute('class', 'textLayer');
            document.getElementById('pdf-holder').appendChild(textLayer);
  
            var viewport = page.getViewport(1.0);
            var textContent = new TextContent();
            page.getTextContent({normalizeWhitespace: true }).then(function(content) {
                textContent = content;
  
                var textLayerDiv = document.getElementById('pdf-holder').getElementsByClassName('textLayer')[0];
                PDFJS.renderTextLayer({
                    textContent: textContent,
                    container: textLayerDiv,
                    viewport: viewport,
                    textDivs: []
                });
  
                resolve(textContent);
            });
        });
    });

  });
  }

/**

• Obtenir le bloc de contenu texte
  */
  function getTextBlocks(textContent) {
  var textBlocks = [];

  for (var i = 0; i < textContent.items.length; i++) {

    var item = textContent.items[i];
  
    // 判断是否是文本
    if (item.str.trim().length > 0) {
        var textBlock = {
            x: item.transform[4],
            y: item.transform[5],
            w: item.width,
            h: item.height,
            text: item.str
        };
  
        textBlocks.push(textBlock);
    }</p>
  <p>}</p>
  <p> return textBlocks;<br>}</p>
  </li></ul>
  <p>/**</p>
  <ul><li>
  <p>Générer un fichier XML<br>*/<br>function generateXML(textBlocks) {<br> var xmlString = '<?xml version="1.0" encoding="utf-8"?>n< document>n';</p>
  <p>// Créer XMLWriter<br> var xml = new XMLWriter(' ');</p>
  <p>// Ajouter des données XML<br> xml.beginElement('pages');</p>
  <p>for (var i = 0; i &lt ; textBlocks.length; i++) {</p>
  <pre class="brush:php;toolbar:false">  var textBlock = textBlocks[i];
  
    xml.beginElement('page');
    xml.writeAttribute('number', pageNum);
    xml.writeAttribute('x', textBlock.x.toFixed(2));
    xml.writeAttribute('y', textBlock.y.toFixed(2));
    xml.writeAttribute('width', textBlock.w.toFixed(2));
    xml.writeAttribute('height', textBlock.h.toFixed(2));
    xml.text(textBlock.text);
    xml.endElement();

  }

  xml.endElement();

  xmlString += xml.toString();
  xmlString += 'n';

  document.getElementById(' xml-holder').innerHTML = xmlString;
  }

/**

• Traitement du téléchargement du fichier
  */
  function handleFileSelect() {
  var file = document.getElementById('pdf-file').files[0];

  if (file) {

    var fileReader = new FileReader();
    fileReader.onload = function(e) {
        var data = new Uint8Array(e.target.result);
        PDFJS.getDocument(data).then(function(pdfDoc_) {
            pdfDoc = pdfDoc_;
  
            // 获取文本
            getPageText(pageNum).then(function(textContent) {
  
                // 获取文本块
                var textBlocks = getTextBlocks(textContent);
  
                // 生成XML文件
                generateXML(textBlocks);
  
            });
  
        });
    };
    fileReader.readAsArrayBuffer(file);

  }
  }

Lorsque l'utilisateur télécharge le fichier PDF, la fonction handleFileSelect chargera le fichier et obtiendra le document PDF et son contenu. La fonction getPageText affichera la première page du fichier PDF téléchargé, puis obtiendra le contenu textuel de la page. Nous utiliserons la bibliothèque PDF.js pour obtenir le texte. La fonction

getTextBlocks obtiendra des blocs de contenu de texte et les stockera dans un tableau. La fonction generateXML utilisera XMLWriter pour générer des fichiers XML.

Enfin, nous devons introduire la bibliothèque XMLWriter dans le fichier JavaScript.

Étape 4 : Créer une bibliothèque XMLWriter

XMLWriter.js est une bibliothèque JavaScript qui génère des fichiers XML. Vous pouvez obtenir la bibliothèque sur http://www.inline-graphics.de/inlinegraphics/xmlwriter/xmlwriter.js.

La conversion de fichiers PDF en fichiers XML à l'aide de JavaScript est très simple et le processus ne comporte que quelques étapes :

1. Obtenez la bibliothèque PDF.js.
2. Créez une page HTML de base.
3. Créez un fichier JavaScript pour la conversion PDF en XML.
4. Créez la bibliothèque XMLWriter.

Analyser et extraire des données à partir de fichiers XML

Il existe de nombreuses façons d'analyser et d'extraire des données à partir de fichiers XML. Dans cet article, nous expliquerons comment extraire des données de fichiers XML à l'aide de XPath et jQuery.

Étape 1 : Extraire des données de fichiers XML à l'aide de XPath

XPath est un langage permettant de localiser et de sélectionner des éléments dans des documents XML et HTML. Grâce à XPath, nous pouvons extraire des données de fichiers XML.

var xmlDoc = $.parseXML(xmlText),

$xml = $(xmlDoc),
$pages = $xml.find('pages'),
$page = $pages.find('page[number="1"]');

var text = $page.text();

Dans l'extrait de code ci-dessus, nous analysons le texte XML dans un objet de document XML à l'aide de jQuery et de XPath de il Extraire les données.

Étape 2 : Extraire les données du fichier XML à l'aide de jQuery

En utilisant jQuery, nous pouvons facilement extraire les données du fichier XML.

var xmlDoc = $.parseXML(xmlText),

$xml = $(xmlDoc),
$page = $xml.find('page[number="1"]');

var text = $page.text();

Dans l'extrait de code ci-dessus, nous analysons d'abord le texte XML dans un document XML à l'aide de jQuery et l'extrayons de celui-ci. en utilisant les données d'extraction jQuery. Dans cet exemple, nous recherchons la page numéro 1 et y obtenons le contenu du texte.

Conclusion

Dans cet article, nous avons expliqué comment convertir des fichiers PDF en fichiers XML à l'aide de JavaScript et de la bibliothèque PDF.js, et générer des fichiers XML à l'aide de la bibliothèque XMLWriter. Nous avons également expliqué comment utiliser XPath et jQuery pour extraire des données de fichiers XML.

Les fichiers XML sont plus faciles à analyser et à traiter que les fichiers PDF. En convertissant les fichiers PDF en fichiers XML, nous pouvons faciliter la gestion et l'utilisation des données, et les utiliser dans divers environnements d'application.

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!