Table of Contents
2. Determine whether it is a Blob object
Home Backend Development PHP Tutorial Let's talk about the mutual conversion methods of Base64, Blob and File in PHP

Let's talk about the mutual conversion methods of Base64, Blob and File in PHP

Mar 16, 2023 pm 03:19 PM
front end

This article brings you relevant knowledge about php. It mainly talks about how Base64, Blob and File are converted to each other? Friends who are interested can take a look below. I hope it will be helpful to everyone.

Let's talk about the mutual conversion methods of Base64, Blob and File in PHP

Preface

When obtaining pictures, I encountered a situation where I needed to convert the format, so I recorded it and shared it.

Text

1. Basic introduction to the format

  • Base64

Base64 is one of the most common encoding methods for transmitting 8Bit bytecode on the Internet. Base64 is a method of representing binary data based on 64 printable characters Base64 Document Entry

For example

Lets talk about the mutual conversion methods of Base64, Blob and File in PHP

  • ##Blob

##Blob

object represents an immutable, raw data file-like object. Its data can be read in text or binary format, or converted into ReadableStream for data operations. Blob document entry

For example

Lets talk about the mutual conversion methods of Base64, Blob and File in PHP

##File
    # The
  • ##File (

  • File

) interface provides information about a file and allows JavaScript in web pages to access its contents. File document entryFor example

#I won’t introduce too much, mainly about how to convert.

Lets talk about the mutual conversion methods of Base64, Blob and File in PHP2. How to judge these three formats

1. Determine whether it is a Base64 string

