[小程序开拓] 微信小程序内嵌网页web-view开辟教程

by admin on 2019年11月3日

网页程序迁移至微信小程序web-view详明

2018/08/02 · JavaScript
· 小程序

原稿出处: NeoPasser   

小程序今后越发流行,不过公司的累累品种都以用网页写的,小程序语法不包容原生网页,使得旧有品种搬迁至小程序代价非常高。

小程序早先开放了webview效率,能够说是网页应用的第一次全国代表大会福音了,可是微信的webview有部分坑,那篇作品便是列举一下自家在付出进度中碰到的有个别难题甚至自己找到的有个别缓慢解决方案。

听大人说厂商事情须求,在做Android开垦的同一时间,还得同步进行另三个系列的微信小程序开荒,不能,公司调治,节约开销,研究开发也回降了好些个少人,只得边学边开采…

为了便利开荒者灵活配置小程序,微信小程序开放了内嵌网页本领。那意味着小程序的剧情不再局限于pages和large,大家得以借助内嵌网页充分小程序的内容。下边附上详细的支出教程(含摄像操作以至注意事项)

  web-view 是三个方可承继 web 网页的容器,当 WXML 文件中设有 web-view
组件时,别的零件会自行全体失效,並且 web-view
承载的零件会活动铺满小程序的成套页面。别的零件的从头到尾的经过将不再显得。

微信小程序异步管理详细明白,小程序异步详细明白

正文实例为大家享受了微信小程序异步管理的具体方法,供大家仿照效法,具体内容如下

直白看难点:

图片 1

接下来看打字与印刷的结果:

图片 2

基于上边两图能够看出,代码上先推行的网络央浼,再实践打字与印刷的变量,但是从底下打字与印刷的结果来看,先出结果的是实践打字与印刷变量的函数(aafn函数),再打印出网络须求success的回调里再次来到的数量和赋值后的变量的值;

何以先履行的aafn,并且打字与印刷的值未有赋值上?

因为wx.request是三个异步的必要,所以数据央求的还要,可以三翻五次向下进行函数。所以这里值还不曾赋值上就起来打字与印刷了变量的值;

这种气象,怎么杀绝吧?

方法一:

嵌套

在wx.request的success回调里施行aafn函数

图片 3

下一场运转结果

图片 4

此地就取到值了

但是要是逻辑很复杂,必要用到比超多层异步,就如那样:

asyncFn1(function(){
 //...
 asyncFn2(function(){
  //...
  asyncFn3(function(){
   //...
   asyncFn4(function(){
    //...
    asyncFn5(function(){
      //...
    });
   });
  });
 });
});

如此那般代码看起来就很不佳看,代码的可读性和可维护性就不佳了

这怎么化解这一个主题素材呢?Promise这种概念的发生,很好地消除了那全部,Promise是怎么?这里笔者就不多说了风乐趣的融洽去看大器晚成看,Promise介绍链接

先看看Promise的方式:

function asyncFn1(){
 return new Promise(function (resolve, reject) {
  //...
 })
}

// asyncFn2,3,4,5也实现成跟asyncFn1一样的方式...

调用

asyncFn1()
 .then(asyncFn2)
 .then(asyncFn3)
 .then(asyncFn4)
 .then(asyncFn5);

那样的话,异步函数就可以依次实践了

微信小程序的异步API怎么扶植Promise呢?大家能够多少个四个的用Promise去包装那么些API,可是这么些依然比较麻烦的。但是,小程序的API的参数格式都相比较统风流倜傥,只接纳二个object参数,回调都以在这些参数中安装,所以,这为了统后生可畏管理提供了便利,写多少个工具方法,来产生如此的干活

第风流倜傥须要援引一个叫bluebird.js的公文;

进去bluebird官方网址下载:

图片 5

那几个近乎是不可能下载的,不过你可以点击步向,然后复制,在小程序里创制贰个js文件,将代码复制到那么些js里面,然后引用。

接下来再写三个JS,里面写工具方法:

图片 6

下面是prom.js

图片 7

接下来需求利用的可怜页面的js里引进prom.js:

图片 8

调用:

图片 9

打字与印刷结果

图片 10

那样就能够了,达成。

以上便是本文的全部内容,希望对大家的求学抱有补助,也期望大家多都赐教帮客之家。

本文实例为大家分享了微信小程序异步处理的具体方法,供大家参考,具体内容如下
直接看问…

