【MediaWiki之VisualEditor扩展】MediaWiki实现可视化编辑功能
MediaWiki之VisualEditor扩展
- 总结：
- 1. 安装Nodejs和npm:
- 2. 安装git：
- 3. 安装Parsoid:
- 3.1 Parsoid下载
- 自动下载：
- 手动下载（推荐，windows强项）：
- 3.2 Parsoid安装
- 3.3 Parsoid配置
- 3.3.1. 配置`parsoid/config.yaml`文件：
- 3.3.2配置`parsoid/localsettings.js`文件：
- 3.3.3启动parsoid
- 4. 安装VisualEditor扩展
- 5. 参考文献
环境：windows server 2012 + mediawiki 1.34 + nodejs-10.21.0 + parsoid 0.11.0 + VisualEditor 1.34
版本控制极其极其重要！
总结：
- 安装choco:修改安全模式–命令行下载并安装
[Net.ServicePointManager]::SecurityProtocol =[Net.SecurityProtocolType]::Tls12
iwr https://chocolatey.org/install.ps1 -UseBasicParsing | iex
-
安装nodejs:下载–点击安装–安装支持环境
-
安装git：下载–安装–配置环境变量
-
安装Parsoid:
git config --global http.postBuffer 524288000
git clone https://gerrit.wikimedia.org/r/p/mediawiki/services/parsoid --depth 1
cd parsoid/
npm config set registry https://registry.npm.taobao.org
npm install
- 配置parsoid:修改
config.example.yaml和localsettings.example.js二文件 - 启动parsoid:
node bin/server.js - 安装visualEditor扩展，配置mediawiki的
localsetting.php文件 - 重启parsoid:
node bin/server.js
1. 安装Nodejs和npm:
- 条件：Install nodejs >= v6.x and the node package manager, npm.
下载nodejs：https://nodejs.org/en/download/
【下载合适版本哦，不要下载最新版本的Nodejs，因为不兼容呀不兼容！】安装nodejs：点击应用程序自动安装，安装时会同时将npm绑定安装。很多小白和我一样，不懂npm是什么，那么附上学习链接：npm是什么{专业版，知乎版，菜鸟版}。- 安装时报错：
choco : 无法将“choco”项识别为cmdlet、函数、脚本文件或可运行程序的名称。请检查名称的拼写，如果包括路径，请确保路径正
确，然后再试一次。
原因： 安全模式不允许，需要修改安全模式。
解决方案：手动安装chocolatey。管理员身份打开powershell，输入命令：
[Net.ServicePointManager]::SecurityProtocol =[Net.SecurityProtocolType]::Tls12
iwr https://chocolatey.org/install.ps1 -UseBasicParsing | iex
- 至此，choco安装成功，但其他支持环境并没有再继续安装，我做了
卸载nodejs操作，删除它的文件夹，以及环境变量中和nodejs、npm相关的量。
C:\Program Files\nodejs
C:\Users\Administrator\AppData\Roaming\npm
C:\Users\Administrator\AppData\Roaming\npm-cache
- 重复第一步，
重新安装nodejs，并令它自动安装支持环境，如python、vc++2015等，这时可以顺利进行下去。
2. 安装git：
- 下载：https://git-scm.com/downloads
- 安装：步骤请移步：https://blog.csdn.net/qq_32786873/article/details/80570783
- 配置环境变量：将安装好的git的bin文件夹添加到环境变量path中：
C:\Program Files\Git\bin。
3. 安装Parsoid:
3.1 Parsoid下载
自动下载：
-
采用git命令直接下载最新版的Parsoid：
git clone https://gerrit.wikimedia.org/r/p/mediawiki/services/parsoid -
如果你成功了，那么就可以跳过下载步骤了，进入安装步骤3.2了。
我这里报错显示RPC failed...如下图所示。解决方案：（参考：https://blog.csdn.net/IT_liuchengli/article/details/77040806）
git config --global http.postBuffer 524288000
git clone https://gerrit.wikimedia.org/r/p/mediawiki/services/parsoid --depth 1
手动下载（推荐，windows强项）：
下载parsoid： https://github.com/wikimedia/parsoid，解压后将其移动至mediawiki文件夹下。
3.2 Parsoid安装
管理员运行cmd，转到parsoid文件夹；
cd parsoid/
npm config set registry https://registry.npm.taobao.org
npm install
npm install命令安装的时候发现报了很多错，主要是一些环境未能配置成功，比如vs环境、python环境等。
解决方案：
手动下载依赖包（https://github.com/nodejs/node-gyp#on-windows）
or
在联网的环境下自动安装：cmd输入npm install --global --production windows-build-tools
3.3 Parsoid配置
3.3.1. 配置parsoid/config.yaml文件：
- copy parsoid根目录下
config.example.yaml文件，重命名为config.yaml - 修改mwApis，填入自己的可解析域名，我自己这里因为还没做更多指向，直接填了ip地址：
config.example.yaml文件：
mwApis:
- # This is the only required parameter,
# the URL of you MediaWiki API endpoint.
uri: 'http://{Your_Domain_Name}/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: '{Your_Domain_Name}'
#optional
# my settings:
# uri: 'http://47.***.***.**/mediawiki/api.php'
# domain:'47.***.***.**'
3.3.2配置parsoid/localsettings.js文件：
- copy parsoid根目录下
localsettings.example.js文件，重命名为localsettings.js - 修改其中内容：
exports.setup = function(parsoidConfig) {
// Do something dynamic with `parsoidConfig` like,
parsoidConfig.setMwApi({
uri: 'http://{Your_Domain_Name}/api.php',
// my setting:
// uri: 'http://47.***.***.**/mediawiki/api.php',
// original setting:
// uri: 'http://localhost/w/api.php',
});
};
3.3.3启动parsoid
parsoid启动会默认占用8000端口。
node bin/server.js
检查是否启动成功：浏览器输入localhost:8000，若导航出现parsoid，那么恭喜你，终于配置好了parsoid。
【此处插入辛酸泪】
我在启动该命令时一直报错：
ERROR: cannot find modules "C:\\...\\parsoid\\node-modules\\lib\\index.js"
......
各种查资料，检查环境，甚至手动下载lib包，但是这个错误始终不能解决。直到后来再仔细看了一遍parsoid资料，才发现
————原来是parsoid和nodejs版本不兼容的问题。。。。
OK，降版本重装，困扰我近一个星期的玩意半天就解决了。
4. 安装VisualEditor扩展
千辛万苦终于走到了这一步。
- 下载对应版本的VisualEditor扩展，我下载的就是1.34版本：https://www.mediawiki.org/wiki/Special:ExtensionDistributor/VisualEditor
- 解压文件，送至
mediawiki/extensions文件夹 - 在
mediawiki/localsettings.php文件最后面添加配置内容：
wfLoadExtension( 'VisualEditor' );
// Enable by default for everybody
$wgDefaultUserOptions['visualeditor-enable'] = 1;
// 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
'url' => 'http://47.***。***。**:8000',
'domain' => '47.***。***。**',
'prefix' => '47.***。***。**',
'forwardCookies' => true,
)
// selectable
//$wgGroupPermissions['*']['read'] = true;
//$wgGroupPermissions['*']['edit'] = true;
//$wgGroupPermissions['user']['read'] = true;
//$wgGroupPermissions['user']['edit'] = true;
- 再次启动parsoid:
cd parsoid/
node bin/server.js
OK，终于成功了，开始下一个硬骨头extension:math。
5. 参考文献
- 版本控制和配置：https://www.mediawiki.org/wiki/Extension:VisualEditor
- visualeditor报406错误：https://www.mediawiki.org/wiki/Topic:Ua42lnptxq4056ki
- 安装parsoid：https://wadesss.com/2016/01/19/12.html；https://codeleading.com/article/74053201502/；https://my.oschina.net/Suregogo/blog/1510571；https://segmentfault.com/a/1190000008455881；https://tech.mindseed.cn/Tutorial/%E4%B8%BAMediaWiki%E5%AE%89%E8%A3%85%E5%8F%AF%E8%A7%86%E5%8C%96%E7%BC%96%E8%BE%91%E5%99%A8.html；https://segmentfault.com/a/1190000008455881；
- lib/index.js not found错误：https://www.mediawiki.org/wiki/Topic:Vbp0pzi5tqm6ge8d。事实上我这里的问题不是这样，只是nodejs版本不兼容。