VisualEditor est un éditeur de texte enrichi pour MediaWiki. Il est disponible en tant qu'extension et s'appuie sur le service d'analyseur Parsoid pour être opérationnel pour l'édition des pages MediaWiki.
Venir à Parsoid, c'est un service d'analyseur basé sur Nodejs. Il est utilisé par de nombreuses extensions MediaWiki, notamment VisualEditor, Flow, Content Translation et d'autres applications.
Dans ce tutoriel, je vais vous montrer comment installer et configurer étape par étape l'ÉditeurVisuel pour la dernière version 1.30 de MediaWiki. Il vaut la peine de partager que notre MediaWiki est installé sous le système d'exploitation CentOS 7, et nous allons ajouter et installer Nodejs, le service Parsoid, et configurer VisualEditor pour MediaWiki Editor.
Prérequis
- CentOS 7 avec MediaWiki installé
- Privilèges root
Ce que nous allons faire
- Vérifiez l'installation de MediaWiki
- Installer les dépendances
- Installer et configurer le service Parsoid
- Installer et configurer l'ÉditeurVisuel pour MediaWiki
- Tester la configuration
Étape 1 - Vérifier l'installation de MediaWiki
Dans cette étape, nous allons vérifier notre installation MediaWiki. MediaWiki est installé sous le nom de domaine 'http://wiki.hakase-labs.me'. Ouvrez le navigateur Web et visitez l'adresse URL MediaWiki suivante, la mienne est : http://wiki.hakase-labs.me/
Vous serez redirigé vers la connexion HTTPS, après quoi vous accéderez à la page MediaWiki avec un skin "Vector" similaire à celui illustré ci-dessous.
Ensuite, connectez-vous en tant qu'utilisateur administrateur et essayez de modifier la page. Cliquez sur l'onglet "Modifier" et vous obtiendrez l'éditeur MediaWiki par défaut comme ci-dessous.
Le MediaWiki est opérationnel sans aucune erreur.
Étape 2 - Installer les dépendances
Pour installer le service Parsoid et configurer l'ÉditeurVisuel, nous avons besoin que certains packages CentOS soient installés sur le système. Plus précisément, nous allons installer Nodejs, npm, vim et git.
Installez tous les packages nécessaires à l'aide de la commande yum ci-dessous.
yum -y install nodejs npm vim-enhanced git
Tous les packages et dépendances ont été installés.
Étape 3 - Installer et configurer Parsoid
Parsoid peut être installé sur un serveur MediaWiki séparé. Mais pour ce tutoriel, nous n'utiliserons qu'un seul serveur CentOS 7 pour MediaWiki et Parsoid.
Maintenant, puisque nous utilisons le serveur CentOS 7, nous devons installer le service Parsoid manuellement à partir de la source car les packages officiels ne sont disponibles que pour les systèmes d'exploitation basés sur Ubuntu/Debian.
Donc, pour commencer, créez un nouveau répertoire '/opt/parsoid' et clonez le dernier parsoid à l'aide de la commande git, comme indiqué ci-dessous.
mkdir -p /opt/parsoid
git clone https://gerrit.wikimedia.org/r/p/mediawiki/services/parsoid /opt/parsoid
Allez maintenant dans le répertoire '/opt/parsoid' et installez le service Parsoid à l'aide de la commande npm suivante.
cd /opt/parsoid
npm install
Une fois l'installation terminée, vous obtiendrez le résultat ci-dessous.
Ensuite, configurez le service Parsoid en éditant les fichiers de configuration correspondants.
Copiez l'exemple de configuration 'localsettings.example.js' dans 'localsettings.js', puis modifiez le fichier à l'aide de vim.
cp localsettings.example.js localsettings.js
vim localsettings.js
Décommentez la ligne 'parsoidConfig.setMwApi' et modifiez la valeur 'uri' avec votre URL d'API MediaWiki comme ci-dessous.
exports.setup = function(parsoidConfig) {
// Do something dynamic with `parsoidConfig` like,
parsoidConfig.setMwApi({
uri: 'http://wiki.hakase-labs.me/api.php',
});
}; 
C'est ça. Enregistrez et quittez.
Copiez maintenant la configuration 'config.example.yaml' dans 'config.yaml' et modifiez-la avec l'éditeur vim.
cp config.example.yaml config.yaml
vim config.yaml
Sur la ligne 'mwApis' (ligne numéro 34), changez la valeur 'uri' avec votre URL d'API MediaWiki et la valeur 'domain' avec votre propre nom de domaine.
mwApis:
- # This is the only required parameter,
# the URL of you MediaWiki API endpoint.
uri: 'http://wiki.hakase-labs.me/api.php'
# The "domain" is used for communication with Visual Editor
# and RESTBase. It defaults to the hostname portion of
# the `uri` property above, but you can manually set it
# to an arbitrary string. It must match the "domain" set
# in $wgVirtualRestConfig.
domain: 'wiki.hakase-labs.me'
#optional
Enregistrez et quittez.
Ensuite, nous allons configurer Parsoid en tant que service. Pour cela, allez dans le répertoire '/etc/systemd/system' et créez un nouveau fichier de service nommé 'parsoid.service'.
cd /etc/systemd/system/
vim parsoid.service
Collez la configuration du service Parsoid ci-dessous.
[Unit]
Description=Mediawiki Parsoid web service on node.js
Documentation=http://www.mediawiki.org/wiki/Parsoid
Wants=local-fs.target network.target
After=local-fs.target network.target
[Install]
WantedBy=multi-user.target
[Service]
Type=simple
User=root
Group=root
WorkingDirectory=/opt/parsoid
ExecStart=/usr/bin/node /opt/parsoid/bin/server.js
KillMode=process
Restart=on-success
PrivateTmp=true
StandardOutput=syslog
Sauvegarder et quitter. Exécutez ensuite la commande de rechargement suivante.
systemctl daemon-reload
Maintenant, démarrez le service Parsoid et activez-le pour qu'il s'exécute à chaque démarrage du système.
systemctl start parsoid
systemctl enable parsoid
Parsoid devrait maintenant fonctionner en tant que service sur CentOS 7, en utilisant le port 8000. Vous pouvez le vérifier avec la commande netstat de la manière suivante.
netstat -plntu
Et vous devriez obtenir un résultat semblable à celui-ci :
L'installation et la configuration du parsoïde sont terminées.
Remarque :
Si vous avez Firewalld en cours d'exécution sur votre serveur, ajoutez le port parsoid 8000 à la configuration de firewalld à l'aide des commandes suivantes.
firewall-cmd --add-port=8000/tcp --permanent
firewall-cmd --reload
Étape 4 - Installer et configurer l'ÉditeurVisuel
Dans cette étape, nous allons installer et configurer les extensions de l'ÉditeurVisuel pour MediaWiki.
Accédez au répertoire d'installation de MediaWiki '/var/www/mediawiki/extensions' et téléchargez la dernière version de l'éditeur visuel à l'aide de git.
cd /var/www/mediawiki/extensions
git clone https://gerrit.wikimedia.org/r/p/mediawiki/extensions/VisualEditor.git
Allez maintenant dans le répertoire de l'ÉditeurVisuel, initialisez et mettez à jour tous les sous-modules qu'il contient.
cd VisualEditor/
git submodule update --init
Ensuite, nous devons éditer le fichier de configuration Mediawiki 'LocalSettings.php' pour activer VisualEditor. Pour cela, rendez-vous dans le répertoire mediawiki et modifiez le fichier 'LocalSettings.php' à l'aide de vim.
cd /var/www/mediawiki
vim LocalSettings.php
Collez la configuration ci-dessous vers la fin du fichier.
wfLoadExtension( 'VisualEditor' );
// Enable by default for everybody
$wgDefaultUserOptions['visualeditor-enable'] = 1;
// Optional: Set VisualEditor as the default for anonymous users
// otherwise they will have to switch to VE
// $wgDefaultUserOptions['visualeditor-editor'] = "visualeditor";
// Don't allow users to disable it
$wgHiddenPrefs[] = 'visualeditor-enable';
// OPTIONAL: Enable VisualEditor's experimental code features
#$wgDefaultUserOptions['visualeditor-enable-experimental'] = 1;
$wgVirtualRestConfig['modules']['parsoid'] = array(
// URL to the Parsoid instance
// Use port 8142 if you use the Debian package
'url' => 'http://wiki.hakase-labs.me:8000',
// Parsoid "domain", see below (optional)
'domain' => 'wiki.hakase-labs.me',
// Parsoid "prefix", see below (optional)
'prefix' => 'wiki.hakase-labs.me'
);
C'est ça. Enregistrez et quittez.
Remarque :
Veuillez changer l'URL avec votre propre nom de domaine.
Ensuite, modifiez les autorisations de propriété pour le répertoire mediawiki sur l'utilisateur et le groupe "nginx".
chown -R nginx:nginx /var/www/mediawiki
L'installation des extensions de l'ÉditeurVisuel est terminée.
Étape 5 - Tester
Ouvrez votre navigateur Web et visitez l'URL MediaWiki suivante, la mienne est : http://wiki.hakase-labs.me
Maintenant, connectez-vous en tant qu'administrateur.
Une fois connecté, cliquez sur l'onglet "Modifier" pour modifier la page d'accueil. Vous devriez obtenir VisualEditor comme indiqué ci-dessous.
L'installation et la configuration de l'éditeur visuel de MediaWiki sur CentOS 7 ont été effectuées avec succès.