c 嵌套html5,关于H5嵌套小程序哪些事

1.使用webview跳转回小程序以及传参

使用miniProgram.navigateTo跟微信jssdk版本有关

this.$wx.miniProgram.navigateTo({

url:'/pages/login/login?redirectUrl='+encodeURIComponent(redirectUrl),

});

全局公共方法在vue中的main.js中配置demo如下

//----------------公共方法开始---------------------

import apiUrl from "./utils/apiUrl.js";

import tools from "./utils/tools.js";

import configCom from "../configCom.js";

import wx from "tencent-wx-jssdk"

Vue.prototype.$apiUrl = apiUrl;

Vue.prototype.$tools = tools;

Vue.prototype.$config = configCom;

Vue.prototype.$wx = wx;

//----------------公共方法结束---------------------

其中需要注意的是H5使用miniProgram.navigateTo向小程序传参最好使用encodeURIComponent进行编码一下,否则含有问号的参数会被小程序截断掉,小程序中接受参数方式为

pages/login/login.js

import apiUrl from '../../utils/apiUrl.js'

let app = getApp();

Page({

data: {

redirectPath:"pages/guide/guide",//重定向地址,如果不是分享进入,默认是引导页面

redirectUrl:"",

unloginUrl:'',

},

onLoad: function (options) {

this.showAppParams(options);

//page页面只是获取上一个页面传过来的参数,path、url是options的参数

var {path,url,redirectUrl} = options;

//上一个页面路径

if(path){

this.setData({

redirectPath:path

});

}

//分享进入,获取分享的地址

if(url && url!="undefined" && url!="null"){

this.setData({

redirectUrl:url

});

}

// 未登录重定向参数

if(redirectUrl && redirectUrl!="undefined" && redirectUrl!="null" ){

this.setData({

redirectUrl:redirectUrl

});

}

},

//检测options里面的内容 后台写的接口

showAppParams(options){

var url = apiUrl.getUrl(app.globalData.userId);

var opt = encodeURIComponent(JSON.stringify(options));

wx.request({

url:`${url.showAppParams}&params=Login>>>>${opt}`,

success(res){

}

});

},

//授权登录点击事件

bindGetUserInfo(e){

var that = this;

var url = apiUrl.getUrl(app.globalData.userId);

let {encryptedData,iv} = e.detail;

let code = app.globalData.code;

if(e.detail.userInfo){ //授权用户信息-确定

//用户信息

var userInfo = e.detail.userInfo;

var nickName = userInfo.nickName;

var userPhoto = userInfo.avatarUrl;

//存储用户信息

app.globalData.userInfo = userInfo;

wx.request({

url:`${url.decodeUserInfo}&encryptedData=${encodeURIComponent(encryptedData)}&iv=${encodeURIComponent(iv)}&code=${encodeURIComponent(code)}`,

method: 'post',

success(data){

var result = data.data

if(result.code=="000000"){

var openId = result.data.openId;//openId

var unionId = result.data.unionId;//unionId

//小程序用户信息保存-存储用户信息,存储缓存id

wx.request({

method:"POST",

url:`${url.saveWxAppUser}&wxAppOpenId=${openId}&unionId=${unionId}&nickName=${nickName}&userPhoto=${userPhoto}`,

success(res){

var result = res.data.data;

//存储缓存id

app.globalData.userId = result.id;

// 重定向,如果不是分享进入,默认是引导页面,是分享进入,跳转分享的页面

//H5分享,还需要可继续传递

if(that.data.redirectUrl){

wx.redirectTo({

url: "/"+that.data.redirectPath+"?url="+encodeURIComponent(that.data.redirectUrl)

});

}

//通过小程序本身分享的,直接跳转

else{

wx.redirectTo({

url: "/"+decodeURIComponent(that.data.redirectPath)

});

}

}

});

}else{

wx.showModal({

title: '提示',

content: '系统异常',

showCancel:false,

success (res) {

if(res.confirm){

wx.redirectTo({

url:"/pages/close/close"

})

}

}

});

return;

}

}

});

}else{ //授权用户信息-取消

//强制用户授权

// wx.showModal({

// title: '警告',

// content: '您点击了拒绝授权,将无法进入小程序,请授权之后再进入!',

// showCancel: false,

// confirmText: '返回授权',

// success: function (res) {

// if (res.confirm) {}

// }

// });

}

},

})

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

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

余额充值