微信小程序之開放數據

微信小程序開放數據 open-data

open-data

基礎庫 1.4.0 開始支持，低版本需做兼容處理

用於展示微信開放的數據。

屬性名	類型	默認值	說明
type	String		開放數據類型
open-gid	String		當 type="groupName" 時生效, 羣id

type 有效值：

值	說明	最低版本
groupName	拉取羣名稱	1.4.0

Tips: 只有當前用戶在此羣內才能拉取到羣名稱

<open-data type="groupName" open-gid="xxxxxx"></open-data>

微信小程序承載網頁 web-view

web-view

基礎庫 1.6.4 開始支持，低版本需做兼容處理

web-view 組件是一個可以用來承載網頁的容器，會自動鋪滿整個小程序頁面。個人類型與海外類型的小程序暫不支持使用。

屬性名	類型	默認值	說明
src	String	none	webview 指向網頁的鏈接。需登錄小程序管理後臺配置域名白名單。

示例代碼：

<!-- wxml -->
<!-- 指向微信公衆平臺首頁的web-view -->
<web-view src="https://mp.weixin.qq.com/"></web-view>

相關接口 1

<web-view/>網頁中可使用JSSDK 1.3.0提供的接口返回小程序頁面。支持的接口有：

接口名	說明	最低版本
wx.miniProgram.navigateTo	參數與小程序接口一致	1.6.4
wx.miniProgram.navigateBack	參數與小程序接口一致	1.6.4
wx.miniProgram.switchTab	參數與小程序接口一致	1.6.5
wx.miniProgram.reLaunch	參數與小程序接口一致	1.6.5
wx.miniProgram.redirectTo	參數與小程序接口一致	1.6.5

示例代碼：

<!-- html -->
<script type="text/javascript" src="https://res.wx.qq.com/open/js/jweixin-1.3.0.js"></script>


// javascript
wx.miniProgram.navigateTo({url: '/path/to/page'})

相關接口 2

<web-view/>網頁中僅支持以下JSSDK接口：

接口模塊	接口說明	具體接口
判斷客戶端是否支持js		checkJSApi
圖像接口	拍照或上傳	chooseImage
	預覽圖片	previewImage
	上傳圖片	uploadImage
	下載圖片	downloadImage
	獲取本地圖片	getLocalImgData
音頻接口	開始錄音	startRecord
	停止錄音	stopRecord
	監聽錄音自動停止	onVoiceRecordEnd
	播放語音	playVoice
	暫停播放	pauseVoice
	停止播放	stopVoice
	監聽語音播放完畢	onVoicePlayEnd
	上傳接口	uploadVoice
	下載接口	downloadVoice
智能接口	識別音頻	translateVoice
設備信息	獲取網絡狀態	getNetworkType
地理位置	使用內置地圖	getLocation
	獲取地理位置	openLocation
搖一搖周邊	開啓ibeacon	startSearchBeacons
	關閉ibeacon	stopSearchBeacons
	監聽ibeacon	onSearchBeacons
微信掃一掃	調起微信掃一掃	scanQRCode
微信卡券	拉取使用卡券列表	chooseCard
	批量添加卡券接口	addCard
	查看微信卡包的卡券	openCard
長按識別	小程序圓形碼	無

相關接口 3

用戶分享時可獲取當前<web-view/>的URL，即在onShareAppMessage回調中返回webViewUrl參數。

示例代碼：

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

相關接口 4

在網頁內可通過window.__wxjs_environment變量判斷是否在小程序環境。

示例代碼：

// web-view下的頁面內
wx.ready(function() {
    console.log(window.__wxjs_environment === 'miniprogram') // true
})

Bug & Tip

1. 網頁內iframe的域名也需要配置到域名白名單。

2. 開發者工具上，可以在 <web-view/> 組件上通過右鍵 - 調試，打開 <web-view/> 組件的調試。

3. 每個頁面只能有一個<web-view/>，<web-view/>會自動鋪滿整個頁面，並覆蓋其他組件。

4. <web-view/>網頁與小程序之間不支持除JSSDK提供的接口之外的通信。

5. 在iOS中，若存在JSSDK接口調用無響應的情況，可在<web-view/>的src後面加個#wechat_redirect解決。