// 判断是否为base64格式字符串
function isBase64(str) {
    //正则表达式判断
    var reg = /^\s*data:([a-z]+\/[a-z0-9-+.]+(;[a-z-]+=[a-z0-9-]+)?)?(;base64)?,([a-z0-9!$&',()*+;=\-._~:@\/?%\s]*?)\s*$/i;
    return reg.test(str) //返回 true or false
}
Copy after login

2. Determine whether it is a Blob object

console.log(data instanceof Blob)   //ture  or  false
Copy after login

3 .Determine whether it is a File object

console.log(data instanceof File && !data instanceof Blob)   //ture  or  false
Copy after login

PS:

Both Blob and File use instanceof to determine whether it is the corresponding type of data

One thing to note is that the File object is also a Blob object , because File inherits from Blob, the judgment logic can be defined by yourself
3. Conversion between formats

1. Convert Base64 to File

function dataURLtoFile(dataurl, filename) {
    var arr = dataurl.split(','),
        mime = arr[0].match(/:(.*?);/)[1],
        bstr = atob(arr[1]),
        n = bstr.length,
        u8arr = new Uint8Array(n);
    while (n--) {
        u8arr[n] = bstr.charCodeAt(n);
    }
    return new File([u8arr], filename, { type: mime });
}
Copy after login

You need to pass two parameters, the first is data, the second is a custom file name string

  • 2.Base64 conversion For Blob
function dataURLtoBlob(dataurl, filename) {
    var arr = dataurl.split(','),
        mime = arr[0].match(/:(.*?);/)[1],
        bstr = atob(arr[1]),
        n = bstr.length,
        u8arr = new Uint8Array(n);
    while (n--) {
        u8arr[n] = bstr.charCodeAt(n);
    }
    return new Blob([u8arr], { type: mime });
}
Copy after login

is basically the same as transferFile

, except for the last sentence
    return
  • 3.Blob to File
function blobToFile(blob) {
    return new File([blob], 'screenshot.png', { type: 'image/jpeg' })
}
Copy after login

Here and

Base64 to File
    are actually the
  • new File()

    method. , the second parameter above is passed in. It is fixed here. This parameter is not very important. You can modify the function by yourself. The methods have been provided, so you can use it directly. Recommended learning: "

    PHP Video Tutorial
  • "

The above is the detailed content of Let's talk about the mutual conversion methods of Base64, Blob and File in PHP. For more information, please follow other related articles on the PHP Chinese website!

Statement of this Website
The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn

Hot AI Tools

Undresser.AI Undress

Undresser.AI Undress

AI-powered app for creating realistic nude photos

AI Clothes Remover

AI Clothes Remover

Online AI tool for removing clothes from photos.

Undress AI Tool

Undress AI Tool

Undress images for free

Clothoff.io

Clothoff.io

AI clothes remover

Video Face Swap

Video Face Swap

Swap faces in any video effortlessly with our completely free AI face swap tool!

Hot Article

Roblox: Bubble Gum Simulator Infinity - How To Get And Use Royal Keys
3 weeks ago By 尊渡假赌尊渡假赌尊渡假赌
Nordhold: Fusion System, Explained
3 weeks ago By 尊渡假赌尊渡假赌尊渡假赌
Mandragora: Whispers Of The Witch Tree - How To Unlock The Grappling Hook
3 weeks ago By 尊渡假赌尊渡假赌尊渡假赌

Hot Tools

Notepad++7.3.1

Notepad++7.3.1

Easy-to-use and free code editor

SublimeText3 Chinese version

SublimeText3 Chinese version

Chinese version, very easy to use

Zend Studio 13.0.1

Zend Studio 13.0.1

Powerful PHP integrated development environment

Dreamweaver CS6

Dreamweaver CS6

Visual web development tools

SublimeText3 Mac version

SublimeText3 Mac version

God-level code editing software (SublimeText3)

Hot Topics

Java Tutorial
1667
14
PHP Tutorial
1273
29
C# Tutorial
1255
24
An article about memory control in Node An article about memory control in Node Apr 26, 2023 pm 05:37 PM

The Node service built based on non-blocking and event-driven has the advantage of low memory consumption and is very suitable for handling massive network requests. Under the premise of massive requests, issues related to "memory control" need to be considered. 1. V8’s garbage collection mechanism and memory limitations Js is controlled by the garbage collection machine

Explore how to write unit tests in Vue3 Explore how to write unit tests in Vue3 Apr 25, 2023 pm 07:41 PM

Vue.js has become a very popular framework in front-end development today. As Vue.js continues to evolve, unit testing is becoming more and more important. Today we’ll explore how to write unit tests in Vue.js 3 and provide some best practices and common problems and solutions.

Let's talk in depth about the File module in Node Let's talk in depth about the File module in Node Apr 24, 2023 pm 05:49 PM

The file module is an encapsulation of underlying file operations, such as file reading/writing/opening/closing/delete adding, etc. The biggest feature of the file module is that all methods provide two versions of **synchronous** and **asynchronous**, with Methods with the sync suffix are all synchronization methods, and those without are all heterogeneous methods.

How to solve cross-domain issues? A brief analysis of common solutions How to solve cross-domain issues? A brief analysis of common solutions Apr 25, 2023 pm 07:57 PM

Cross-domain is a scenario often encountered in development, and it is also an issue often discussed in interviews. Mastering common cross-domain solutions and the principles behind them can not only improve our development efficiency, but also perform better in interviews.

PHP and Vue: a perfect pairing of front-end development tools PHP and Vue: a perfect pairing of front-end development tools Mar 16, 2024 pm 12:09 PM

PHP and Vue: a perfect pairing of front-end development tools. In today's era of rapid development of the Internet, front-end development has become increasingly important. As users have higher and higher requirements for the experience of websites and applications, front-end developers need to use more efficient and flexible tools to create responsive and interactive interfaces. As two important technologies in the field of front-end development, PHP and Vue.js can be regarded as perfect tools when paired together. This article will explore the combination of PHP and Vue, as well as detailed code examples to help readers better understand and apply these two

Learn more about Buffers in Node Learn more about Buffers in Node Apr 25, 2023 pm 07:49 PM

At the beginning, JS only ran on the browser side. It was easy to process Unicode-encoded strings, but it was difficult to process binary and non-Unicode-encoded strings. And binary is the lowest level data format of the computer, video/audio/program/network package

Is Django front-end or back-end? check it out! Is Django front-end or back-end? check it out! Jan 19, 2024 am 08:37 AM

Django is a web application framework written in Python that emphasizes rapid development and clean methods. Although Django is a web framework, to answer the question whether Django is a front-end or a back-end, you need to have a deep understanding of the concepts of front-end and back-end. The front end refers to the interface that users directly interact with, and the back end refers to server-side programs. They interact with data through the HTTP protocol. When the front-end and back-end are separated, the front-end and back-end programs can be developed independently to implement business logic and interactive effects respectively, and data exchange.

Exploring Go language front-end technology: a new vision for front-end development Exploring Go language front-end technology: a new vision for front-end development Mar 28, 2024 pm 01:06 PM

As a fast and efficient programming language, Go language is widely popular in the field of back-end development. However, few people associate Go language with front-end development. In fact, using Go language for front-end development can not only improve efficiency, but also bring new horizons to developers. This article will explore the possibility of using the Go language for front-end development and provide specific code examples to help readers better understand this area. In traditional front-end development, JavaScript, HTML, and CSS are often used to build user interfaces

See all articles