vue에서 weixin-js-sdk를 사용하는 흔한 사용 방법
3613 단어 vueweixin-js-sdk
1. 종속 패키지 가져오기
npm install weixin-js-sdk
2. 위챗 브라우저에서env.js
<script>
var ua = navigator.userAgent.toLowerCase();
var isWeixin = ua.indexOf('micromessenger') != -1;
var isAndroid = ua.indexOf('android') != -1;
var isIos = (ua.indexOf('iphone') != -1) || (ua.indexOf('ipad') != -1);
if(!isWeixin) {
document.head.innerHTML = '<title> , </title><meta charset="utf-8"><meta name="viewport" content="width=device-width, initial-scale=1, user-scalable=0"><link rel="stylesheet" type="text/css" href="https://res.wx.qq.com/open/libs/weui/0.4.1/weui.css" rel="external nofollow" >';
document.body.innerHTML = '<div class="weui_msg"><div class="weui_icon_area"><i class="weui_icon_info weui_icon_msg"></i></div><div class="weui_text_area"><h4 class="weui_msg_title"> </h4></div></div>';
}
메인js에서 참조:
import env from "./env";//
위챗 로그인, 코드를 통해 openid를 바꾸고 시작 페이지에서 이 방법을 사용합니다.
<script>
methods:{
//
wxLogin() {
var that = this;
axios
.get("/common/loginAuth")
.then(function(res) {
console.log(" ", res.data);
window.location.href = res.data;//
})
.catch(function(error) {});
},
//
postCode(res) {
var that = this;
axios
.post("/common/getUserInfo", {
code: res
})
.then(function(res) {
cookie.set("openid", res.data.openid);//code openid
})
.catch(function(error) {
console.log(error);
});
}},
created() {
var r = window.location.href;// ,
// , code, postCode() openid, wxLogin()
if (r.indexOf("?") != -1) {
r = r.split("?");
r = r[1].split("&");
r = r[0].split("=");
r = r[1];
} else {
this.wxLogin();
}
if (r) {
this.postCode(r);
} else {
this.wxLogin();
}
},
</script>
3. 프런트엔드 페이지 사용
import wx from 'weixin-js-sdk'
this.axios({
method: 'post',
url: 'url',
data:{ url:location.href.split('#')[0] } // url , #
}).then((res)=>{
wx.config({
debug: true, // ,
appId: res.appId, // , , corpid
timestamp: res.timestamp, // ,
nonceStr: res.nonceStr, // ,
signature: res.signature,// , , 1
jsApiList: ['scanQRCode'] // , JS , JS
});
})
vue에서 weixin-js-sdk를 사용하는 흔한 사용 방법에 대한 자세한 설명은 여기 있습니다. 더 많은 vue weixin-js-sdk 내용은 이전의 글을 검색하거나 아래의 관련 글을 계속 훑어보십시오. 앞으로 많은 응원 부탁드립니다!
이 내용에 흥미가 있습니까?
현재 기사가 여러분의 문제를 해결하지 못하는 경우 AI 엔진은 머신러닝 분석(스마트 모델이 방금 만들어져 부정확한 경우가 있을 수 있음)을 통해 가장 유사한 기사를 추천합니다:
Fastapi websocket 및 vue 3(Composition API)1부: FastAPI virtualenv 만들기(선택 사항) FastAPI 및 필요한 모든 것을 다음과 같이 설치하십시오. 생성main.py 파일 및 실행 - 브라우저에서 이 링크 열기http://127.0.0.1:...
텍스트를 자유롭게 공유하거나 복사할 수 있습니다.하지만 이 문서의 URL은 참조 URL로 남겨 두십시오.
CC BY-SA 2.5, CC BY-SA 3.0 및 CC BY-SA 4.0에 따라 라이센스가 부여됩니다.