Installation dans ACA
Commencer avec Docker
-
Modifier le contexte d’ARender pour qu’il soit sur le chemin /arender de votre serveur.
NoteAvec le conteneur ARender UI, modifier le contexte avec la variable d’environnementCONTEXT_PATH=/arender
. -
Récupérer l’image ACA depuis notre artifactory avec :
$> docker pull artifactory.arondor.cloud:5001/adf-content-app-arender:<arender-version>-aca<aca-version>
-
Puis, exécuter le conteneur avec la configuration suivante :
docker-compose.ymlversion: "3" services: aca: image: alfresco-content-app:AR-11007 environment: # le nom d'hôte de ACA - ADF_PUBLIC_HOST=http://localhost # Le nom d'hôte de ARender avec /arender pour contexte - ARENDER_HOST=http://localhost:8080 # Le nom d'hôte du Alfresco content repository - ALFRESCO_HOST=http://localhost:8080 # Le nom d'hôte du service oauth d'Alfresco - ALFRESCO_OAUTH_HOST=http://localhost:8080 # liste des extensions qui ouvre ARender pour la prévisualisation (avec ',' comme séparateur) - ARENDER_EXTENSIONS=pdf,docx,docm,dotx,dotm,doc,dot,rtf,odt,ott,xlsx,xlsm,xls,xlt,xml,csv,ods,ots,pptx,pptm,ppt,pps,odp,otp,vsdx,msg,eml,html,htm,txt,dwg,dxf,tif,tiff,dcm,mda,ica,mmr,mca,jpg,jpeg,jpe,jfif,jp2,jpf,jpx,j2k,j2c,jpc,png,gif,webp,bmp,mp4,zip ports: - 80:8080
Ajouter ARender à votre Alfresco Content App
Prérequis
- Alfresco 5.2.4, 6.x
- Tomcat 7.0
- NodeJS v10.16.0,
- npm 6.14.2
Installation
Le module de prévisualisation n’est pas disponible publiquement, il faut donc l’ajouter manuellement.
-
Cloner le dépot ACA.
$> git clone https://github.com/Alfresco/alfresco-content-app.git $> git checkout v1.10.1
-
Télécharger les sources de l’extension ARender pour ACA ici et dezipper le contenue de l’archive.
-
Générer une nouvelle librairie nommée “arondor-arender-viewer”.
$> ng g library arondor-arender-viewer
-
Remplacer le contenue du dossier généré par le contenue précédemment dézippé.
-
Ajouter les librairies ARender dans la configuration du compilateur.
tsconfig.json{ "compilerOptions": { // [...] "paths": { // [...] "@arondor/arender-viewer": ["dist/@arondor/arender-viewer"], "@arondor/arender-viewer/*": ["dist/@arondor/arender-viewer/*"] } } }
Attention<div class="content"> Pour les versions 2.0 et supérieures, se référer à l’installation version 2.0 </div>
-
Ajouter les assets à l’application et remplacer les informations du projet.
angular.json{ "projects": { "app": { "architect": { //[...] "build": { //[...] "options": { //[...] "assets": [ //[...] { "glob": "arender.plugin.json", "input": "node_modules/@arondor/arender-viewer/assets", "output": "./assets/plugins" }, { "glob": "arender.plugin.json", "input": "projects/arondor-arender-viewer/assets", "output": "./assets/plugins" }, { "glob": "**/*", "input": "node_modules/@arondor/arender-viewer/assets", "output": "./assets/arender-viewer" }, { "glob": "**/*", "input": "projects/arondor-arender-viewer/assets", "output": "./assets/arender-viewer" } ] } } } }, //[...] "arondor-arender-viewer": { "root": "projects/arondor-arender-viewer", "sourceRoot": "projects/arondor-arender-viewer/src", "projectType": "library", "prefix": "arender", "architect": { "build": { "builder": "@angular-devkit/build-ng-packagr:build", "options": { "tsConfig": "projects/arondor-arender-viewer/tsconfig.lib.json", "project": "projects/arondor-arender-viewer/ng-package.json" } }, "test": { "builder": "@angular-devkit/build-angular:karma", "options": { "main": "projects/arondor-arender-viewer/src/test.ts", "tsConfig": "projects/arondor-arender-viewer/tsconfig.spec.json", "karmaConfig": "projects/arondor-arender-viewer/karma.conf.js" } }, "lint": { "builder": "@angular-devkit/build-angular:tslint", "options": { "tsConfig": [ "projects/arondor-arender-viewer/tsconfig.lib.json", "projects/arondor-arender-viewer/tsconfig.spec.json" ], "exclude": [ "**/node_modules/**" ] } } } } } }
-
Ajouter ARender à la liste d’extension.
src/assets/app.extension.json{ "$references": [ "arender.plugin.json", ... ], }
-
Importer l’extension ARender.
src/app/extension.module.tsimport { ArenderExtensionModule } from '@arondor/arender-viewer'; @NgModule({ imports: [ArenderExtensionModule, ... ] })
-
Ajouter les informations de construction.
package.json{ "scripts": { //[...] "build:arender-extension": "npx rimraf dist/@arondor/arender-viewer && ng build arondor-arender-viewer && cpr projects/arondor-arender-viewer/ngi.json dist/@arondor/arender-viewer/ngi.json && cpr projects/arondor-arender-viewer/assets dist/@arondor/arender-viewer/assets", "build.arender": "npm run build:arender-extension", "build.extensions": "npm run build.shared && npm run build.aos && npm run build.arender", //[...] } }
Configuration
Configuration du serveur ARender
{
"arender": {
"host": "{protocol}//{hostname}:{port}/arender/",
"onPromise": true,
"documentbuilder": true
},
//[...]
}
Description:
- arender.host: le nom d’hôte d’ARender avec son contexte ,ici, "/arender". Utiliser le nom d’hôte par défaut pour éviter les erreurs de Cross Origin.
- arender.onPromise: permet l’ouverture de plusieurs documents ou dossiers.
- arender.documentbuilder: active la fonction de composition de document par défaut.
Ouverture des documents par extension
Modifier la variable features.viewer.content.fileExtension.
{
//[...]
"features": {
"viewer": {
"content": [{
"id": "app.arender.viewer",
"fileExtension": [
"docx", "docm", "dotx", "dotm", "doc", "dot",
"rtf", "odt", "ott",
"xlsx", "xlsm", "xls", "xlt", "xml", "csv",
"ods", "ots",
"pptx", "pptm", "ppt", "pps",
"odp", "otp", "vsdx",
"msg", "eml",
"html", "htm",
"txt",
"dwg", "dxf", "tif", "tiff", "dcm",
"mda", "ica", "mmr", "mca",
"jpg", "jpeg", "jpe", "jfif", "jp2", "jpf", "jpx", "j2k", "j2c", "jpc",
"png", "gif", "webp", "bmp"
// <- Ajouter vos extensions ici et/ou retirer les éléments de la liste ci-dessus ^
],
}]
},
// [...]
}
}
Contruction et exécution
-
Installer angular-devkit.
$> npm install --save-dev @angular-devkit/build-angular
-
Exécuter le script bash pour construire l’application.
$> ./build-tomcat-e2e.sh
-
Copier le dossier généré (alfresco-content-app-1.10.1\dist\app pour ACA v1.10.1) dans votre serveur tomcat dans le dossier “webapps” et renommer le comme bon vous semble.
-
Démarer Tomcat.
Installation pour la version 2.0
Pour les versions 2.0 et supérieures, les modifications supplémentaires suivantes sont à prendre en compte :
- Les librairies ARender dans la configuration du compilateur sont placées dans tsconfig.base.json et non tsconfig.json
{
"compilerOptions": {
// [...]
"paths": {
// [...]
"@arondor/arender-viewer": ["dist/@arondor/arender-viewer"],
"@arondor/arender-viewer/*": ["dist/@arondor/arender-viewer/*"]
}
}
}
- Ajouter les informations de construction.
{
"scripts": {
//[...]
"build:arender-extension": "npx rimraf dist/@arondor/arender-viewer && ng build arondor-arender-viewer && cpr projects/arondor-arender-viewer/ngi.json dist/@arondor/arender-viewer/ngi.json && cpr projects/arondor-arender-viewer/assets dist/@arondor/arender-viewer/assets",
"build.arender": "npm run build:arender-extension",
"build.extensions": "npm run build.shared && npm run build.aos && npm run build.arender",
"build": "npm run validate-config && npm run build.extensions && npm run build.app -- --prod",
//[...]
}
}
-
Exécuter la commande pour construire l’application et avoir le dossier généré (/dist/app) à placer dans le dossier “webapps” de votre serveur tomcat.
$> ng build