只能临时使用,线上还是要访问后端拿二维码
代码:
<template>
<view>
<form @submit="sendinfo">
<view class="uni-form-item uni-column">
<view class="title">页面路径</view>
<input class="uni-input" name="input" v-model="path" placeholder="pages/index/index" />
</view>
<view class="uni-form-item uni-column">
<view class="title">宽度</view>
<input class="uni-input" name="input" v-model="width" placeholder="二维码宽度" />
</view>
<view class="uni-btn-v">
<button form-type="submit">获取二维码</button>
</view>
</form>
<view style="text-align:center;">
<image v-if="codeimg" :src="codeimg" style="width:300rpx;height:300rpx;" @click="showimg" mode="widthFix">
</image>
</view>
</view>
</template>
<script>
export default {
data() {
return {
path: "pages/index/index", //""
width: 500,
codeimg: "",
}
},
onLoad() {
},
methods: {
sendinfo() {
if (!this.path) return uni.showToast({
title: "请输入路径",
icon: 'error'
});
if (uni.getStorageSync('access_token')) {
this.getcode();
} else
wx.request({
url: 'https://api.weixin.qq.com/cgi-bin/token',
method: "GET",
data: {
appid: '',
secret: '',
grant_type: 'client_credential'
},
success: res => {
console.log("huoqutoken", res)
uni.setStorageSync('access_token', res.data.access_token);
this.getcode();
}
})
},
getcode() {
let access_token = uni.getStorageSync('access_token');
wx.request({
url: 'https://api.weixin.qq.com/cgi-bin/wxaapp/createwxaqrcode?access_token=' + access_token, //
method: "POST",
responseType: "arrayBuffer",
data: {
"path": this.path,
"width": this.width
},
success: info => {
uni.showToast({
title: "获取成功"
});
// console.log("code",info.data)
const fileSystem = wx.getFileSystemManager();
const filePath = wx.env.USER_DATA_PATH + '/tempImage' + Date.now() + '.png'; // 临时文件路径
// 写入文件
fileSystem.writeFile({
filePath: filePath,
data: info.data, // 直接使用字节流 一定要写
encoding: 'binary',
success: (res) => {
console.error('文件保存:', res);
this.codeimg = filePath;
wx.saveImageToPhotosAlbum({
filePath: filePath
})
},
fail: (err) => {
console.error('文件保存失败:', err);
}
});
}
})
},
showimg() {
wx.previewImage({
current: this.codeimg, // 当前显示图片的http链接
urls: [this.codeimg] // 需要预览的图片http链接列表
})
},
}
}
</script>
<style scoped>
.uni-form-item {
display: flex;
border-bottom: 2rpx solid #eee;
margin: 10rpx 20rpx;
padding: 10rpx 0;
}
.uni-form-item .title {
width: 200rpx;
}
.uni-form-item .uni-input {
flex: 1;
}
.uni-btn-v {
width: 400rpx;
margin: 50rpx auto;
}
</style>