H5 JSSDK微信支付和分享

2021-10-13 07:10:41 字數 1470 閱讀 3309

1、繫結網域名稱

2、引入js檔案

3、通過config介面注入許可權驗證配置

// vue

import wx from

'weixin-js-sdk'

;export

default},

create()

, methods:

else).

then

(res

=>})

}this

.wxconfig()

},wxready()

`,// 分享鏈結

imgurl:'',

// 分享})

;})}

,// 通過config介面注入許可權驗證配置

wxconfig()

).then

(res

=>);

wx.error

(function

(res))

;})}

,choosewxpay()

).then

(res

=>

,cancel:(

res)

=>

,fail

:function

(res)}

)}})

},// 靜默授權

snsapi_base()

,// 獲取 url 上的值

geturlparam

(paraname);

};return"";

}else}}

}<

/script>

4、踩過的坑

wx.config() 方法:

1、wx.config() 是介面許可權校驗的過程。分享、支付能否成功,全看 wx.config() 校驗是否通過;換句話說 呼叫 jssdk 所有 api 都需要許可權校驗否則無法執行

2、wx.config(),需要使用的js的列表 寫在 jsapilist陣列裡面

3、調式時記得開啟 debug 模式,可以看到 每個 jsapilist陣列裡面 寫的 js介面是否通過校驗了

4、呼叫後端分享 get 請求介面,建議不用用 」geturlparam()「 方法,這個方法會把state 也當作乙個引數解析,導致給後端的url 和 瀏覽器上的url 差乙個 state,這樣會直接導致自定義分享失敗

wx.ready()

1、wx.config() 許可權校驗是乙個非同步的過程,所以需要一進入頁面就需要呼叫 jssdk api ;可以放到 wx.ready() 裡面;這樣 wx.config() 校驗成功後就會立即執行 wx.ready()裡面的 api 了

自定義分享

1、分享裡面的 imgurl 記得用 .jpg格式的,最好不要超過100kb

2、link 分享鏈結 的網域名稱一定要和 位址列上的網域名稱一樣,不然自定義分享會失敗的;

3、link 分享鏈結可以拼寫需要帶的引數

ps:

微信jssdk分享筆記

注 由於jssdk授權介面的呼叫可能會影響本地介面的正常呼叫,如果頁面剛剛載入成功的時候需要向服務端請求其他資料介面,一定要讓資料介面呼叫完成後再呼叫拿jssdk授權配置資訊的介面。a 原生html頁面中使用script標籤引入以下檔案 b vue專案 安裝 npm install weixin j...

jssdk分享設定 微信分享 JSSDK的使用

分享功能的 一般會放在beforecreate或mounted鉤子中,如下 then else 分享成功觸發 cancel function 分享取消觸發,需要時可以呼叫 options object.assign defaults,options wx.ready function from ut...

微信jssdk實現分享到微信

可以看到我的賬號是訂閱號而且是未認證的 因為我專案中用的賬號是公司的號,我現在只是以我自己的號 簡單說一下。你自己需要的賬號是已經認證的 據說要花300元,好貴。然後看一下左邊選單的介面許可權裡面的分享介面是否已經授權了 同樣的我的是未獲得的 因為我是以我的為例子的 我實際上用的是公司的號不是我自己...