微信小程序开发第四弹

1、微信小程序的页面跳转
  按照微信官方文档的说法,一共有三种跳转方式:
(1)wx.navigateTo()是保留当前页面,跳转到某个页面,跳转页面后可以返回上一页。
实例:wx.navigateTo({
    url: ‘../logs/logs’,
     })
  
解释:
    1、里面的url也可以用相对路径,比如:pages/logs/logs
    2、向下一页面传值方式:url里面传值即可,例如:
    url:’../logs/losg?type=2’
    此时,在logs.js的onload函数中,直接通过对象获取即可,例如:
  onLoad: function (option) {
    this.setData({
    type:option.type,
     });
     console.log(option.type);
    }
(2)wx.redirectTo()是关闭当前页面,跳转到某个页面,跳转页面后不能返回上一页。
代码上上面的wx.navigateTo()差不多:
  wx.redirectTo({
     url: ‘../logs/logs’,
     })
(3)组件
这个最简单,可以直接在wxml中,通过组件标签来实现,例如:
点击跳转然后在页面中直接点击即可。

注意:跳转的路径不能为tabBar中的页面途径。经过测试是跳转不过去的。可以选用其他页面的路径来打开。如果需要跳转到tabBar页面,请参考函数:
  wx.switchTab(OBJECT)
  跳转到 tabBar 页面,并关闭其他所有非 tabBar 页面

2、微信小程序的登录问题
用户登录态的维护。实现当判断用户登录过之后,可以直接进入小程序的问题。
逻辑:总结整个session_key获取的流程
(1)注册微信小程序、登录后台在设置中获得appId和secret(密钥)
(2)调用wx.login()接口获取登录凭证js_code
(3)调用wx.request()接口把js_code发送到服务器后台
(4)在服务器后台,已知appId、secret、js_code
然后调用如下官方提供的http接口,即可返回获取openId、session_key
//当小程序初始化完成时,会触发 onLaunch(全局只触发一次)
onLaunch:function(){
  wx.login({
    success:function(res){
     var code = res.code;
    if(code){
    //代表获取code 成功
     wx.request({
     url:’http://testwx/login‘,
    data:{code:code}
     })
     } else {
    console.log(“获取用户登录失败:” + res.errMsg);
     }
  }
})
}
(1)上面这段代码意思就是在小程序初始化结束之后,先进行wx.login发起登录申请,开发者获取code

(2)在获取code之后,可进行wx.request请求。将登录凭证发往你的服务端,并在你的服务端使用该凭证向微信服务器换取该微信用户的唯一标识(openid)和会话密钥(session_key)。
  这是微信给出的链接:https://api.weixin.qq.com/sns/jscode2session?appid=APPID&secret=SECRET&js_code=JSCODE&grant_type=authorization_code 按照标准拼接url,然后访问微信服务器,此时就能得到openid和session_key

(3)为每个session生成一个唯一的字符串作为键,然后可以将session_key和openid作为值,存入redis中,为了安全,存入的时候还应设置一个超时的时间。key:session value:session_key+openid

(4)把生成的sesisonid放入到微信的缓存 storage ,用于后续通信使用。
举个栗子:wx.setStorage(OBJECT):
  wx.setStorage({
    key:”key”,
    data:”value”
    })

(5)通过wx.checkSession() 检测用户登录态是否失效。并决定是否调用wx.login() 重新获取登录态
举个栗子:
  wx.checkSession({
    success:function(){
    //代表session未过期,并且在本生命周期一直有效
    },
    fail:function(){
    //登录态过期
    wx.login() //重新登录
    ….
    }
})

3、用户登录的实现:
逻辑:login ->获取code ->getUserInfo获取iv和encryptedData ->传给自己的服务器处理 ->返回给小程序结果
可参考资料:http://blog.youkuaiyun.com/sk719887916/article/details/53761107

4、微信小程序如何嵌入到微信公众号中:
(1)打开微信开发者工具—–》进入你的项目—–》点击项目—–》选择上传—-》完善相应的配置—》填写版本号,完成上传—-》可通过点击预览查看在手机上查看效果

(2)登录微信公众平台–》进入开发管理–》提交审核–》勾选已阅读–》选择下一步—》进行身份验证—》第二步提交审核信息,一定要填写至少一个功能页面的信息,可以点击添加填写更多功能页面—-》配置服务器域名即可

关于小程序在公众号的显示形式:
(1)如果一个微信公众号关联了自己的小程序。那么,在公众号的介绍页面,就会出现一个相关小程序的模块。
(2)通过微信公众号的图文来访问小程序。
(3)可以在微信公众号中专门开个子菜单来接入微信公众号

end
    对了,微信小程序的研究呢,到此就告一段落了。剩下的那些组件啊,还有页面排版等功能,以后碰到了再总结。反正公司迟早要进行小程序开发的,哈哈。

    下一步是要研究react native这个前端框架。。。

    很无奈,我这个前端辣鸡,天天接触这些前端方面的东西,要疯了,,,,,,,,其实我是想学go的,golang和硬件对接,过不了多久就能接触到了,哈哈

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包

打赏作者

铁柱同学

你的鼓励将是我创作的最大动力

¥1 ¥2 ¥4 ¥6 ¥10 ¥20
扫码支付:¥1
获取中
扫码支付

您的余额不足,请更换扫码支付或充值

打赏作者

实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值