遇见的标题

  1. openid登陆难题
  2. webview动态src
  3. 付出功用
  4. 享受功效
  5. 环视普通二维码跳转特定页面
  6. 回来按键缺点和失误难点

而是微信1六月发布了小程序扶助web-view的音讯,让本次开采减了比超级多的专业量,首假设蓝牙5.0设备的数码采撷及上传

后生可畏、小程序内嵌网页web-view教程

1) 微信公众平台,登陆小程序账号

图片 11

2) 左侧-设置-开荒设置-业务域名-配置

图片 12

3) 小程序管理员微信扫码

图片 13

4) 填写小程序专业域名,域名需ICP备案

图片 14

5) 下载校检文件上传至服务器钦点目录,保存

图片 15

6) 小程序专门的学问域名配置完毕

图片 16

7) 展开微信开采者工具,加多小程序项目

图片 17

8)
步向小程序调节和测验,点击尾巴部分导航-外链页page10001,侧面找到page10001.wxml,删除原有代码,插入

备考:此处外链页为空白页,便于依靠webview组件插入网页内容作对照

图片 18

9)ctrl+s保存查阅小程序内嵌网页得内容

备考:此处开采者需立异到教程库版本1.6.4

图片 19

应用办法:

openid登陆难点

微信webview的运用情势非常粗略,只要如下设置src就能够来得具体的网站了。

<!– wxml –> <!– 指向微信公众平台首页的web-view –>
<web-view src=”;

1
2
3
<!– wxml –>
<!– 指向微信公众平台首页的web-view –>
<web-view src="https://mp.weixin.qq.com/"></web-view>

微信情状里的浩大网页都以用页面要兑现网址的报到功效,只要把登入的音信,比方openid大概其余音信拼接到src里就好了。

此地有个难题,大伙儿号的账号种类日常是以openid来判别唯生龙活虎性的,小程序是足以拿走openid的,可是小程序的openid和原群众号之类的openid是不相像的,须求将原本的openid账号系列进步为unionid账号连串。

以下是微信对unionid的介绍

获得顾客基本消息(UnionID机制)

在关心者与群众号发生音信交互后,民众号可获得关切者的OpenID(加密后的微随机信号,每一种客商对各种大伙儿号的OpenID是唯少年老成的。对于不一样大伙儿号,同后生可畏客商的openid差异)。公众号可透过本接口来依据OpenID获取客户中心音信,饱含别称、头像、性别、所在城市、语言和关心时间。

请留意,要是开辟者有在多少个大伙儿号,或在民众号、移动使用之间联合客户帐号的须要,必要前往微信开放平台(open.weixin.qq.com)绑定公众号后,才可采纳UnionID机制来满意上述供给。

UnionID机制表达:

开辟者可由此OpenID来博取客商宗旨新闻。特别要求注意的是,假若开垦者具备多个活动选择、网址接收和公众帐号,可透过获得客商宗旨音信中的unionid来分裂客商的唯大器晚成性,因为尽管是同八个微信开放平台帐号下的移位选取、网址接纳和大众帐号,客户的unionid是必须要经过的路的。换句话说,同后生可畏客户,对同二个微信开放平台下的两样选择,unionid是均等的。

做完以上步骤,就能够调用小程序api wx.getUserInfo()
来收获客户新闻了,此步骤须求开展后台音讯解密进程,在那就不再赘言,结合小程序api文档操作就好。

赢获得unioid之后,将unionid消息拼接到src就能够举办网页登陆操作了(前提是网页能够用跳转链接的主意登陆,相似群众号页面获得openid的花样)。

  • web-view

二、小程序web-view注意事项

1)业务域名需ICP备案,新域名备案24钟头后就可以配置,域名不协理IP地址及端口号

2)下载校检文件,上传至服务器钦定根目录

3)开拓者工具最新版-基础库版本1.6.4

  <web-view src=”;

webview动态src

微信的webview有个坑之处,不会动态的监听src的成形,那就招致了一个标题,要经过退换src完结页面跳转就不可能了。
笔者尝试了部分方法之后,找到了一个消除方案:

微信webview在页面load的时候会加载叁遍webview,我们就动用那一个天性来完成动态src难点。

  1. 先是把要跳转的链接音信设置成全局变量,要转移src的时候,先把要src以’?‘拆分为链接和参数两有个别,存入全局函数,再调用onLoad就能够实现webview刷新了。
  2. 页面跳转时,我们也急需src的动态刷新,所以要把链接音信存入全局函数;页面跳转时,onShow函数会被调用,此时再调用贰回onLoad就能够了。

