Certains scénarios, tels que les images obtenues par Canvas ou les images renvoyées par le SDK de développement WeChat, sont au format data:img. Nous devons les télécharger sur le serveur, puis les convertir.
Convertir dataURL en Blob
// convertit base64 en blobdataURItoBlob(dataURI) { // convertit le composant de données base64/URLEncoded en données binaires brutes contenues dans une chaîne let byteString; if (dataURI.split(',')[0].indexOf('base64') > = 0) { byteString = atob(dataURI.split(',')[1] } else byteString = unescape(dataURI.split(',')[1]); // sépare le composant mime const mimeString = dataURI .split(',')[0] .split(':')[1] .split(' ;')[0]; // écrit les octets de la chaîne dans un tableau typé const ia = new Uint8Array(byteString.length); byteString.length; i++) { ia[i] = byteString.charCodeAt(i); } return new Blob([ia], { type: mimeString });},
Formulaire de téléchargement du formulaire de création
const blob = dataURItoBlob(imgDataUrl); const formData = new FormData();// formData.append('auth', state.token.auth); Vous pouvez éventuellement ajouter une authentification formData.append('file', blob ); Pour télécharger des données, j'utilise axiosconst params = { url: '/store/file', payload: formData }; this.upload(params);
J'ai encapsulé axios
export const upload = (params) => { const { url, payload } = params return axios.post(url, payload, { headers : { 'Content-Type': 'multipart/form-data' } }).then( x => x.données)}
Ce qui précède représente l’intégralité du contenu de cet article. J’espère qu’il sera utile à l’étude de chacun. J’espère également que tout le monde soutiendra le réseau VeVb Wulin.