Charger un document

L’API JavaScript permet d’interagir aisément avec ARender à l’aide de différentes commandes listées ici

Charger un document

Les fonctions loadDocument et openDocument de l’API, décrites ici permettent de charger et ouvrir un document sur le serveur d’ARender.

Attention, l'ouverture de documents étant sécurisée, il n'est possible d'ouvrir que les documents de votre espace documentaire.

Exemple d’implémentation depuis l’iframe

Les requêtes à l’API JS se font sur l’objet window de l’iframe, comme montré ci-dessous.

        const loadAndOpenDocument = () => {
          const iframeWindow = iframeRef.current?.contentWindow;

          if (iframeWindow) {
            iframeWindow.getARenderJS().loadDocument(
              "loadingQuery?url=url/du/document.zip",
              (id) => {
                console.log(id);
                iframeWindow.getARenderJS().openDocument(id);
              }
            );
          } else {
            console.error("iframe n'est pas accessible ou n'est pas chargée.");
          }
        };

        loadAndOpenDocument(): void {
        const iframeWindow = this.iframeRef.nativeElement.contentWindow;

        if (iframeWindow) {
          iframeWindow.getARenderJS().loadDocument(
            "loadingQuery?url=url/du/document.zip",
            (id: string) => {
              console.log(id);
              iframeWindow.getARenderJS().openDocument(id);
            }
          );
        } else {
          console.error("L'iframe n'est pas accessible ou n'est pas chargée.");
        }
      }

/**
 * Renvoie l'objet ARenderJS depuis l'iframe.
 * Lève une erreur si l'iframe n'est pas accessible ou n'est pas chargé.
 */
function getARenderJS() {
  const iframeWindow = iframeRef.value?.contentWindow
    ? iframeRef.value.contentWindow
    : undefined

  if (iframeWindow) {
    return iframeWindow.getARenderJS()
  }
  throw new Error("The iframe is not accessible or not loaded.")
}

/**
 * Charge et ouvre un document dans ARender.
 * @param url L'URL du document à charger.
 */
function loadAndOpenDocument(url) {
  getARenderJS().loadDocument("loadingQuery?url=" + url, id => {
    getARenderJS().openDocument(id)
  })
}

/**
 * Expose la fonction `loadAndOpenDocument` au composant parent.
 */
defineExpose({
  loadAndOpenDocument
})

/**
 * Renvoie l'objet ARenderJS depuis l'iframe.
 * Lève une erreur si l'iframe n'est pas accessible ou n'est pas chargé.
 */
function getARenderJS() {
  const iframeWindow = iframeRef?.contentWindow
    ? iframeRef.contentWindow
    : undefined

  if (iframeWindow) {
    return iframeWindow.getARenderJS()
  }
  throw new Error("The iframe is not accessible or not loaded.")
}

/**
 * Charge et ouvre un document dans ARender.
 * @param url L'URL du document à charger.
 */
export function loadAndOpenDocument(url) {
  getARenderJS().loadDocument("loadingQuery?url=" + url, id => {
    getARenderJS().openDocument(id)
  })
}

Attention si vous tentez d'intégrer ARender dans un répertoire local : pour interagir avec un fichier HTML local, il faut d'abord le servir sur le port localhost de votre choix.

Vous pouvez le faire très facilement de plusieurs façons, avec Python, Node.js, PHP ou autre. Voici un exemple avec Python 3.x :

  • Ouvrir une invite de commandes au niveau du répertoire de l'application hôte
  • Démarrer le serveur avec http-server -p 8000. (Remplacer 8000 par le port de votre choix)
  • Accéder au fichier HTML depuis votre navigateur avec l'URL http://localhost:8000/index.html

Pour charger et ouvrir un document dans ARender, vous pouvez créer la fonction suivante dans le fichier JavaScript de l'application hôte :

index.js
    function loadAndOpen() {
        const iframe = document.getElementById('arender-iframe');
        if (iframe && iframe.contentWindow) {
            iframeWindow.getARenderJS().loadDocument(
              "loadingQuery?url=", // passer ici l'id ou l'url du document à charger, après le signe égal
              (id) => {
                console.log(id);
                iframeWindow.getARenderJS().openDocument(id);
              }
            );
          } else {
            console.error("L'iframe n'est pas accessible ou n'est pas chargée.");
          }        
    }