1.需要在微信開發(fā)者后臺(tái)申請(qǐng)注冊(cè)拿到appid和secret
2.用webview或者iframe嵌套微信官方提供的動(dòng)態(tài)獲取二維碼的路徑
const URL= https://open.weixin.qq.com/connect/qrconnect?appid=${你的appid}&response_type=code&scope=snsapi_login&lang=zh_CN&redirect_uri=${你掃碼成功之后需要重定向的路由頁(yè)面}&state=&login_type=jssdk&self_redirect=false&sizetype=1
3.iframe可以直接修改css樣式狗准，但是webview看不到dom節(jié)點(diǎn)無法直接修改樣式淤年，可通過
webview.insertCSS(`
.impowerBox {
height: 100px !important;
}
`)
4.如果你需要掃碼成功之后做處理，比如說redirect_uri不跳轉(zhuǎn)重定向路由頁(yè)面绍傲，我們可以通過webview的監(jiān)聽函數(shù)做處理
webview = document.getElementById('foo') as any
const [showWebview, setWebview] = useState(true)
webview.addEventListener('dom-ready', () => {
// 可插入css樣式修改原生的二維碼樣式
})
webview.addEventListener("did-start-loading", () => {
// 控制webview的顯隱峻汉，開始顯示悲立，stop的時(shí)候隱藏（有code不隱藏姑蓝，沒code才隱藏）
setWebview(false)
})
webview.addEventListener("did-stop-loading", () =>{
const code = parseURL(webview.src).params?.code
if (code) {
// code就是微信掃碼之后的唯一標(biāo)識(shí)code，可在微信提供的api拿這個(gè)code去獲取需要的用戶信息 accessToken openid unionId都能拿到
} else {
setWebview(true)
}
// parseURL 自己寫锅移，用來轉(zhuǎn)換webview.src的參數(shù)格式
})
// dom節(jié)點(diǎn)
{
!showWebview ? <Spin indicator={<LoadingOutlined style={{fontSize: 40}} spin />}></Spin> : null
}
<webview className={showWebview ? '' : 'hide '} id="foo" src={URL}> </webview>
