示例
页面代码
cpp
import { getQCodeUrl } from '@/utils/cosInstance';
import { PageContainer } from '@ant-design/pro-components';
import { Access, useAccess } from '@umijs/max';
import { Button, Image } from 'antd';
import { useState } from 'react';
const AccessPage: React.FC = () => {
const access = useAccess();
const [imgSrc, setImgSrc] = useState('')
return (
<PageContainer
ghost
header={{
title: '权限示例',
}}
>
<Access accessible={access.canSeeAdmin}>
<Button onClick={() => {
getQCodeUrl('wifi9090密码', '234r4444', (url:string) => {
console.log(url);
setImgSrc(url)
})
}}>只有 Admin 可以看到这个按钮</Button>
<Image src={imgSrc} height={60} width={60}/>
</Access>
</PageContainer>
);
};
export default AccessPage;
cos-js-sdk-v5
调用cos生成二维码接口,需要带上有效的签名
cpp
let COS = require('cos-js-sdk-v5');
const COS_DATA = {
Bucket: '', /* 存储桶,必须 */
Region: 'ap-shanghai', /* 存储桶所在地域,必须字段 */
SecretId: '',
SecretKey: '',
}
// SECRETID 和 SECRETKEY 请登录 https://console.cloud.tencent.com/cam/capi 进行查看和管理
let cos = new COS({
SecretId: COS_DATA.SecretId,
SecretKey: COS_DATA.SecretKey,
});
// 获取签名
export const getTempSign = (key: string) => {
let Authorization = COS.getAuthorization({
SecretId: COS_DATA.SecretId,
SecretKey: COS_DATA.SecretKey,
Method: 'get',
Key: key,
Expires: 60,
Query: {},
Headers: {},
});
return Authorization
}
export const getQCodeUrl = (key: string, text: string, cb: (url: string) => void) => {
const url = `https://${COS_DATA.Bucket}.cos.${COS_DATA.Region}.myqcloud.com`;
// const onlyKey = `qrcode/${Date.now()}/${key}`
cos.request({
Method: 'GET',
Key: '',
Url: url,
Query: {
'ci-process': 'qrcode-generate', /* 必须,对象存储处理能力,二维码生成参数为 qrcode-generate */
'qrcode-content': text, /* 必须,可识别的二维码文本信息 */
mode: 0, /* 非必须,生成的二维码类型,可选值:0或1。0为二维码,1为条形码,默认值为0 */
width: 200, /* 必须,指定生成的二维码或条形码的宽度,高度会进行等比压缩 */
},
Headers: {
Authorization: getTempSign('')
}
},
function (err:any, data:any) {
console.log('data---',data);
if (!err) {
// 获得二维码 base64
let imgBase64 = data.Response.ResultImage;
// 比如可拼接前缀直接展示在 img 里
// document.querySelector('#img').src = 'data:image/jpg;base64,' + imgBase64;
cb('data:image/jpg;base64,' + imgBase64)
}
});
}
export default cos