交互式小程序开发(微信小程序开发开发)
今天给各位分享交互式小程序开发的知识,其中也会对微信小程序开发开发进行解释,如果能碰巧解决你现在面临的问题,别忘了关注本站,现在开始吧!
H5与小程序数据交互
功能已通过原生+vue混合开发的方式实现了,现需要将这个功能原封不动的搬到微信小程序。综合各方面评估,选择了微信小程序套webview的方式实现(若时间允许,建议还是通过小程序实现)。
采用小程序webview的方式,可以复用大部分H5页面,但H5调用的原生方法还是需要重新实现。实现方式主要分以下几种情况(当然也可以通过jssdk的方式去实现 ,但不在本文讨论范围内):
(1) 获取照片,可通过html的input标签实现;
(2) 获取经纬度,可通过webview的url拼接参数实现;
(3) 人脸识别,可通过H5调起刷脸小程序的方式实现。
下面主要描述下第3种情况的实现方式。
H5与小程序交互所涉及的数据部分主要包括两块:
(1)H5如何将数据传给小程序?
url参数拼接。
(2)小程序如何将数据传给H5?
wx.setStorage及wx.getStorage。
详细流程如图所示。
webview小程序pageA调起人脸小程序pageB,pageB回退到pageA。因为pageA重新设置了webview的url,其所嵌套的H5与历史H5页面无法进行数据共享,导致业务功能无法继续。解决办法就是调起人脸小程序之前,在H5页面先将必要的信息通过 localStorage.setItem 保存,人脸识别结束回到H5页面时,再通过 localStorage. getItem 获取所需要的业务数据。
微信小程序前端和远程服务器交互的问题?
关于“小程序如何要把文件传送到远程服务器上”的问题,分以下几步:
1. 手机中上传文件,先使用wx.uploadFile 接口
2. 把数据包装到 json对象中,用 wx.request.post 接口把数据发送到你的服务器
3.服务器要接收小程序发过来的数据,就要用到后端语言,如果没有接触过的话,就学 node.js 或 PHP,环境怎样配置可以在网上搜索到
4.安装好环境后,学习一下怎样上传文件,并把上传的文件保存到服务器,这里的上传可以直接用先在网页中测试,网页中会上传后保存到服务器了,小程序中也应该就会了。
所以,现在的重要是你要先学会一门后端语言;当然 node.js 就是 js,语法不用重复学,但后端的逻辑与前端是不一样的,自己看看网上的教程学一学。
小程序开发如何做原型设计
1.原型设计工具
根据设计者的专业程度,可以将原型设计工具分为两大类,一是专业原型设计工具,二是非专业原型设计工具。专业的原型设计工具常用的就是墨刀和Axure,墨刀是一款在线原型设计工具,其优点是云办公模式,支持协同设计,即时保存,不用担心因电脑断电或故障而导致设计内容丢失,其缺点是组件丰富程度不高。
Axure是电脑端的原型设计工具,其优点是组件丰富,功能比较强大,使用用户群体较大,其缺点是设计内容要及时保存,否则会因电脑断电或故障而导致设计内容丢失,给用户带来一定的困扰。非专业的原型设计工具有PPT和纸,PPT也是一个简单的制图软件,能让用户实现简单的原型设计,其优点是简单易学,缺点是页面交互功能不强;纸是大部分用户都可以用的原型设计工具,其优点是简单方便,专业和非专业的人士都可以通过纸将原型想法表示出来,缺点是保存和后期使用不方便。
2.原型设计的内容
原型设计主要包括三个方面的内容:一是页面设计,二是交互设计,三是备注设计。页面设计是原型设计的主要内容,包括对产品所有页面的原型设计;交互设计是指页面与页面之间的链接和跳转;备注设计是指对页面设计,交互设计,程序功能,跳转结果,出错提示等的设计。
原型设计是产品需求设计与UI设计之间的桥梁,是产品开发的一项重要基础工作,直接决定了产品界面的布局,影响产品的使用效果。
交互式小程序开发的介绍就聊到这里吧,感谢你花时间阅读本站内容,更多关于微信小程序开发开发、交互式小程序开发的信息别忘了在本站进行查找喔。