data: { url: ”, loaded: false } // 小程序js里的onLoad函数能够写成那样
onLoad: function () { this.setData({ url: getApp().globalData.urlToken +
‘?’ + getApp().globalData.urlData }) }, changUrl: function () {
getApp().globalData.urlToken = ”
getApp().globalData.urlToken = ‘a=1&b=2’ //
直接调用onLoad,就能完成src的刷新 this.onLoad() }, onShow: function () {
if (!this.data.loaded) { // 第三遍不运维 this.setData({ loaded: true })
return } // 直接调用onLoad,就能够达成src的基础代谢 this.onLoad() } //
wxml能够写成这么 <web-view src=”{{url}}”></web-view>

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
data: {
    url: ”,
    loaded: false
}
// 小程序js里的onLoad函数可以写成这样
onLoad: function () {
    this.setData({
      url: getApp().globalData.urlToken + ‘?’ +  getApp().globalData.urlData
    })
},
changUrl: function () {
    getApp().globalData.urlToken = ‘https://www.example.com’
    getApp().globalData.urlToken = ‘a=1&b=2’
    // 直接调用onLoad,就会实现src的刷新
    this.onLoad()
},
onShow: function () {
    if (!this.data.loaded) {
      // 第一次不运行
      this.setData({
        loaded: true
      })
      return
    }
    // 直接调用onLoad,就会实现src的刷新
    this.onLoad()
  }
 
// wxml可以写成这样
<web-view src="{{url}}"></web-view>

于是乎,就去探听了弹指间web-view

三、附上此番小程序web-view内嵌网页测量试验包及录像教程

webview录像演示:https://www.zhihu.com/question/67564075/answer/258773999

注意事项:

付出功用

webview里面能够经过jssdk来促成都部队分小程序成效,但不能够直接调用小程序的支付效用,那个时候大家就需求转移一下政策了:

  1. 在网页里引入微信jssdk
  2. 在网页需求倡导支付的地点,调用跳转页面包车型地铁接口,调整小程序跳转到小程序的费用页面(这么些要在小程序里独自写的),跳转的时候,要求把订单的局地信息都凑合到链接里,订单新闻由后台再次回到,须要通过微信支付连串的晤面下单接口,具体参看支付文书档案。
  3. 跳转到小程序开拓页面后,由小程序页面发起支付,支付成功后跳转回webview页面,通过从前设置的动态src,调整webview跳转到特定的页面。

JavaScript

// 网页引进jssdk // 网页发起支付 wx.miniProgram.navigateTo({ //
payData由后台重回,首若是内需联合下单平台的prepay_id url:
‘../pay/index?data=’ + encodeUQashqaiIComponent(JSON.stringify(payData)) }) //
微信支付页面 onLoad: function (option) { let page = this try { let data
= JSON.parse(option.data) if (!data || !data.prepay_id) {
console.error(‘支付参数错误,请稍后重试’, data) } wx.requestPayment({
timeStamp: ” + data.timestamp, nonceStr: data.nonceStr, package:
‘prepay_id=’ + data.prepay_id, paySign: data.paySign, signType:
data.signType, success: function (res) { getApp().globalData.urlToken =
`paySuccess.html` // 支付成功 getApp().globalData.urlData =
‘data=paySuccessData’ wx.navigateTo({ url: ‘/page/home/index’, }) },
fail: function (res) { getApp().globalData.urlToken = `payError.html`
// 支付失利 getApp().globalData.urlData = ‘data=payErrorData’
wx.navigateTo({ url: ‘/page/home/index’, }) }, complete: function (res)
{ } }) } catch (e) { console.error(‘支付错误’, e) } }

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
// 网页引入jssdk
 
