小程序转发分享是一个Page里的函数
文档地址:https://developers.weixin.qq.com/miniprogram/dev/reference/api/Page.html
Page中有了onShareAppMessage 这个方法后才支持转发
onShareAppMessage(Object object)
监听用户点击页面内转发按钮(button 组件 open-type="share"
)或右上角菜单“转发”按钮的行为,并自定义转发内容。
注意:只有定义了此事件处理函数,右上角菜单才会显示“转发”按钮
参数 | 类型 | 说明 | 最低版本 |
---|---|---|---|
from | String | 转发事件来源。button :页面内转发按钮;menu :右上角转发菜单 |
1.2.4 |
target | Object | 如果 from 值是 button ,则 target 是触发这次转发事件的 button ,否则为 undefined |
1.2.4 |
webViewUrl | String | 页面中包含web-view组件时,返回当前web-view的url | 1.6.4 |
此事件处理函数需要 return 一个 Object,用于自定义转发内容,返回内容如下:
自定义转发内容 基础库 2.8.1 起,分享图支持云图片。
字段 | 说明 | 默认值 | 最低版本 |
---|---|---|---|
title | 转发标题 | 当前小程序名称 | |
path | 转发路径 | 当前页面 path ,必须是以 / 开头的完整路径 | |
imageUrl | 自定义图片路径,可以是本地文件路径、代码包文件路径或者网络图片路径。支持PNG及JPG。显示图片长宽比是 5:4。 | 使用默认截图 | 1.5.0 |
示例:
onShareAppMessage(res){ console.log(res); if (res.from === 'button') { // 来自页面内转发按钮 console.log(res.target) } return { title: '自定义转发标题', path: '/page/user?id=123',//默认分享到首页,如果分享其它页面,将对应的页面路径写上去即可 } }
小程序不能分享到朋友圈,只能分享到好友
示例2(加分享图片)
onShareAppMessage(res){ console.log(res); if (res.from === 'button') { // 来自页面内转发按钮 console.log(res.target) } return { title: '自定义转发图片', path: '/pages/logs/logs', imageUrl:"/assets/image/touxiang.png",//也可以用线上图片,支持png jpg格式 } }
用按钮触发转发分享,同样是触发Page中的onShareAppMessage函数
<button size="mini" open-type="share">分享按钮</button>
小程序登录流程:
小程序登录接口在API的开放接口里可以找到
前台调用wx.login之后,会返回一个code,之后,将code通过网络请求发送给后端,后端需要appId+code+AppSecret向微信服务器发送请求,拿到openid和session_key
AppId和AppSecret可以在 左侧导航的开发模块,开发设置里,找到,AppSecret需要管理员扫码后生成
服务器拿到code、appid、appscecret后想微信发送一个请求,会返回一个openid和session_key,其中openid服务器会存一份,另外返回给前台
一般情况下,前台在给后台发送code时,会附带账号和密码,后台拿到code、appid、appscecret后,生成openid,然后后台再将openid和账号密码绑定到一起,存到数据库中,如果账号密码和openid都匹配,则返回登录成功的信息(一般会返回一个token),客户端拿到token后,就可以将token保存起来了,保存在storage就行,当用户退出小程序时,下次进入小程序,就不用通过接口来登录了,直接从storage中拿到token就可以登录成功。之后,前台就可以用网路请求,携带这个token和自定义的登录态去拿到 首页信息,openid,购物车相关保密信息了
登录演练:
一般登录在app.js中去做,不用在某个页面中去做
一般在App的onLaunch(小程序加载完去做登录)
// 登录 wx.login({ success: res => { // 发送 res.code 到后台换取 openId, sessionKey, unionId
//这个code只有5分钟有效期
console.log(res) } })
小面上一份真实的登录流程代码:
//app.js import api from "./utils/api.js" var TOKEN; App({ onLaunch: function () { // 登录 // 先尝试从缓存中取出token,如果没有再掉登录接口 TOKEN = wx.getStorageSync('token'); console.log(TOKEN) // 判断token私有有值 if (TOKEN && TOKEN.length > 0){//已经有token了 验证token是否过期 // 验证token是否过期 this.check_token(TOKEN); }else{//没有token进行登录操作 this.login(); } }, globalData: { userInfo: null, token:"" }, check_token(token){//验证token是否过期 console.log("执行了验证token的操作") wx.request({ url: 'http://123.207.32.32:3000/auth', method:"post", header:{ token }, success:res=>{ console.log(res) if(!res.data.errCode){//说明token有效 console.log("token有效") this.globalData.token = token;//将有效的token放到global对象中 }else{//若token有问题 不管过期还是怎么样 console.log("token无效") this.login();//调用登录接口 } }, fail:err=>{ console.log(err) } }) }, login(){//登录 console.log("执行了登录操作") wx.login({ success: res => { // 发送 res.code 到后台换取 openId, sessionKey, unionId console.log(res) const code = res.code; api.post("http://123.207.32.32:3000/login", { code }, res => { console.log(res) // 取出token TOKEN = res.data.token; // 将token保存在globalData中 this.globalData.token = TOKEN; console.log(this.globalData.token) // 将token存储在本地 wx.setStorageSync("token", this.globalData.token)//不带sync的是异步,带上sync是同步,存储不完,不往下执行 }, err => { console.log(err) }) } }) } })
。