今天在写项目时，用到微信小程序授权获取openid的需求，然后在网上找了下，很快就写出来了，也获取到了openid（前提是要将微信开发工具--详情里面的不检验合法域名花√，这样才可以），然后代码如下（代码是在app.js里面写，进入项目时就执行）：
//app.js
App({
//onLaunch,onShow: options(path,query,scene,shareTicket,referrerInfo(appId,extraData))
onLaunch: function() {
// const { code } = await login();
wx.login({
success: function (res) {
var code = res.code;
if (res.code) {
//发起网络请求
wx.request({
url: `https://api.weixin.qq.com/sns/jscode2session?appid=小程序后台的appid&secret=小程序后台的secret&js_code=${code}&grant_type=authorization_code`,
success:function(response){
console.log('openid:' + response.data.openid);
},
})
} else {
console.log('获取用户登录态失败！' + res.errMsg)
}
}
});
},
onShow: function(options) {
},
onHide: function() {
},
onError: function(msg) {
},
//options(path,query,isEntryPage)
onPageNotFound: function(options) {
}
});
以上是已经实现了小程序获取openid的问题，要将api.weixin.qq.com添加到后台的安全域名中，发现不能行，果然心急吃不了热豆腐，是因为这种方式，很容易让有心之人拿到secret，不太友好，所以需要让后端通过接口来进行访问这个链接，将获取到的openid返回给前端，下面是通过后端拿到openid的代码，也需要在app.js中写
request目录下index.js文件内容：
// 同时发送异步代码的次数
let ajaxTimes=0;
export const request=(params)=>{
// 判断 url中是否带有 /my/ 请求的是私有的路径 带上header token
let header={...params.header};
if(params.url.includes("/my/")){
// 拼接header 带上token
header["Authorization"]=wx.getStorageSync("token");
}
ajaxTimes++;
// 显示加载中 效果
wx.showLoading({
title: "加载中",
mask: true
});
// 定义公共的url
const baseUrl="项目基本目录";
return new Promise((resolve,reject)=>{
wx.request({
...params,
header:header,
url:baseUrl+params.url,
success:(result)=>{
resolve(result.data);
},
fail:(err)=>{
reject(err);
},
complete:()=>{
ajaxTimes--;
if(ajaxTimes===0){
// 关闭正在等待的图标
wx.hideLoading();
}
}
});
})
}
第一种方法：可以直接拿到openid app.js文件中
import { request } from "./request/index.js";
//app.js
App({
//onLaunch,onShow: options(path,query,scene,shareTicket,referrerInfo(appId,extraData))
onLaunch: function() {
const _this = this
wx.login({
success: function (res) {
var code = res.code;
console.log(code)
_this.getOpenid(code)
}
});
},
async getOpenid (val) {
const getOpenidParams = {code: val}
// 3 发送请求 获取用户的openid
const res = await request({url:"/user/getXCXOpenid",data:getOpenidParams});
const openid = JSON.parse(res.data).openid
console.log('resp', JSON.parse(res.data).openid)
wx.setStorageSync("openid", openid);
},
onShow: function(options) {
},
onHide: function() {
},
onError: function(msg) {
},
//options(path,query,isEntryPage)
onPageNotFound: function(options) {
}
});
第二种方法：
util文件夹下asyncWx.js文件内容：
/**
* promise 形式 login
*/
export const login=()=>{
return new Promise((resolve,reject)=>{
wx.login({
timeout:10000,
success: (result) => {
resolve(result);
},
fail: (err) => {
reject(err);
}
});
})
}
import { request } from "./request/index.js";
import { login } from "./utils/asyncWx.js";
//app.js
App({
//onLaunch,onShow: options(path,query,scene,shareTicket,referrerInfo(appId,extraData))
onLaunch: function() {
this.getOpenid()
},
async getOpenid () {
const { code } = await login();
console.log('code:', code)
const getOpenidParams = {code: code}
const resp = request({url:"/user/getXCXOpenid",data:getOpenidParams});
console.log('resp', resp)
},
onShow: function(options) {
},
但是这种方法，返回的resp格式是以下这样，我还不清楚如何解析拿到openid，等我之后研究出来了，再编辑这篇文章
