目錄
二、如何判斷這三種格式
首頁 後端開發 php教程 聊聊PHP中Base64 、Blob與File的相互轉換方法

聊聊PHP中Base64 、Blob與File的相互轉換方法

Mar 16, 2023 pm 03:19 PM
前端

這篇文章為大家帶來了關於php的相關知識,其中主要跟大家聊一聊Base64 、Blob和File之間是怎麼相互轉換的?有興趣的朋友下面一起來看看吧,希望對大家有幫助。

聊聊PHP中Base64 、Blob與File的相互轉換方法

前言

在取得圖片時,遇到需要轉換格式的情況,所以記錄下來分享。

正文

一、格式的基本介紹

  • Base64

Base64是網路上最常見的傳送8Bit位元組碼的編碼方式之一,Base64就是一種基於64個可列印字元來表示二進位資料的方法 Base64文件入口

舉例

聊聊PHP中Base64 、Blob與File的相互轉換方法

  • #Blob

Blob 物件表示一個不可變、原始資料的類別檔案物件。它的資料可以按文字或二進位的格式進行讀取,也可以轉換成 ReadableStream來用於資料操作。 Blob文件入口

舉例範例

聊聊PHP中Base64 、Blob與File的相互轉換方法

  • File

檔案(File)介面提供有關檔案的信息,並允許網頁中的JavaScript 存取其內容。 File文檔入口
舉例

聊聊PHP中Base64 、Blob與File的相互轉換方法

#就不過多介紹了,主要來講如果轉換。

二、如何判斷這三種格式

1.判斷是否為Base64字串

// 判断是否为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
}
登入後複製

2.判斷是否為Blob物件

console.log(data instanceof Blob)   //ture  or  false
登入後複製

3 .判斷是否為File物件

console.log(data instanceof File && !data instanceof Blob)   //ture  or  false
登入後複製

PS:
Blob和File都用instanceof來判斷是否為對應類型資料
有一點需要注意,File物件也是Blob對象,因為File繼承於Blob,所以其中的判斷邏輯可以自己定義

三、格式之間的轉換

1.Base64轉換為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 });
}
登入後複製
  • 需要傳遞兩個參數,第一個是數據,第二個是自訂檔名字串

2.Base64轉換為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 });
}
登入後複製
  • 和轉File基本上一樣,就最後一句return不一樣

# #3.Blob轉File

function blobToFile(blob) {
    return new File([blob], 'screenshot.png', { type: 'image/jpeg' })
}
登入後複製
  • 這裡和

    Base64轉File其實用的都是new File()這個方法,上面的第二個參數是傳進來的,這裡是定死的,這個參數不是很重要,可以自行修改函數,方法都已經提供了,直接使用就可以。

推薦學習:《

PHP影片教學

#

以上是聊聊PHP中Base64 、Blob與File的相互轉換方法的詳細內容。更多資訊請關注PHP中文網其他相關文章!

本網站聲明
本文內容由網友自願投稿,版權歸原作者所有。本站不承擔相應的法律責任。如發現涉嫌抄襲或侵權的內容,請聯絡admin@php.cn

熱AI工具

Undresser.AI Undress

Undresser.AI Undress

人工智慧驅動的應用程序,用於創建逼真的裸體照片

AI Clothes Remover

AI Clothes Remover

用於從照片中去除衣服的線上人工智慧工具。

Undress AI Tool

Undress AI Tool

免費脫衣圖片

Clothoff.io

Clothoff.io

AI脫衣器

Video Face Swap

Video Face Swap

使用我們完全免費的人工智慧換臉工具,輕鬆在任何影片中換臉!

熱工具

記事本++7.3.1

記事本++7.3.1

好用且免費的程式碼編輯器

SublimeText3漢化版

SublimeText3漢化版

中文版,非常好用

禪工作室 13.0.1

禪工作室 13.0.1

強大的PHP整合開發環境

Dreamweaver CS6

Dreamweaver CS6

