H5實現生成urlscheme並從H5跳轉到小程式

huaweichenai發表於2022-07-09
H5Scheme

在2022年之前，想要在H5開啟小程式只需要在平臺上設定urlscheme即可，但是自 2022 年 4 月 11 日起，URL Scheme有效期最長 30 天，不再支援永久有效的URL Scheme、不再區分短期有效URL Scheme與長期有效URL Scheme。若在微信外開啟，使用者可以在瀏覽器頁面點選進入小程式。每個獨立的URL Scheme被使用者訪問後，僅此使用者可以再次訪問並開啟對應小程式，其他使用者無法再次通過相同URL Scheme開啟該小程式。 在本次規則調整生效前已經生成的URL Scheme，如果有效期超過30天或長期會被降級為30天有效，只能被1個使用者訪問，開始時間從調整日期開始計算。【官方文件】

但是官方提供了動態獲取urlscheme方法

步驟如下：

  • 1：獲取access_token
  • 2：根據access_token獲取urlscheme

  • 3：根據urlscheme實現H5跳轉小程式

    具體實現

    1. 通用的呼叫介面方法
/**
 * curl
 */
public function httpRequest($url, $format = 'get', $data = null, $headerArray = []){
    //設定頭資訊
    $curl=curl_init();
    curl_setopt($curl, CURLOPT_URL, $url);
    curl_setopt($curl, CURLOPT_SSL_VERIFYPEER, FALSE);
    curl_setopt($curl, CURLOPT_SSL_VERIFYHOST, FALSE);
    if ($format == 'post') {
        //post傳值設定post傳參
        curl_setopt($curl, CURLOPT_POST, 1);
        if ($data) {
            $data  = json_encode($data);
            curl_setopt($curl, CURLOPT_POSTFIELDS, $data);
        }
    }
    curl_setopt($curl, CURLOPT_RETURNTRANSFER, 1);
    if ($headerArray) {
        curl_setopt($curl,CURLOPT_HTTPHEADER,$headerArray);
    }
    $data=json_decode(curl_exec($curl), true);
    curl_close($curl);
    //返回介面返回資料
    return $data;
}
2. 獲取access_token文件：【獲取access_token】
$appId = 'XXX';
$appsecret = 'XXX';
$data = $this->httpRequest(
    'https://api.weixin.qq.com/cgi-bin/token?grant_type=client_credential&appid='.$appId.'&secret='.$appsecret,
    'get',
    null,
    array("Content-type:application/json;","Accept:application/json")
);
$accessToken = isset($data['access_token']) ? $data['access_token'] : '';
3：根據access_token獲取urlscheme【獲取urlscheme】
$data = $this->httpRequest(
    'https://api.weixin.qq.com/wxa/generatescheme?access_token='.$accessToken,
    'post',
    [
        'jump_wxa' => [
            'path' => "/pages/index/index",//跳轉小程式地址
            'query' => ""//跳轉小程式額外引數
        ],
        'expire_type' => 0
    ]
);
$openlink = isset($data['openlink']) ? $data['openlink'] : '';
4：根據urlscheme跳轉小程式
<script type="text/javascript" src="https://res.wx.qq.com/open/js/jweixin-1.3.2.js"></script>
<script>
window.location.href = openlink;
</script>

相關文章