直接說原因：微信開發者工具不能讓其顯示按鈕！ 請部署到服務器，直接使用手機測試！
請部署到服務器，直接使用手機測試！
請部署到服務器，直接使用手機測試！
請部署到服務器，直接使用手機測試！
重要的坑說三遍！
附上demo源碼 大家可以直接參考
在開發工具里可以測試簽名是否成功，成功后再到手機上測試查看按鈕是否顯示
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>跳轉小程序</title>
</head>
<script src="https://res.wx.qq.com/open/js/jweixin-1.6.0.js"></script>
<body>
<div>為啥按鈕不顯示？</div>
<div>
<wx-open-launch-weapp
id="launch-btn"
username="gh_xxxxxxxx"
path="/pages/index/index.html"
>
<template>
<style>
.btn {
padding: 12px;
width: 100%;
height: 50px;
}
</style>
<button class="btn">打開小程序</button>
</template>
</wx-open-launch-weapp>
</div>
<script>
// 封裝 ajax
const getSdkPromission= () => {
return new Promise((resolve, reject) => {
var data = "";
var xhr = new XMLHttpRequest();
xhr.withCredentials = false;
xhr.addEventListener("readystatechange", function() {
if (this.readyState === 4) {
resolve(JSON.parse(this.responseText));
}
});
xhr.open(
"GET",
"/wx/sdk?url=" + window.location.href.split("#")[0]
);
xhr.setRequestHeader("Accept", "application/json");
xhr.send(data);
});
};
window.onload = function() {
console.log("onload");
getSdkPromission().then(res => {
const conf = {
appId: "wx124b9xxxxxxxxx74",
debug: true,
nonceStr: res.noncestr,
signature: res.signature,
timestamp: res.timestamp,
jsApiList: ["getLocation"],
openTagList: ["wx-open-launch-weapp"] //必須必須要不調用小程序標簽渲染不出來
};
wx.config(conf);
//=== 獲取 config 的參數以及簽名=== end
wx.ready(function() {
// config信息驗證后會執行ready方法，所有接口調用都必須在config接口獲得結果之后，config是一個客戶端的異步操作，所以如果需要在頁面加載時就調用相關接口，則須把相關接口放在ready函數中調用來確保正確執行。對於用戶觸發時才調用的接口，則可以直接調用，不需要放在ready函數中
console.log("wx ready");
});
wx.error(function(res) {
// config信息驗證后會執行ready方法，所有接口調用都必須在config接口獲得結果之后，config是一個客戶端的異步操作，所以如果需要在頁面加載時就調用相關接口，則須把相關接口放在ready函數中調用來確保正確執行。對於用戶觸發時才調用的接口，則可以直接調用，不需要放在ready函數中
console.log("res", res);
});
var btn = document.getElementById("launch-btn");
btn.addEventListener("launch", function(e) {
console.log("success");
});
btn.addEventListener("error", function(e) {
console.log("fail", e.detail);
});
});
};
</script>
</body>
</html>
微信不講武德！微信sdk1.6, 簽名，腳本加載，我全防出去了，你就讓《微信開發工具》 來！騙！來！偷襲！我這個68歲的老同志！這好嗎？這不好，我勸這位年輕人好自為之，好好反思，以后不要再犯這樣的聰明，小聰明，武林要以和為貴，要講武德，不要搞窩里斗！
