Algunos escenarios, como las imágenes obtenidas por lienzo o las imágenes devueltas por el SDK de desarrollo de WeChat, están en formato de datos: img. Necesitamos cargarlas en el servidor y luego convertirlas.
Convertir URL de datos a Blob
// convierte base64 a blobdataURItoBlob(dataURI) { // convierte el componente de datos base64/URLEncoded en datos binarios sin procesar contenidos en una cadena let byteString; if (dataURI.split(',')[0].indexOf('base64') > = 0) { byteString = atob(dataURI.split(',')[1] } else byteString = unescape(dataURI.split(',')[1]); // separa el componente mime const mimeString = dataURI .split(',')[0] .split(':')[1] .split(' ;')[0]; // escribe los bytes de la cadena en una matriz escrita const ia = new Uint8Array(byteString.length for (let i = 0; i <); byteString.length; i++) { ia[i] = byteString.charCodeAt(i } return new Blob([ia], { tipo: mimeString });},
Crear formulario de carga de formulario
const blob = dataURItoBlob(imgDataUrl); const formData = new FormData();// formData.append('auth', state.token.auth); opcionalmente, puede agregar alguna autenticación formData.append('file', blob); Para cargar datos, uso axiosconst params = {url: '/store/file', payload: formData }; this.upload(parámetros);
He encapsulado axios
exportar const upload = (params) => { const {url, carga útil } = params return axios.post(url, carga útil, { encabezados: { 'Tipo de contenido': 'multipart/form-data' } }).entonces( x => x.datos)}
Lo anterior es el contenido completo de este artículo. Espero que sea útil para el estudio de todos. También espero que todos apoyen VeVb Wulin Network.