First, make sure you have weixin-js-sdk installed.
If you have not installed npm install weixin-js-sdk
In the page
import wx from 'weixin-js-sdk';
Next, you need to perform () in mounted.
Since using WeChat js requires authorization configuration, you need to use ajax to request to obtain the authorization parameters of WeChat jssdk from the server. Ajax requests the axios I use here
({
method: 'post',
url: '//opcode/6002',
data:{ url:('#')[0] } //Provide authorization url parameters to the server, and do not need the part after #}).then((res)=>{
({
debug: true, // Turn on debug mode, appId: , // Required, the unique identification of the enterprise number. Fill in the enterprise number here corpid timestamp: , // Required to generate a signature time stamp nonceStr: , // Required to generate a random string of signatures signature: ,// Required, signature, see Appendix 1 jsApiList: ['scanQRCode'] // Required, a list of JS interfaces that need to be used, and the list of all JS interfaces is shown in Appendix 2 });
})
In this way, as long as the signature returned by the server is not wrong, the configuration can be successfully configured and you can use WeChat js.
It should be noted that after each url change, we need to re-authorize the WeChat jssdk. Although it is the same after every url is removed from #, this must be done, the WeChat mechanism.
There is another pitfall that needs to be paid attention to. When using the WeChat custom sharing function, when there is Chinese in the sharing link, you must encodeURIComponent(), otherwise you can successfully customize sharing on Android phones, but you cannot successfully share on iOS phones. After checking the information, I learned that the Android phone will automatically encode URIComponent, but ios will not.
The above is a detailed explanation and integration of using WeChat jssdk in vue introduced by the editor. I hope it will be helpful to everyone. If you have any questions, please leave me a message and the editor will reply to everyone in time. Thank you very much for your support for my website!