Haina
/
Global-sales
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

perf: 上传的格式和大小限制

Browse Source
dev/chat
Lei OT 2 years ago
parent cdb840d819
commit 5321345043
3 changed files with 58 additions and 49 deletions
Show Stats Download Patch File Download Diff File

20
src/lib/msgUtils.js
Unescape Escape View File

@ -552,6 +552,26 @@ export const whatsappError = {
'131031': '[131031] 账户已锁定.',
};
export const whatsappSupportFileTypes = {
sticker: { types: ['image/webp'], size: 1024 * 100 },
photo: { types: ['image/jpeg', 'image/png'], size: 1024 * 1024 * 5 },
video: { types: ['video/mp4', 'video/3gp'], size: 1024 * 1024 * 16 },
document: {
types: [
'text/plain',
'application/pdf',
'application/vnd.ms-powerpoint',
'application/msword',
'application/vnd.ms-excel',
'application/vnd.openxmlformats-officedocument.wordprocessingml.document',
'application/vnd.openxmlformats-officedocument.presentationml.presentation',
'application/vnd.openxmlformats-officedocument.spreadsheetml.sheet',
],
size: 1024 * 1024 * 100,
},
audio: { types: ['audio/aac', 'audio/mp4', 'audio/mpeg', 'audio/amr', 'audio/ogg'], size: 1024 * 1024 * 16 },
};
/**
* 系统弹窗通知
*/

41
src/views/Conversations/Components/Input/MediaUpload.jsx
Unescape Escape View File