// 网页发起支付
wx.miniProgram.navigateTo({
    // payData由后台返回,主要是需要统一下单平台的prepay_id
    url: ‘../pay/index?data=’ + encodeURIComponent(JSON.stringify(payData))
})
// 微信支付页面
onLoad: function (option) {
    let page = this
    try {
      let data = JSON.parse(option.data)
      if (!data || !data.prepay_id) {
        console.error(‘支付参数错误,请稍后重试’, data)
      }
      wx.requestPayment({
        timeStamp: ” + data.timestamp,
        nonceStr: data.nonceStr,
        package: ‘prepay_id=’ + data.prepay_id,
        paySign: data.paySign,
        signType: data.signType,
        success: function (res) {
          getApp().globalData.urlToken = `paySuccess.html`
          // 支付成功
          getApp().globalData.urlData = ‘data=paySuccessData’
          wx.navigateTo({
            url: ‘/page/home/index’,
          })
        },
        fail: function (res) {
          getApp().globalData.urlToken = `payError.html`
          // 支付失败
          getApp().globalData.urlData = ‘data=payErrorData’
          wx.navigateTo({
            url: ‘/page/home/index’,
          })
        },
        complete: function (res) {
        }
      })
    } catch (e) {
      console.error(‘支付错误’, e)
    }
  }
  1. 个体开采者不能使用
  2. 供给配置域名,且域名需ICP备案24钟头以上,不帮忙ip及端口
  3. 需使用https
  4. 各样小程序账号仅辅助配置十几个域名,每一种域名最多绑定21个小程序,各样小程序一年内最多帮衬改进域名肆十五遍

  1. src
属性的值是二个网页链接,且该链接必得在小程序管理后新竹的域名白名单中。

享受功效

小程序直接分享的webview所在的页面,假使急需加上页面参数,那我们就供给处理一下了。

  1. webview内是不能够直接发起分享的,需求先用wx.miniProgram.postMessage接口,把需求分享的新闻,推送给小程序;推送给小程序的新闻不是实时管理的,而是顾客点击了享受开关之后,小程序才回来读取的,那将必要每一种须求分享的页面再步向的时候就发起wx.miniProgram.postMessage推送分享音讯给小程序。
  2. 小程序页面通过bindmessage绑定的函数读取post音讯,分享的消息会是三个列表,大家取最终八个分享就好,把分享新闻管理好,存到data里面以便下一步onShareAppMessage调用。
  3. 顾客点击共享时,会触发onShareAppMessage函数,在内部安装好相应的享受消息就好了。
  4. onload函数有贰个option参数的,能够读取页面加载时url里带的参数,当时要对原先的onload函数进行改建,完结从option里读取链接新闻。

JavaScript

