tencent cloud

Feedback

API Description

Last updated: 2024-11-28 10:45:12

    Routes

    API
    Description
    wx.miniProgram.navigateTo
    Retains the current page and navigates to a specific page within the app. However, it cannot navigate to a tabBar page.
    wx.miniProgram.navigateBack
    Closes the current page and returns to the previous page or a multi-level page.
    wx.miniProgram.switchTab
    Redirects to the tabBar page and closes all other non-tabBar pages.
    wx.miniProgram.reLaunch
    Closes all pages and opens a specified page in the app.
    wx.miniProgram.redirectTo
    Closes the current page and navigates to a specific page within the app. However, it cannot navigate to a tabBar page.
    Notes:
    JSSDK Routes APIs are consistent with the mini program Routes APIs.However, it cannot trigger the success/fail/complete callback functions.
    Example:
    JAVASCRIPT
    wx.miniProgram.navigateTo({url: '/path/to/page'})
    wx.miniProgram.navigateBack({delta: 1})
    wx.miniProgram.switchTab({url: '/path/to/page'})
    wx.miniProgram.reLaunch({url: '/path/to/page'})
    wx.miniProgram.redirectTo({url: '/path/to/page'})

    Navigation

    API
    Description
    wx.navigateToMiniProgram
    Opens another mini program.
    wx.exitMiniProgram
    Closes the current mini program.
    wx.navigateBackMiniProgram
    Returns to the previous mini program. This can only be called successfully when the current mini program is opened by another mini program.
    Notes:
    JSSDK navigation APIs are consistent with the mini program navigation APIs.
    Example:
    JAVASCRIPT
    wx.navigateToMiniProgram({
    appId: 'appId',
    envVersion: 'release',
    success: (res) => {
    console.log('navigateToMiniProgram success', res)
    },
    fail: (err) => {
    console.log('navigateToMiniProgram fail', err)
    }
    })
    
    wx.exitMiniProgram({
    success: (res) => {
    console.log('exitMiniProgram success', res)
    },
    fail: (err) => {
    console.log('exitMiniProgram fail', err)
    }
    })
    
    wx.navigateBackMiniProgram({
    success: (res) => {
    console.log('navigateBackMiniProgram success', res)
    },
    fail: (err) => {
    console.log('navigateBackMiniProgram fail', err)
    }
    })

    Navigation bar

    API
    Description
    wx.setNavigationBarTitle
    Dynamically sets the title of the navigation bar for the current page.
    Notes:
    JSSDK navigation bar APIs are consistent with the mini program navigation bar APIs.
    Example:
    JAVASCRIPT
    wx.setNavigationBarTitle({
    title: 'TCMPP',
    success: (res) => {
    console.log('setNavigationBarTitle success', res)
    },
    fail: (err) => {
    console.log('setNavigationBarTitle fail', err)
    }
    })

    Data cache

    API
    Description
    wx.getStorage
    Asynchronously gets the content of the specified key from the local cache.
    wx.setStorage
    Stores the data to the specified key in the local cache, which will overwrite the original content associated with that key.
    wx.removeStorage
    Removes the specified key from the local cache.
    wx.clearStorage
    Clears the local data cache.
    wx.getStorageInfo
    Asynchronously gets the information of the current storage.
    Notes:
    JSSDK data cache APIs are consistent with the mini program cache APIs.
    Example:
    JAVASCRIPT
    wx.getStorage({
    key: 'name',
    success: (res) => {
    console.log('getStorage success', res)
    },
    fail: (err) => {
    console.log('getStorage fail', err)
    }
    })
    
    wx.setStorage({
    key: 'name',
    data: 'TCMPP',
    success: (res) => {
    console.log('setStorage success', res)
    },
    fail: (err) => {
    console.log('setStorage fail', err)
    }
    })
    
    wx.removeStorage({
    key: 'name',
    success: (res) => {
    console.log('removeStorage success', res)
    },
    fail: (err) => {
    console.log('removeStorage fail', err)
    }
    })
    
    wx.clearStorage({
    success: (res) => {
    console.log('clearStorage success', res)
    },
    fail: (err) => {
    console.log('clearStorage fail', err)
    }
    })
    wx.getStorageInfo({
    success: (res) => {
    console.log('getStorageInfo success', res)
    },
    fail: (err) => {
    console.log('getStorageInfo fail', err)
    }
    })

    Media

    Category
    Description
    API
    Image APIs
    Specifies to choose an image from the local album or take a photo.
    wx.chooseImage
    Previews an image in full screen mode on a new page.
    wx.previewImage
    Gets the Base64 local image (only supported on iOS).
    wx.getLocalImgData
    Recording APIs.
    Starts recording
    wx.startRecord
    Stops recording.
    wx.stopRecord
    Audio APIs
    Starts audio playback.
    wx.playVoice
    Pauses audio playback.
    wx.pauseVoice
    Stops audio playback.
    wx.stopVoice
    Notes:
    JSSDK media APIs are consistent with the mini program media APIs.
    Example:
    JAVASCRIPT
    wx.chooseImage({
    count: 2,
    sizeType: ['original', 'compressed'],
    sourceType: ['album', 'camera'],
    success: (res) => {
    console.log('chooseImage success', res)
    const imagePaths = res.tempFilePaths
    wx.previewImage({
    urls: imagePaths,
    success: (res) => {
    console.log('previewImage success', res)
    },
    fail: (err) => {
    console.log('previewImage fail', err)
    }
    })
    wx.getLocalImgData({
    filePath: imagePaths[0],
    success: (res) => {
    console.log('getLocalImgData success', res)
    },
    fail: (err) => {
    console.log('getLocalImgData fail', err)
    }
    })
    },
    fail: (err) => {
    console.log('chooseImage fail', err)
    }
    })
    
    wx.startRecord({
    success: (res) => {
    console.log('startRecord success', res)
    const recordFilePath = res.tempFilePath
    wx.playVoice({
    filePath: recordFilePath,
    success: (res) => {
    console.log('playVoice success', res)
    },
    fail: (err) => {
    console.log('playVoice fail', err)
    }
    })
    },
    fail: (err) => {
    console.log('startRecord fail', err)
    }
    })
    wx.stopRecord({
    success: (res) => {
    console.log('stopRecord success', res)
    },
    fail: (err) => {
    console.log('stopRecord fail', err)
    }
    })
    
    wx.pauseVoice({
    success: (res) => {
    console.log('pauseVoice success', res)
    },
    fail: (err) => {
    console.log('pauseVoice fail', err)
    }
    })
    wx.stopVoice({
    success: (res) => {
    console.log('stopVoice success', res)
    },
    fail: (err) => {
    console.log('stopVoice fail', err)
    }
    })

    Location

    API
    Description
    wx.getLocation
    Gets current location info.
    wx.openLocation
    Views location using the app's built-in map.
    wx.chooseLocation
    Opens the map and selects a location.
    Notes:
    JSSDK location APIs are consistent with the mini program location APIs.
    Example:
    JAVASCRIPT
    wx.getLocation({
    success: (res) => {
    console.log('getLocation success', res)
    const latitude = res.latitude
    const longitude = res.longitude
    wx.openLocation({
    latitude,
    longitude,
    success: (res) => {
    console.log('openLocation success', res)
    },
    fail: (err) => {
    console.log('openLocation fail', err)
    }
    })
    wx.chooseLocation({
    latitude,
    longitude,
    success: (res) => {
    console.log('chooseLocation success', res)
    },
    fail: (err) => {
    console.log('chooseLocation fail', err)
    }
    })
    fail: (err) => {
    console.log('getLocation fail', err)
    }
    })

    Document

    API
    Description
    wx.openDocument
    Opens the document (supports only PDF on Android, and supports the file types opened by the system's WKWebView on iOS).
    Notes:
    JSSDK document APIs are consistent with the Mini program document APIs.
    filePath only supports local file paths, such as those obtained using wx.downloadFile.
    Example:
    JAVASCRIPT
    wx.openDocument({
    filePath: '/path/to/file',
    success: (res) => {
    console.log('openDocument success', res)
    },
    fail: (err) => {
    console.log('openDocument fail', err)
    }
    })

    Device

    API
    Description
    wx.scanCode
    Opens the client's image that has the QR code for scanning.
    wx.getNetworkType
    Gets the network type.
    Notes:
    JSSDK device APIs are consistent with the mini program device APIs.
    Example:
    JAVASCRIPT
    wx.scanCode({
    success: (res) => {
    console.log('scanCode success', res)
    },
    fail: (err) => {
    console.log('scanCode fail', err)
    }
    })
    
    wx.getNetworkType({
    success: (res) => {
    console.log('getNetworkType success', res)
    },
    fail: (err) => {
    console.log('getNetworkType fail', err)
    }
    })

    Communication

    API
    Description
    wx.miniProgram.postMessage
    Sends a message to the mini program. This will trigger the web-view component's message event during back navigation, component destruction, or sharing.
    wx.miniProgram.onWebviewEvent
    Registers a listener to receive message events sent from the mini program to the H5 page.
    wx.miniProgram.offWebviewEvent
    Removes the listener to stop receiving message events sent from the mini program to the H5 page.
    wx.miniProgram.sendWebviewEvent
    Sends a message to the mini program, triggering the web-view component's event.

    H5 page sends a message event to the mini program.

    H5 JAVASCRIPT
    WXML
    JAVASCRIPT
    // H5 javascript
    wx.miniProgram.postMessage({ data: {name: 'TCMPP'} })
    
    wx.miniProgram.sendWebviewEvent({ data: {message: 'Hi TCMPP'} })
    <!-- Mini program /pages/index/index.wxml -->
    <web-view src="https://xxx.xxx" bindmessage="onMessage" bindevent="onEvent"></web-view>
    Page({
    onMessage(e) {
    console.log(e.detail.data) // [{"name":"TCMPP"}]
    },
    onEvent(e) {
    console.log(e.detail.data) // {"message":"Hi TCMPP"}
    }
    })

    Mini program sends message event to H5 page.

    JAVASCRIPT
    H5 JAVASCRIPT
    wx.sendWebviewEvent({
    message: "I'm Miniprogram, I received"
    })
    function onEvent(e) {
    console.log(e.message) // I'm Miniprogram, I received
    }
    // Register a listener
    wx.miniProgram.onWebviewEvent(onEvent)
    // Remove the listener
    wx.miniProgram.offWebviewEvent(onEvent)

    Others

    API
    Description
    wx.miniProgram.getEnv
    Gets the current environment.
    wx.canGoBack
    Checks if the current H5 page can navigate back to the previous page.
    wx.checkJsApi
    Determines if the current client version supports a specified JS API.
    wx.invokeNativePlugin
    Calls custom APIs within an H5 page.

    Gets the current environment.

    There are three methods to determine if the H5 page is embedded within the mini program's web-view component:
    Use wx.miniProgram.getEnv
    // H5 javascript
    wx.miniProgram.getEnv((res) => {
    console.log(res.miniprogram) // true
    })
    Use window.__wxjs_environment Invoke it within the callback of WeixinJSBridgeReady event.
    Example:
    // H5 javascript
    function ready() {
    console.log(window.__wxjs_environment === 'miniprogram') // true
    }
    if (!window.WeixinJSBridge || !WeixinJSBridge.invoke) {
    document.addEventListener('WeixinJSBridgeReady', ready, false)
    } else {
    ready()
    }
    Check if the userAgent string contains the keyword miniProgram.
    Example:
    // H5 javascript
    // "Mozilla/...... miniProgram TMA/mp6iu47n4rps6zwz": Contains miniProgram and the AppID(Mini Program ID).
    console.log(window.navigator.userAgent);

    Gets the web-view URL.

    Gets the current web-view URL when users share. This can be done by returning the webViewUrl parameter in the onShareAppMessage call back.webViewUrl
    Example:
    // Mini program javascript
    Page({
    onShareAppMessage(options) {
    console.log(options.webViewUrl)
    }
    })

    Determines if the H5 page can navigate back.

    This involves checking for a boolean value that indicates whether there is a previous page or state in the current navigation stack that can be returned to.
    Example:
    // H5 javascript
    wx.canGoBack({
    success: (res) => {
    console.log('canGoBack success', res.canGoBack) // true/false
    },
    fail: (err) => {
    console.log('canGoBack fail', err)
    }
    })

    Gets client version info about the JS API support.

    Determines if the current client version supports a specified JS API.
    Example:
    // H5 javascript
    wx.checkJsApi({
    jsApiList: ['chooseImage'],
    success: (res) => {
    // Return as a key-value pair, true for available APIs and false for unavailable APIs.
    // For example: {"checkResult":{"chooseImage":true},"errMsg":"checkJsApi:ok"}
    console.log('checkJsApi success', res)
    },
    fail: (err) => {
    console.log('checkJsApi fail', err)
    }
    })

    Calls custom APIs.

    Calls custom APIs within an H5 page.
    Example:
    // H5 javascript
    invokeNativePlugin() {
    let opts = {
    api_name: 'customApiName', // Custom API name
    data: JSON.parse(this.apiData || '{}'), // API request parameters
    success: (res) => {
    console.log('invokeNativePlugin success', res)
    },
    fail: (err) => {
    console.log('invokeNativePlugin fail', err)
    }
    }
    wx.invokeNativePlugin(opts); // Call custom APIs
    }
    
    
    Contact Us

    Contact our sales team or business advisors to help your business.

    Technical Support

    Open a ticket if you're looking for further assistance. Our Ticket is 7x24 avaliable.

    7x24 Phone Support