function urlToBase64(url) {
const img = new Image()
img.onload = function () {
const canvas = document.createElement('canvas')
const ctx = canvas.getContext('2d')
ctx.drawImage(this, 0, 0)
const base64 = canvas.toDataURL()
console.log("img.onload -> base64", base64) // base64
}
img.src = url
}
function urlToFile(url, fileName) {
const img = new Image()
img.onload = function () {
const canvas = document.createElement('canvas')
const ctx = canvas.getContext('2d')
ctx.drawImage(this, 0, 0)
canvas.toBlob(function (blob) {
blob.lastModifiedDate = new Date()
blob.name = fileName
console.log("img.onload -> blob", blob) // file
})
}
img.src = url
}
function fileToUrl(file) {
const objectURL = URL.createObjectURL(file)
console.log("fileToUrl -> objectURL", objectURL) // url
}
function base64ToFile(base64, fileName) {
var arr = base64.split(','),
mime = arr[0].match(/:(.*?);/)[1],
bstr = atob(arr[1]),
n = bstr.length,
u8arr = new Uint8Array(n);
while (n--) {
u8arr[n] = bstr.charCodeAt(n);
}
var blob = new Blob([u8arr], {
type: mime
});
blob.lastModifiedDate = new Date()
blob.name = fileName
console.log("functionbase64ToFile -> blob", blob) // file
}
function fileToBase64(file) {
console.log("file", file)
const read = new FileReader()
read.onload = function () {
console.log("read.onload -> this.result", this.result) // base64
}
read.readAsDataURL(file)
}
Recommended Today
PHP 12th week function learning record
sha1() effect sha1()Function to evaluate the value of a stringSHA-1Hash. usage sha1(string,raw) case <?php $str = “Hello”; echo sha1($str); ?> result f7ff9e8b7bb2e09b70935a5d785e0cc5d9d0abf0 sha1_file() effect sha1_file()Function calculation fileSHA-1Hash. usage sha1_file(file,raw) case <?php $filename = “test.txt”; $sha1file = sha1_file($filename); echo $sha1file; ?> result aaf4c61ddcc5e8a2dabede0f3b482cd9aea9434d similar_text() effect similar_text()Function to calculate the similarity between two strings. usage similar_text(string1,string2,percent) case […]- Practice of vivo microservice API gateway architecture
- Form data caching based on route parameters in react router
- React tutorial Chapter 14: Middleware in Redux advanced cross component communication
- Implement asynchronous process through ES6 generator function
- Api: tiktok: user merchandise window
- Performance test comparison of golang / goroutine and spool / coroutine
- node_ Patch modules
- I also upgraded my own online editor and added regular expression search and replacement function to it
- Introduction to springboot: 05 – introduction of data transport layer
- [self taught flutter series] building of flutter development environment