网页手机号抓取程序(附近门店小程序如何通过路由传递参数？(1) )

　　网页手机号抓取程序(附近门店小程序如何通过路由传递参数？(1)

)

　　程序如何实现页面间跳转 wx.navigateTo(OBJECT)

　　保持当前页面，跳转到app中的一个页面，使用wx.navigateBack返回到原来的页面。注意：目前页面路径只能乘十层。

　　wx.redirectTo（对象）

　　关闭当前页面并跳转到应用程序中的一个页面。

　　wx.reLaunch（对象）

　　关闭所有页面并打开应用程序内的页面。

　　wx.switchTab（对象）

　　跳转到tabBar页面并关闭所有其他非tabBar页面

　　wx.navigateBack(对象)

　　关闭当前页面，返回上一页或多级页面。您可以通过getCurrentPages()) 获取当前页面堆栈，并决定返回多少层。

　　如何更改小程序的标题？

　　wx.setNavigationBarTitle({

　　标题：'附近的商店'

　　})

　　小程序如何通过路由传递参数？

　　(1)列表页绑定事件(xxList.wxml)

　　1

2

3

4

5

　　(2)通过列表页面的事件对象获取参数(xxList.js)

　　1goproductDetail:function(event){

2 let that = this;

3 let chosenPrdId = event.currentTarget.id

4 wx.navigateTo({

5 url: `../productDetail/productDetail?productId=${chosenPrdId}`,

6 success: function () {

7

8 wx.setNavigationBarTitle({

9 title: '产品详情'

10 })

11 },

12 fail: function () {

13 console.log('进入了失败的回调');

14 }

15 })

16 }

17

18

　　(3)获取详情页路由参数(xxDetail.js)

　　1 onLoad: function (option) {

2 console.log(option.chosenPrdId); //选择的id

3 // TODO 访问后台接口查询具体信息

4 }

5

6

　　this.setData 和直接赋值的区别

　　这两者都可以引起data中数据的变化，但是this.setData赋值会引起wxml中数据的变化，即同步更新渲染界面，直接赋值只会改变data中的数据，而界面不会变化。

　　授权获取用户手机号思路

　　实施思路：

　　1、通过wx.login获取代码，将代码传到后台，然后后台访问微信接口获取用户的openID和sessionKey，但是后台无法直接将openID或者sessionKey发送到前台（不安全），但是需要单独的字段与openID和sessionKey相关联，然后传递给前台，作为前台登录成功的标志，相当于本地浏览器中cookie存储的session . 设置存储的变量名（如果是userId）

　　2、前端通过按键按钮触发getPhoneNumber事件，用户允许授权(e.detail.errMsg == 'getPhoneNumber:ok')获取encryptedData,iv

　　3、通过request请求将[encryptedData],[iv],[userId]传给后台，后台接收解密得到用户手机号，返回给前台，前台存储在本地供其他逻辑判断或以后使用

　　小程序如何输出遍历对象

　　1

2 {{ key }}

3

4

5

　　微信小程序登录授权思路

　　1.调用wx.login()接口，成功后获取用户的code信息

　　2.通过接口将code信息传递给自己的后端（不是微信后端），在服务器端向微信后端发起请求，成功后获取用户登录状态信息，包括openid， session_key等。也就是openid的交换码，是用户的唯一标识。

　　3.在后端，获取到openid、session_key等信息后，通过第三方加密生成自己的session信息，返回给前端。

　　4.前端拿到第三方加密的会话后，通过wx.setStorage()保存在本地，后续请求需要携带第三方加密的会话信息。

　　5.之后，如果用户需要重新登录，首先查看本地会话信息。如果存在，在微信服务器上使用 wx.checkSession() 检查是否过期。如果它在本地不存在或已过期，请再次从步骤 1 开始登录过程。

　　1onLaunch:function () {

2 var than = this

3 // 展示本地存储能力

4 var logs = wx.getStorageSync('logs') || []

5 logs.unshift(Date.now())

6 wx.setStorageSync('logs', logs)

7 // 登录

8 wx.login({

9 success: res => {

10 var code = res.code

11 // console.log(code)

12 wx.getUserInfo({

13 success: res => {

14 console.log(res),

15 // this.globalData.userInfo = res.userInfo

16 //全局储存

17 wx.request({

18 url: 'https://exam.qhynice.top/index.php/Api/Login/getsessionkey',

19 method: "POST",

20 data: {

21 code: code

22 },

23 header: {

24 'content-type': 'application/x-www-form-urlencoded'

25 },

26 success: ress => {

27 console.log(ress.data)

28 var openid = ress.data.openid

29 wx.setStorageSync('openid', ress.data.openid)

30 wx.setStorageSync('session_key', ress.data.session_key)

31 wx.request({

32 url: 'https://exam.qhynice.top/index.php/Api/Login/authlogin',

33 method: "POST",

34 data: {

35 openid: wx.getStorageSync('openid'),

36 NickName: res.userInfo.nickName,

37 HeadUrl: res.userInfo.avatarUrl,

38 gender: res.userInfo.gender

39 },

40 header: {

41 'content-type': 'application/x-www-form-urlencoded'

42 },

43 success(res) {

44 console.log(res)

45 var id = res.data.arr.ID

46 wx.setStorageSync('id', id)

47 },

48 })

49 }

50 })

51 }

52 })

53 // 发送 res.code 到后台换取 openId, sessionKey, unionId

54 }

55 })

56 // 获取用户信息

57 wx.getSystemInfo({

58 success: e => {

59 this.globalData.StatusBar = e.statusBarHeight;

60 let capsule = wx.getMenuButtonBoundingClientRect();

61 if (capsule) {

62 this.globalData.Custom = capsule;

63 this.globalData.CustomBar = capsule.bottom + capsule.top - e.statusBarHeight;

64 } else {

65 this.globalData.CustomBar = e.statusBarHeight + 50;

66 }

67 }

68 })

69 }

70

71