web-view小程序转发功能,web-view和小程序之间传参

web-view的src只能带一个参数src="…?a=1"

h5页面

 var ua = window.navigator.userAgent.toLowerCase();
  if (ua.match(/MicroMessenger/i) == 'micromessenger') {   //判断是否是微信环境
  
//微信环境
wx.miniProgram.getEnv(function (res) {
  if (res.miniprogram) {
    // 小程序环境下逻辑
    //小程序发送信息```
    var info = {
      title: '11', //参数一
      value: '22', //参数二
    };

    wx.miniProgram.postMessage({
      data: info
    });

  } else {
    window.location.href = 'https://www.baidu.com';
    //非小程序环境下逻辑

  }
})
  } else {
    //非微信环境逻辑
    window.location.href = 'https://blog.csdn.net/qq_37235231/article/details/82053062';

  }

小程序页面
index.wxml页面

index.js页面

 Page({
   msgHandler: function (e) {    //(h5像小程序传递参数)
    console.log(e.detail.data) //获取到来自也页面的数据
     var info = (e.detail.data)[0]
	    this.setData({
	      value: info.value
	    });
	    this.setData({
	      title: info.title
	    });
    },
 onShareAppMessage: function (options) {   //转发时执行
    var that = this;
    console.log(this.data.webUrl);
    return {
      title: that.data.title,
      path: '/pages/index/index?value=' + that.data.value,//小程序像h5传递参数
      success(e) {
        // shareAppMessage: ok,
        // shareTickets 数组,每一项是一个 shareTicket ,对应一个转发对象
        // 需要在页面onLoad()事件中实现接口
        wx.showShareMenu({
          // 要求小程序返回分享目标信息
          withShareTicket: true
        });
      },
    }
  },
  onload:function(options){
    var webUrl = '';
    if (options.value) {//获取转发过来的参数
      webUrl = "https://www.jsssser.com/vity/gdsen.xhtm?value=" + options.value;
    } else {
      webUrl = "https://www.jsssser.com/vity/gdsen.xhtm"
    }
    this.setData({
      webUrl: webUrl
    })
 }
  })

h5的js页面(获取并处理小程序传递过来的参数)

function getParamer() {

	var url = window.location.href.split("?")[1]; /*获取url里"?"后面的值*/
	if (url) { /*判断是否是一个参数还是多个参数*/
		url = url.split("=")
		return url[1]; /*返回想要的参数值*/
	} else {
		return '';
	}
}

以上是个人做web-view转发所用到的知识,若有不很正确的地方,愿意改之

你可能感兴趣的:(前端小程序)