E企盈营销工具技术服务商 热线:4006-838-530

win10下搭建Jenkins+微信开发者工具

E企盈直播平台营销卖货系统

背景微信小程序的测试发布在没有 CI/CD 等相关工具的情况下,存在着如下的问题:小程序开发助手中,同一个开发者只能显示一个开发版本测试同事找开发要二维码,效率较低本地生成的二维码会出现携带本地代码、未及时拉取分支其他改动等问题为了避免如上问题的发生,采用微信小程序集成 Jenkins 的方案。但是网上所有文档都是基于MacOS部署的,但是实际都是一样的东西。唯一不一样的就是在win10环境中使用批处理文件,还需要安装一些特定的软件:wget,node,gitbash(可以不安装),微信web开发者工具,Jenkins基础在介绍实现方案之前,先来回顾一下常规的微信小程序发布流程。从上面的流程图可以看出,微信小程序预览、上传都是需要在微信开发者工具中进行的,接下来了解一下微信开发者工具提供的上传方式。微信开发者工具除了图形化界面,微信开发者工具还提供了命令行与 HTTP 服务两种接口供外部调用,来进行登录、预览、上传等操作。命令行调用命令行工具所在位置:macOS: <安装路径>/Contents/Resources/app.nw/bin/cliWindows: <安装路径>/cli.bat以 macOS 操作系统示例:1、打开开发者工具:/Applications/wechatwebdevtools.app/Contents/Resources/app.nw/bin/cli -o其中,/Applications/wechatwebdevtools.app/为安装路径。2、登录:/Applications/wechatwebdevtools.app/Contents/Resources/app.nw/bin/cli -l输入上面的命令行后,终端中打印出登录二维码,使用微信扫码登录。在微信端完成操作之后,会输出 login success,如下图所示:HTTP 服务HTTP 服务在工具启动后自动开启,每次开启 host 固定为 127.0.0.1,端口号并不固定。端口号在用户目录下记录,位置如下:macOS : ~/Library/Application Support/微信web开发者工具/Default/.ideWindows : ~/AppData/Local/微信web开发者工具/User Data/Default/.ide以 macOS 操作系统示例:首先需要运行开发者工具,可以利用上面介绍的命令行方法打开微信开发者工具。/Applications/wechatwebdevtools.app/Contents/Resources/app.nw/bin/cli -oport=$(cat “/Users/zyy/Library/Application Support/微信web开发者工具/Default/.ide”)echo “微信开发者工具运行在${port}端口”这样就可以拿到微信开发者工具运行的端口号了,其中,/Users/zyy/ 为用户目录。1、打开开发者工具:# 打开工具http://127.0.0.1:端口号/open# 打开/刷新项目http://127.0.0.1:端口号/open?projectpath=项目全路径2、登录:# 登录,返回图片格式的二维码http://127.0.0.1:端口号/login# 登录,取 base64 格式二维码http://127.0.0.1:端口号/login?format=base64# 登录,取 base64 格式二维码,并写入 /Users/username/logincode.txthttp://127.0.0.1:端口号/login?format=base64&qroutput=%2FUsers%2Fusername%2Flogincode.txt3、预览:# 预览路径为 /Users/username/demo 的项目,返回图片格式的二维码http://127.0.0.1:端口号/preview?projectpath=%2FUsers%2Fusername%2Fdemo# 预览路径为 /Users/username/demo 的项目,返回 base64 格式的二维码http://127.0.0.1:端口号/preview?projectpath=%2FUsers%2Fusername%2Fdemo&format=base64# 预览路径为 /Users/username/demo 的项目,返回 base64 格式的二维码,并写入 /Users/username/logincode.txthttp://127.0.0.1:端口号/preview?projectpath=%2FUsers%2Fusername%2Fdemo&format=base64&qroutput=%2FUsers%2Fusername%2Flogincode.txt# 预览路径为 /Users/username/demo 的项目,返回图片格式的二维码,并将预览信息输出至 /Users/username/info.jsonhttp://127.0.0.1:端口号/preview?projectpath=%2FUsers%2Fusername%2Fdemo&infooutput=%2Users%2username%2info.json开始部署准备阶段1.安装wget,node,Jenkins,gitbash,微信开发者工具node,Jenkins去官网下载msi文件即可安装便利wget下载后解压到D盘根路径下即可(所有需要使用到的东西最好不要放到当前用户触碰不到的目录,否则你会哭的很惨)2.安装gitbash并且上传公钥到代码库##3.配置Jenkins服务权限和更改环境变量(最重要的一步)打开CMD->输入services.msc##找到Jenkins 右键->属性 ->登陆###重启生效###在Jenkins系统管理——全局安全配置页面,将标记格式器在下拉列表中修改为Safe HTML然后保存,这个修改是为了在build历史记录中能够直接显示二维码图片JAVA_OPTS-Dsun.jnu.encoding=UTF-8 -Dfile.encoding=UTF-8LANGzh.CH.UTF-8设置环境变量后重启生效(也可以不配直接写绝对路径)Jenkins插件安装安装下列Jenkins插件后重启:GIT pluginGit Parameter:获取所有分支名,作为参数列表SSH Credentials PluginGit Changelog:获取Git提交logbuild-name-setterdescription setter plugin:在build历史记录描述信息中增加二维码显示PostBuildScript Plugin:编译完成后执行脚本NodeJS Plugin:小程序构建需要,在更改提交状态时使用node技术AnsiColordescription setter :添加set build description获取图片Jenkins项目创建#创建一个自由风格的项目##添加执行批处理构建,并且把如下带粘贴进去###<img src=”http://192.168.120.191:8080/job/DEV-sk_platform_consumers_furniture-wechat/ws/${BUILD_ID}.png” alt=”小程序”/>优化beta2.0chcp 65001set dir=D:ingoJenkinsworkspaceDEV-sk_xxx_app-wechatdistset srcdir=C:UsersxxxDesktoptmp  ::做清空使用,必须为空目录set project=C:UsersxxxDesktopupload-sk_xxx_appdist-sk_xxx_app%BUILD_ID%  ::将要上传的目录放到非workspace的目录外,如果放到workspace里回提示程序有占用,影响代码更新。set upload=C:UsersxxxDesktopupload-sk_xxx_appmkdir %project%echo %environment%echo %branch%echo %describe%echo %version%CALL robocopy %srcdir% %WORKSPACE% /purgeecho “test success”git clone -b %branch% git@gitlab.xxx.com:cdp_furn/sk_xxx_app.git %WORKSPACE%git pull git@gitlab.xxx.com:cdp_furn/sk_xxx_app.git”C:Program FilesWinRARWinRAR.exe” x -ibck -y -o+ node_modules.rar %WORKSPACE%CALL node project-handle.js %environment%CALL npm install node-sass@4.11.0CALL npm rebuild node-sass@4.11.0CALL C:UsersxxxxAppDataRoamingpmtaro build –type weappCALL robocopy %dir% %project% /SCALL “D:weixincli.bat” -oFOR /F “usebackq delims==” %%i IN (`type “C:UsersxxxAppDataLocal微信web开发者工具User DataDefault.ide”`) do (    echo 当前使用端口:%%i    set port=%%i)echo %port%echo %BUILD_ID%echo %path%CALL D:wgetwget.exe -O %BUILD_ID%.png http://127.0.0.1:%port%/preview?projectpath=%project%if %environment% == pro (CALL “D:weixincli.bat” -u %version%@%project% –upload-desc ‘%describe%’echo “生产环境预览并上传微信小程序平台”) ELSE (echo “测试环境仅预览并不上传微信小程序平台”)优化beta3.0beta3.0调整了变量使用,实现了可移植,复制的通用性。chcp 65001set dir=%WORKSPACE%distset srcdir=C:UsersxxxxDesktoptmpset project=C:UsersxxxxDesktopupload%environment%-dist-%JOB_NAME%-%BUILD_ID%set upload=C:UsersxxxxDesktopuploadmkdir %project%echo %JOB_NAME% > C:UsersxxxxDesktopuploadame.txtecho “%JOB_NAME%” | D:Git-bashusrbinawk.exe -F ‘-‘ ‘{print $2}’@echo offfor /f “tokens=2 delims=-” %%l in (C:UsersxxxxDesktopuploadame.txt) do ( echo %%lset projectname=%%l)echo “projectname##%projectname%##”echo “environment%environment%”echo “branch##%branch%”echo “describe##%describe%”echo “version##%version%”CALL robocopy %srcdir% %WORKSPACE% /purgeecho “test success”git clone -b %branch% git@gitlab.dddd.com:cdp_furn/%projectname%.git %WORKSPACE%git pull git@gitlab.xxxx.com:cdp_furn/%projectname%.git”C:Program FilesWinRARWinRAR.exe” x -ibck -y -o+ node_modules.rar %WORKSPACE%CALL node project-handle.js %environment%CALL npm install node-sass@4.11.0CALL npm rebuild node-sass@4.11.0CALL sbtt git %environment%CALL C:UsersxxxxAppDataRoamingpmtaro build –type weappCALL robocopy %dir% %project% /SCALL “D:weixincli.bat” -oFOR /F “usebackq delims==” %%i IN (`type “C:UsersxxxxAppDataLocal微信web开发者工具User DataDefault.ide”`) do (    echo 当前使用端口:%%i    set port=%%i)echo %port%echo %BUILD_ID%echo %path%CALL D:wgetwget.exe -O %BUILD_ID%.png http://127.0.0.1:%port%/preview?projectpath=%project%if %uploadif% == prod (CALL “D:weixincli.bat” -u %version%@%project% –upload-desc ‘%describe%’echo “生产环境预览并上传微信小程序平台”) ELSE (echo “测试环境仅预览并不上传微信小程序平台”)#构建项目时记得先登陆微信开发者工具,如果没登陆报错如下:###添加成员#注意代码里的appid是否有问题######楼镇图小程序

赞(0) 打赏
未经允许不得转载:E企盈小程序开发-热线:4006-838-530 » win10下搭建Jenkins+微信开发者工具
分享到: 更多 (0)
E企盈小程序直播营销卖货系统
E企盈直播平台营销卖货系统

评论 抢沙发

E企盈小程序开发

联系我们联系我们

觉得文章有用就打赏一下文章作者

支付宝扫一扫打赏

微信扫一扫打赏