// 网页wx.miniProgram.postMessage wx.miniProgram.postMessage({ data: {
link: shareInfo.link, title: shareInfo.title, imgUrl: shareInfo.imgUrl,
desc: shareInfo.desc } }) // 小程序index wxml设置 <web-view
src=”{{url}}” bindmessage=”bindGetMsg”></web-view> //
小程序index js bindGetMsg: function (e) { if (!e.detail) { return } let
list = e.detail.data if (!list || list.length === 0) { return } let info
= list[list.length – 1] if (!info.link) {
console.error(‘分享音讯错误’, list) return } let tokens =
info.link.split(‘?’) this.setData({ shareInfo: { title: info.title,
imageUrl: info.imgUrl, path:
`/page/index/index?urlData=${encodeURIComponent(tokens[1])}&urlToken=${tokens[0]}`
} }) }, onShareAppMessage: function (res) { if (res.from === ‘button’) {
// 来自页面内转发开关 console.log(res.target) } let that = this return {
title: that.data.shareInfo.title, path: that.data.shareInfo.path,
imageUrl: that.data.shareInfo.imageUrl, success: function (res) { //
转发成功 }, fail: function (res) { // 转载失利 } } }, onLoad: function
(option) { if (option.urlToken) { getApp().globalData.urlToken =
option.urlToken } if (option.urlData) { getApp().globalData.urlData =
option.urlData } this.setData({ url: getApp().globalData.urlToken + ‘?’

  • getApp().globalData.urlData }) },
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
// 网页wx.miniProgram.postMessage
wx.miniProgram.postMessage({
  data: {
    link: shareInfo.link,
    title: shareInfo.title,
    imgUrl: shareInfo.imgUrl,
    desc: shareInfo.desc
  }
})
// 小程序index wxml设置
<web-view src="{{url}}" bindmessage="bindGetMsg"></web-view>
// 小程序index js
bindGetMsg: function (e) {
    if (!e.detail) {
      return
    }
    let list = e.detail.data
    if (!list || list.length === 0) {
      return
    }
    let info = list[list.length – 1]
    if (!info.link) {
      console.error(‘分享信息错误’, list)
      return
    }
    let tokens = info.link.split(‘?’)
    this.setData({
      shareInfo: {
        title: info.title,
        imageUrl: info.imgUrl,
        path: `/page/index/index?urlData=${encodeURIComponent(tokens[1])}&urlToken=${tokens[0]}`
      }
    })
},
onShareAppMessage: function (res) {
    if (res.from === ‘button’) {
      // 来自页面内转发按钮
      console.log(res.target)
    }
    let that = this
    return {
      title: that.data.shareInfo.title,
      path: that.data.shareInfo.path,
      imageUrl: that.data.shareInfo.imageUrl,
      success: function (res) {
        // 转发成功
      },
      fail: function (res) {
        // 转发失败
      }
    }
},
onLoad: function (option) {
    if (option.urlToken) {
      getApp().globalData.urlToken = option.urlToken
    }
    if (option.urlData) {
      getApp().globalData.urlData = option.urlData
    }
    this.setData({
      url: getApp().globalData.urlToken + ‘?’ +  getApp().globalData.urlData
    })
},

  2. 客户在享用是能够赢稳妥前页面 <web-view> 的 src
的值,在页面包车型地铁 onShareAppMessage 事件中可以获取到该值。

环顾普通二维码跳转特定页面

除外共享作用之外,小程序还是能通过布署,实现扫描普通二维码跳转特定页面包车型地铁成效。

以下是微信对此功效的介绍

为了有助于小程序开垦者更省事地松开小程序,宽容线下已部分二维码,微信民众平台开放扫描普通链接二维码跳转小程序工夫。

职能介绍

日常链接二维码,是指开辟者使用工具对网页链接进行编码后生成的二维码。

线下商家可不需更动线下二维码,在小程序后台实现陈设后,就可以在客商扫描普通链接二维码时展开小程序,使用小程序的意义。
对于平时链接二维码,最近支撑选用微信“扫一扫”或微信内长按识别二维码跳转小程序.

二维码准绳

基于二维码跳转准则,开采者要求填写须要跳转小程序的二维码准则。需求如下:

  1. 二维码法则的域名须通过ICP备案的印证。
  2. 支撑http、https、ftp初叶的链接(如:、)。
  3. 八个小程序帐号可布署相当少于十二个二维码前缀法规。

前缀占用准绳

开荒者可筛选是还是不是占用相符二维码相称法规的全部子准绳。如接受占用,则此外帐号不可申请使用满意该前缀相称准则的任何子法规。

如:若开采者A配置二维码准则:,并选取“占用全体子准则“,其他开采者将不得以陈设满意前缀相称的孙菲菲则如。

笔者推荐的点子

webview完结方式

  1. 安装跳转成效小程序后台就足以安装,链接是分为四局地,路https://www.example.com/wxmin…。

    https://www.example.com 域名
    /wxmini/ 小程序前置规则,需要在服务器上建一个文件夹,并且把验证文件放在文件夹线
    home.html 需要跳转的网页页面
    a=1 跳转页面的参数
  2. 对onload函数再扩充处理,达成普通二维码跳转。

JavaScript

// 对index onLoad在开展管理 onLoad: function (option) {
this.resetOption(option) if (option.urlToken) {
getApp().globalData.urlToken = option.urlToken } if (option.urlData) {
getApp().globalData.urlData = option.urlData } this.setData({ url:
getApp().globalData.urlToken + ‘?’ + getApp().globalData.urlData }) },
resetOption: function (option) { if (!option) { return } if (option.q) {
option.q = decodeURIComponent(option.q) if
(option.q.indexOf(”) == -1) { return }
let tmp = option.q.replace(‘/wxmini’, ”) let tmps = tmp.split(‘?’)
option.urlToken = tmps[0] option.urlData = tmps[1] } else {
option.urlData = decodeURIComponent(option.urlData) } }

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
// 对index onLoad在进行处理
onLoad: function (option) {
    this.resetOption(option)
    if (option.urlToken) {
      getApp().globalData.urlToken = option.urlToken
    }
    if (option.urlData) {
      getApp().globalData.urlData = option.urlData
    }
    this.setData({
      url: getApp().globalData.urlToken + ‘?’ +  getApp().globalData.urlData
    })
},
resetOption: function (option) {
    if (!option) {
      return
    }
    if (option.q) {
      option.q = decodeURIComponent(option.q)
      if (option.q.indexOf(‘https://www.example.com/wxmini/’) == -1) {
        return
      }
      let tmp = option.q.replace(‘/wxmini’, ”)
      let tmps = tmp.split(‘?’)
      option.urlToken = tmps[0]
      option.urlData = tmps[1]
    } else {
      option.urlData = decodeURIComponent(option.urlData)
    }
}
<web-view src="https://www.itlao5.com"></web-view>

    即:onShareAppMessage:function( options ){

回到按键缺点和失误难点

举例web页面是在首先个页面包车型地铁话,那个时候会有三个主题素材,小程序的回来按键就不曾了,webview不可能使用微信的回到开关了,那个时候只要在webview页前边多加多少个跳转页面就好了(第贰个页面也得以设置成获取客户权限的页面,可是笔者觉获得那样感受倒霉,亦不是富有页面都要顾客得到了权力才得以行使)

最终的页面层级

JavaScript

“pages”: [ “page/index/index”, //
首页,管理onload里的option内容,为了重返按键设置的 “page/home/index”, //
webview所在的页面 “page/auth/index”, // 获取客商权限的页面
“page/pay/index”, // 支付页面 “page/error/index” // 错误音讯页面 ],

1
2
3
4
5
6
7
"pages": [
    "page/index/index", // 首页,处理onload里的option内容,为了返回按钮设置的
    "page/home/index", // webview所在的页面
    "page/auth/index", // 获取用户权限的页面
    "page/pay/index", // 支付页面
    "page/error/index" // 错误信息页面
  ],

十分轻便,后生可畏行代码解决,小程序中的web-view会自动攻克整个页面,所以不能够在web-view上再覆盖view

        console.log( options.webVIewUrl );

参照链接

  1. webview文档
  2. 小程序unionid介绍
  3. unionid得到格局

    2 赞 2 收藏
    评论

图片 20

  1. 顾客能够通过<web-view
    src=”
  2. 网页能够动用wx.miniProgram.navigateTo、wx.miniProgram.navigateBack等接口调整小程序的跳转,并传值
  3. 网页能够调用JSSDK钦定的js方法
  4. 客商分享时可收获当前web-view的url,即在onShareAppMessage回调中回到webViewUrl参数。
    示例代码:

        // 可进展下一步操作

      }

Page({ onShareAppMessage { console.log(options.webViewUrl) }})

其余作用(首若是 JSSDK 1.3.0 提供的效果与利益):

  1. ios若jssdk接口调用无响应,可在<web-view
    />的src后增进#wechat_redirect试试
  2. web-view空白难题,请晋级微信客商端到 6.5.16
  3. web-view不协理开拓

  1. 功效描述:

原稿:简书ThinkinLiu 博客: IT老五ps:
初学小程序,理解还不深,只可以写写这几个浅显的东西,恐怕装有脱漏或错误,希望能提议,后续有越多少深度入,博览会开一些填补

     在 web-view 内嵌的网页中能够运用 JSSDK 1.3.0
提供的接口再次回到小程序页面。前提是必需在网页中引进 js 文件。

   使用方法:

     1. 页面中引进 js
文件:<script type="text/javascript" src="https://res.wx.qq.com/open/js/jweixin-1.3.0.js"></script>

     2. 应用提供的接口重回小程序页面:

       wx.miniProgram.navigateTo,参数与用法和小程序中的
wx.navigateTo 用法生机勃勃致。

       wx.miniProgram.navigateBack,参数与用法和小程序中的 wx.navigateBack
用法大器晚成致。

       wx.miniProgram.switchTab,参数与用法和小程序中的 wx.switchTab
用法生机勃勃致。

       wx.miniProgram.reLaunch,参数与用法和小程序中的 wx.reLaunch
用法意气风发致。

       wx.miniProgram.redirectTo,参数与用法和小程序中的 wx.redirectTo
用法大器晚成致。

         示例:   wx.miniProgram.navigateTo({

               url: “pages/personal/personal”

             })

  2. 意义描述:

     在 web-view 内嵌的网页中得以行使 JSSDK 1.3.0
提供的点子剖断当前页面是还是不是留存于小程序情况中。

    应用格局:

     wx.ready(function() {

       // console.log(window.__wxjs_environment === 'miniprogram') // true
       if( window.__wxjs_environment === 'miniprogram' ){

         // 如果在小程序中,做相应处理
       }
     })

     

发表评论

电子邮件地址不会被公开。 必填项已用*标注

网站地图xml地图