視覺化網頁開發工具

SublimeText3 Mac版

SublimeText3 Mac版

神級程式碼編輯軟體(SublimeText3)

一文聊聊Node中的記憶體控制 一文聊聊Node中的記憶體控制 Apr 26, 2023 pm 05:37 PM

基於無阻塞、事件驅動建立的Node服務,具有記憶體消耗低的優點,非常適合處理海量的網路請求。在海量請求的前提下,就需要考慮「記憶體控制」的相關問題了。 1. V8的垃圾回收機制與記憶體限制 Js由垃圾回收機

探討如何在Vue3中撰寫單元測試 探討如何在Vue3中撰寫單元測試 Apr 25, 2023 pm 07:41 PM

在當今前端開發中,Vue.js 已經成為了一個非常流行的框架。隨著 Vue.js 的不斷發展,單元測試變得越來越重要。今天,我們將探討如何在 Vue.js 3 中編寫單元測試,並提供一些最佳實踐和常見的問題及解決方案。

深入聊聊Node中的File模組 深入聊聊Node中的File模組 Apr 24, 2023 pm 05:49 PM

文件模組是對底層文件操作的封裝,例如文件讀寫/打開關閉/刪除添加等等文件模組最大的特點就是所有的方法都提供的**同步**和**異步**兩個版本,具有sync 字尾的方法都是同步方法,沒有的都是異

如何解決跨域?常見解決方案淺析 如何解決跨域?常見解決方案淺析 Apr 25, 2023 pm 07:57 PM

跨域是開發中常會遇到的場景,也是面試中常會討論的問題。掌握常見的跨域解決方案及其背後的原理,不僅可以提高我們的開發效率,還能在面試中表現的更加

PHP與Vue:完美搭檔的前端開發利器 PHP與Vue:完美搭檔的前端開發利器 Mar 16, 2024 pm 12:09 PM

PHP與Vue:完美搭檔的前端開發利器在當今網路快速發展的時代,前端開發變得愈發重要。隨著使用者對網站和應用的體驗要求越來越高,前端開發人員需要使用更有效率和靈活的工具來創建響應式和互動式的介面。 PHP和Vue.js作為前端開發領域的兩個重要技術,搭配起來可以稱得上是完美的利器。本文將探討PHP和Vue的結合,以及詳細的程式碼範例,幫助讀者更好地理解和應用這兩

深入了解Node中的Buffer 深入了解Node中的Buffer Apr 25, 2023 pm 07:49 PM

一開始的時候 JS 只在瀏覽器端運行,對於 Unicode 編碼的字串容易處理,但對於二進位和非 Unicode 編碼的字串處理困難。並且二進制是電腦最底層的資料格式,視訊/音訊/程式/網路包

如何使用 Go 語言進行前端開發? 如何使用 Go 語言進行前端開發? Jun 10, 2023 pm 05:00 PM

隨著網路技術的發展,前端開發變得日益重要。尤其是行動端設備的普及,更需要高效率、穩定、安全又易於維護的前端開發技術。而作為一門快速發展的程式語言,Go語言已經被越來越多的開發者所使用。那麼,使用Go語言進行前端開發行得通嗎?接下來,本文將為你詳細說明如何使用Go語言進行前端開發。先來看看為什麼要使用Go語言進行前端開發。很多人認為Go語言是一門

C#開發經驗分享:前端與後端協同開發技巧 C#開發經驗分享:前端與後端協同開發技巧 Nov 23, 2023 am 10:13 AM

身為C#開發者,我們的開發工作通常包括前端和後端的開發,而隨著技術的發展和專案的複雜性提高,前端與後端協同開發也變得越來越重要和複雜。本文將分享一些前端與後端協同開發的技巧,以幫助C#開發者更有效率地完成開發工作。確定好介面規範前後端的協同開發離不開API介面的交互。要確保前後端協同開發順利進行,最重要的是定義好介面規格。接口規範涉及到接口的命

See all articles