WeX5-App开发完整过程解析

Click to edit Title Slide,Click to edit Master text styles,Second level,Third level,Fourth level,Fifth level,Click to edit Title Slide,Click to edit Master text styles,Second level,Third level,Fourth level,Fifth level,北京起步科技,Copyright 2023-2023 Justep Software,WeX5 App,开发,完整过程介绍,WeX5 App,开发,下载地址：,WeX5 App,演示案例,WeX5 App,开发完整过程,功能开发,前端页面开发,后端效劳调用,原生插件调用,运行及调试,使用Chrome扫瞄器运行及调试,生成调试App，在手机中运行，在PC上进展真机调试,使用开发工具中的模拟器或BlueStacks运行及调试,打包及部署,设置欢送页，介绍页、App图标,猎取证书，生成公布App,三种部署方式,开发一个简洁的功能,前端页面开发,在elements页调试样式,在sources页调试js代码,在network页查看恳求,在console页查看掌握台信息,使用Chrome扫瞄器运行及调试,创立本地App,打调试包,配置项,输入内容,服务地址,http:/192.168.1.142:8080,首页,/x5/UI2/hello/index.w,打包的资源,不选择,应用名,hello,版本号,1.1.1,应用包名,com.justep.hello,IOS,必须输入证书中的,Bundle ID,使用微信插件则必须输入申请微信账号时录入的应用包名,增强型浏览器,可选,本地插件,Js,中引用了,require(“cordova,，可以使用自动，否则手动选择,生本钱地App,打调试包,配置项,输入内容,安卓,App,可以选择,IOS App,需要先获取苹果开发及发布证书,MAC,版开发工具可以选择,WINDOW,版开发工具需要单独安装打包服务器，才能生成,IOS App,打包服务器地址,/app-builder,发布模式,选择发布模式后，不能使用真机调试,但是，微信分享等功能只能在发布模式的,App,中执行,打调试,包,下载、安装App,安卓,扫描App二维码，下载安装App,IOS,使用UC扫瞄器扫描App二维码，下载IPA文件，使用同步推安装IPA文件,或者使用iTunes安装,安卓真机调试,使用Chrome扫瞄器访问chrome:/inspect/#devices,IOS真机调试,使用safari扫瞄器进展真机调试,真机调试,发送Ajax恳求访问任意后端效劳,X5供给了轻量级的BaaS效劳,供给了java的BaaS效劳,供给了.net的BaaS效劳,处理跨域状况,后端效劳调用,使用Cordova插件,二维码扫描,加速度传感器,音频录制及播放,设备信息,微信共享,微信支付、支付宝支付、银联支付,开发Cordova插件,原生插件调用,地理定位,消息推送,摄像头拍照及录像,文件系统,NFC,使用开发工具中的模拟器,使用,BlueStacks,使用模拟器运行及调试,调试模式与生产模式,调试模式,生产模式,何时使用,开发时使用,部署时使用,如何使用,Tomcat,在,studio,里面启动,运行启动,WeX5,运行平台（调试模式）,.bat,运行启动,WeX5,运行平台,.bat,修改,w,、,js,等文件后,使用浏览器访问,使用,App,访问（不含资源）,立即生效,更新版本号,重启,Web,应用服务器,访问立即生效,使用,App,访问（含资源）,调试时不使用这种方式,重新生成,App,更新,App,三种部署方式,方式一（推荐）,方式二,方式三,部署方式,使用,UIServer,在,Web,应用服务器上部署,UIServer,页面等应用资源打包到本地,App,脱离,UIServer,页面等应用资源部署到任意,Web,应用服务器,打包方式,不选择打包资源,选择打包资源,不选择打包资源,使用场景,使用,Java Web,服务器,使用,App,访问,使用浏览器访问,使用微信号访问,适用于页面资源变化不频繁的,App,适用于开发不联网的,App,使用任意的,Web,服务器,使用,App,访问,使用浏览器访问,使用微信号访问,优点,只需更新版本号,不需要删除浏览器缓存,不需要更新,App,不需要首次资源下载,首次运行速度快,支持任意的,Web,服务器,缺点,每次更新页面，需要生成,App,，更新,App,需要自己解决,App,端的页面资源更新,打公布包,安卓,IOS,替换,App,图标,放,icon.png,platforms/android/res,放,icon.png,/platforms/ios/X5/Resources/icons,替换欢迎页,放,splash-land.png,和,splash-port.png,platforms/android/res,放,splash-land.png,和,splash-port.png,/platforms/ios/X5/Resources/splash,替换介绍页,使用,Intro.html,显示,要求和首页同目录,使用,Intro.html,显示,要求和首页同目录,获取证书,使用,java,自带的工具,keytool,生成,从苹果官网申请发布证书,在,mac,系统上生成,p12,文件,在,build.properties,中设置,p12,文件的密码,打包,App,生成,App,及,App,二维码,生成,App,部署,App,发布,App,二维码，扫描此二维码即可下载、安装,App,个人,/,公司证书,上传到,App Store,，用户从,App Store,下载、安装,App,企业证书,搭建,https,服务，用户访问,https,服务下载、安装,App,部署方式三中如何部署Web应用,通过打包获得Web应用资源,打包时会将选择的打包资源生成Web应用资源,打包后Web应用资源放在www名目下,将Web应用资源部署到Web效劳器上,使用原生插件,通过扫瞄器访问不能使用原生插件,通过本地App不管有没有选择打包资源都可以使用原生插件,两点说明,相关文章链接,WeX5平台App打包原理,:/wex5 /cn/wex5-platform-App-principle/,iOS证书申请,:/wex5 /cn/ios-certificate-request/,Android和IOS的本地App如何安装apk&ipa,:/wex5 /cn/how-install-apk-ipa/,苹果App部署HTTPS进展在线下载安装,:/wex5 /cn/ipa-deploy-s/,Android和IOS的本地应用图标标准,:/wex5 /cn/android%E5%92%8Cios%E7%9A%84%E6%9C%AC%E5%9C%B0%E5%BA%94%E7%94%A8%E5%9B%BE%E6%A0%87%E8%A7%84%E8%8C%83/,Cordova插件开发,:/wex5 /cn/cordova%E6%8F%92%E4%BB%B6%E5%BC%80%E5%8F%91/,