@ -1,48 +1,43 @@
import { Upload, Button, message, Tooltip } from 'antd';
import { App, Upload, Button, message, Tooltip } from 'antd';
import { useState } from 'react';
import { FileAddOutlined } from '@ant-design/icons';
import { v4 as uuid } from 'uuid';
import { API_HOST } from '@/config';
import useConversationStore from '@/stores/ConversationStore';
import { whatsappSupportFileTypes } from '@/lib/msgUtils';
import { isEmpty, } from '@/utils/utils';
// import useConversationStore from '@/stores/ConversationStore';
const aliOSSHost = `https://haina-sale-system.oss-cn-shenzhen.aliyuncs.com/WAMedia/`;
/**
* image
* ext: ani;bmp;gif;ico;jpe;jpeg;jpg;pcx;png;psd;tga;tif;tiff;wmf
*
* audio
* ext: aac;ac3;aif;aifc;aiff;au;cda;dts;fla;flac;it;m1a;m2a;m3u;m4a;mid;midi;mka;mod;mp2;mp3;mpa;ogg;ra;rmi;spc;rmi;snd;umx;voc;wav;wma;xm
*
* video
* ext: 3g2;3gp;3gp2;3gpp;amr;amv;asf;avi;bdmv;bik;d2v;divx;drc;dsa;dsm;dss;dsv;evo;f4v;flc;fli;flic;flv;hdmov;ifo;ivf;m1v;m2p;m2t;m2ts;m2v;m4b;m4p;m4v;mkv;mp2v;mp4;mp4v;mpe;mpeg;mpg;mpls;mpv2;mpv4;mov;mts;ogm;ogv;pss;pva;qt;ram;ratdvd;rm;rmm;rmvb;roq;rpm;smil;smk;swf;tp;tpr;ts;vob;vp6;webm;wm;wmp;wmv
*
*/
const fileTypesExt = {
sticker: ['webp'],
photo: ['jpeg', 'jpg', 'png'],
video: ['gif', 'mp4', '3gp'],
document: ['pdf', 'doc', 'docx', 'xls', 'xlsx', 'ppt', 'pptx', 'txt', 'csv'],
audio: ['aac', 'mp4', 'm4a', 'mp3', 'amr', 'ogg'],
};
const ImageUpload = ({ disabled, invokeUploadFileMessage, invokeSendUploadMessage }) => {
const { message: appMessage } = App.useApp();
// const setComplexMsg = useConversationStore(state => state.setComplexMsg);
// const complexMsg = useConversationStore(state => state.complexMsg);
const [fileObj, setFileObj] = useState();
const beforeUpload = async (file) => {
const fileTypeSupport = Object.keys(whatsappSupportFileTypes).find((msgType) => whatsappSupportFileTypes[msgType].types.includes(file.type));
if (isEmpty(fileTypeSupport)) {
appMessage.warning('不支持的粘贴内容');
return false;
}
const waFile = whatsappSupportFileTypes[fileTypeSupport];
if (file.size > waFile.size) {
appMessage.warning('超过大小限制');
return false;
}
// 使用 FileReader 读取文件对象
const reader = new FileReader();
const suffix = file.name.slice(file.name.lastIndexOf('.')+1);
const type = Object.keys(fileTypesExt).find((type) => fileTypesExt[type].includes(suffix));
const rename = Date.now() + '.' + suffix;
const dataUri = aliOSSHost + rename;
// 读取完毕后获取结果
reader.onload = (event) => {
const previewSrc = event.target.result;
const msgObj = {
type: type,
type: fileTypeSupport,
name: file.name,
// status: 'loading',
data: { uri: previewSrc, dataUri: dataUri, link: dataUri, width: '100%', height: 150, loading: 0.01 },
@ -66,7 +61,7 @@ const ImageUpload = ({ disabled, invokeUploadFileMessage, invokeSendUploadMessag
showUploadList: false,
beforeUpload,
maxCount: 1,
accept: 'audio/aac, audio/mp4, audio/mpeg, audio/amr, audio/ogg,image/jpeg, image/png,video/mp4, video/3gp,image/webp,text/plain, application/pdf, application/vnd.ms-powerpoint, application/msword, application/vnd.ms-excel, application/vnd.openxmlformats-officedocument.wordprocessingml.document, application/vnd.openxmlformats-officedocument.presentationml.presentation, application/vnd.openxmlformats-officedocument.spreadsheetml.sheet'
accept: Object.values(whatsappSupportFileTypes).reduce((r, c) => r.concat(c.types), []).join(',')
};
return (
<Upload

46
src/views/Conversations/Components/InputComposer.jsx
Unescape Escape View File

@ -17,9 +17,9 @@ import {
YoutubeOutlined,
AudioOutlined, PlayCircleOutlined, LoadingOutlined, CheckCircleOutlined, FileOutlined
} from '@ant-design/icons';
import { isEmpty, olog } from '@/utils/utils';
import { isEmpty, } from '@/utils/utils';
import { v4 as uuid } from 'uuid';
import { sentMsgTypeMapped } from '@/lib/msgUtils';
import { sentMsgTypeMapped, whatsappSupportFileTypes } from '@/lib/msgUtils';
import InputTemplate from './Input/Template';
import InputEmoji from './Input/Emoji';
import InputMediaUpload from './Input/MediaUpload';
@ -28,24 +28,6 @@ import ExpireTimeClock from './ExpireTimeClock';
import dayjs from 'dayjs';
const aliOSSHost = `https://haina-sale-system.oss-cn-shenzhen.aliyuncs.com/WAMedia/`;
/**
* image
* ext: ani;bmp;gif;ico;jpe;jpeg;jpg;pcx;png;psd;tga;tif;tiff;wmf
*
* audio
* ext: aac;ac3;aif;aifc;aiff;au;cda;dts;fla;flac;it;m1a;m2a;m3u;m4a;mid;midi;mka;mod;mp2;mp3;mpa;ogg;ra;rmi;spc;rmi;snd;umx;voc;wav;wma;xm
*
* video
* ext: 3g2;3gp;3gp2;3gpp;amr;amv;asf;avi;bdmv;bik;d2v;divx;drc;dsa;dsm;dss;dsv;evo;f4v;flc;fli;flic;flv;hdmov;ifo;ivf;m1v;m2p;m2t;m2ts;m2v;m4b;m4p;m4v;mkv;mp2v;mp4;mp4v;mpe;mpeg;mpg;mpls;mpv2;mpv4;mov;mts;ogm;ogv;pss;pva;qt;ram;ratdvd;rm;rmm;rmvb;roq;rpm;smil;smk;swf;tp;tpr;ts;vob;vp6;webm;wm;wmp;wmv
*
*/
const fileTypesExt = {
sticker: ['webp'],
photo: ['jpeg', 'jpg', 'png'],
video: ['gif', 'mp4', '3gp'],
document: ['pdf', 'doc', 'docx', 'xls', 'xlsx', 'ppt', 'pptx', 'txt', 'csv'],
audio: ['aac', 'mp4', 'm4a', 'mp3', 'amr', 'ogg'],
};
const InputComposer = ({ mobile }) => {
const userId = useAuthStore((state) => state.loginUser.userId);
@ -124,17 +106,26 @@ const InputComposer = ({ mobile }) => {
websocket.sendMessage({ ...contentToSend, opi_sn: userId, coli_sn: currentConversation.coli_sn });
};
const { message } = App.useApp();
const { message: appMessage } = App.useApp();
const [pastedUploading, setPastedUploading] = useState(false);
const readPasted = async (file, rename = false) => {
const readPasted = async (file) => {
const fileTypeSupport = Object.keys(whatsappSupportFileTypes).find((msgType) => whatsappSupportFileTypes[msgType].types.includes(file.type));
if (isEmpty(fileTypeSupport)) {
appMessage.warning('不支持的粘贴内容');
return false;
}
const waFile = whatsappSupportFileTypes[fileTypeSupport];
if (file.size > waFile.size) {
appMessage.warning('超过大小限制');
return false;
}
// 使用 FileReader 读取文件对象
const reader = new FileReader();
const suffix = file.name.slice(file.name.lastIndexOf('.') + 1);
const newName = `${uuid()}.${suffix}`; // rename ? `${uuid()}.${suffix}` : file.name;
const type = Object.keys(fileTypesExt).find((type) => fileTypesExt[type].includes(suffix));
const dataUri = aliOSSHost + newName;
const msgObj = {
type: type,
type: fileTypeSupport,
name: file.name,
uploadStatus: 'loading',
data: { dataUri: dataUri, link: dataUri, width: '100%', height: 150, loading: 0.01 },
@ -156,7 +147,7 @@ const InputComposer = ({ mobile }) => {
let tmpfile = null;
if (!items || items.length === 0) {
// 当前浏览器不支持本地
message.warning('当前浏览器不支持本地');
appMessage.warning('当前浏览器不支持本地');
return;
}
let isNotFile = true;
@ -173,11 +164,14 @@ const InputComposer = ({ mobile }) => {
return;
}
if (!tmpfile) {
message.warning('没有读取到粘贴内容');
appMessage.warning('没有读取到粘贴内容');
return;
}
const shouldRename = tmpfile.type.indexOf('image') !== -1;
const _tmpFile = await readPasted(tmpfile, shouldRename);
if (_tmpFile === false) {
return;
}
setComplexMsg(_tmpFile.msgData);
setPastedUploading(true);
const { file_url } = await postUploadFileItem(tmpfile, _tmpFile.newName);

Write Preview
Loading…
Cancel
Save