微信小程序开发笔记-实战之开发(二)

一.开始

上一步将准备工作做好之后   会发现模板之中已经有写好的js  所以幸福啊  我们要做的就是修修改改  测试下没问题就可以上线了

结构如图

微信小程序开发笔记-实战之开发(二)

pages里面的就是各个页面的内容

 

二.开发

由于下载下来的模板  大部分js  都已经帮我们写好了  因此  我们只需要修改  自己的接口  或者 业务逻辑即可  

我在修改的时候  主要遇到的问题就是一个登录信息的获取

1) 登录信息的获取

由于微信修改了用户信息的获取  因此还需要制作弹框 让用户授权才行  因此  我们只需要一个唯一标识openid  不需要那样

只需要新写接口获取openid入库就行

//onLoad为预加载函数  初次进入加载  且 只加载一次

onLoad: function () {

var self=this;

wx.login({

success(res) {

//js调用登陆命令获取到code

if (res.code) {

//通过code调用自己服务接口获取到openid

wx.request({

url: '此处为自己接口路径例如http://127.0.0.1:8001/user/getOpenId,后期上线修改为域名',

data: {

code: res.code

},

success:function(wxInfo){

console.log(wxInfo);

//self.data.openid = wxInfo.data.openid

users.openid = wxInfo.data.openid;

self.getPerson();

}

})

} else {

console.log('登录失败!' + res.errMsg)

}

}

})

},

//入库用户信息操作

getPerson:function(){

var sendData = {};

sendData.openid = users.openid;

//此处为自己封装的调用函数

api['OpreateUser'](sendData).then((res) => {

console.log("==========>openid保存成功");

}).catch(() => {

wx.showToast({

duration: 3000,

title: "出错了",

icon: 'none',

})

});

}

接口中需要注意的是调用微信获取openid接口  为https  不可前端直接调用  因为上线的时候  需要配置允许访问的域名  官方不允许配置https://api.weixin.qq.com,所以只能后台接口调用后返回给前端

https://api.weixin.qq.com/sns/jscode2session?appid=你的APPID&secret=你的SECRET&js_code=wx.login返回的code&grant_type=authorization_code

 

三.结语

自己本地测试好后  就可以准备发布上线了  想想还有点小激动