Tệp được tải lên mã hóa Base64 PHP

Question

Hàm base64_encode() là một hàm có sẵn trong PHP được sử dụng để chuyển đổi bất kỳ dữ liệu nào sang mã hóa base64. Để chuyển đổi hình ảnh thành mã hóa base64, trước tiên cần lấy nội dung của tệp. Điều này có thể được thực hiện với sự trợ giúp của hàm file_get_contents() của PHP. Sau đó chuyển dữ liệu thô này sang hàm base64_encode() để mã hóa

Nội dung chính Show

Mã hóa Base64 là gì?
ví dụ
Live Codesandbox Ví dụ
Làm cách nào để Tải lên Base64 với Tinh chỉnh?
Làm cách nào để tải lên base64 trong PHP?
Làm cách nào để giải mã base64 trong PHP?

Chức năng bắt buộc

Hàm base64_encode() Hàm base64_encode() là một hàm có sẵn trong PHP được sử dụng để Mã hóa dữ liệu với MIME base64. MIME (Tiện ích mở rộng thư Internet đa năng) base64 được sử dụng để mã hóa chuỗi trong base64. Dữ liệu base64_encoded chiếm thêm 33% dung lượng so với dữ liệu gốc
Hàm file_get_contents() Hàm file_get_contents() trong PHP là một hàm sẵn có được sử dụng để đọc một tệp thành một chuỗi. Chức năng này sử dụng các kỹ thuật ánh xạ bộ nhớ được máy chủ hỗ trợ và do đó nâng cao hiệu suất khiến nó trở thành một cách ưa thích để đọc nội dung của tệp

Hình ảnh đầu vào

Chương trình

// Get the image and convert into string

$img =

DOCTYPE html>
<html lang="en">
    <head>
        <meta charset="utf-8" />
        <meta name="viewport" content="width=device-width, initial-scale=1" />
        <link rel="stylesheet" href="./index.css" />
        <link
            href="https://cdn.jsdelivr.net/npm/[email protected]/dist/css/bootstrap.min.css"
            rel="stylesheet"
            integrity="sha384-EVSTQN3/azprG1Anm3QDgpJLIm9Nao0Yz1ztcQTwFspd3yD65VohhpuuCOmLASjC"
            crossorigin="anonymous"
        />
        <title>Base64 File Uploadtitle>
    head>

    <body>
        <div style="margin: 24px">
            <h2>Upload Imageh2>
        div>

        <script src="./index.js">script>
    body>
html>

0____11
DOCTYPE html>
<html lang="en">
    <head>
        <meta charset="utf-8" />
        <meta name="viewport" content="width=device-width, initial-scale=1" />
        <link rel="stylesheet" href="./index.css" />
        <link
            href="https://cdn.jsdelivr.net/npm/[email protected]/dist/css/bootstrap.min.css"
            rel="stylesheet"
            integrity="sha384-EVSTQN3/azprG1Anm3QDgpJLIm9Nao0Yz1ztcQTwFspd3yD65VohhpuuCOmLASjC"
            crossorigin="anonymous"
        />
        <title>Base64 File Uploadtitle>
    head>

    <body>
        <div style="margin: 24px">
            <h2>Upload Imageh2>
        div>

        <script src="./index.js">script>
    body>
html>
2____13



 
1
2 =4
DOCTYPE html>
<html lang="en">
    <head>
        <meta charset="utf-8" />
        <meta name="viewport" content="width=device-width, initial-scale=1" />
        <link rel="stylesheet" href="./index.css" />
        <link
            href="https://cdn.jsdelivr.net/npm/[email protected]/dist/css/bootstrap.min.css"
            rel="stylesheet"
            integrity="sha384-EVSTQN3/azprG1Anm3QDgpJLIm9Nao0Yz1ztcQTwFspd3yD65VohhpuuCOmLASjC"
            crossorigin="anonymous"
        />
        <title>Base64 File Uploadtitle>
    head>

    <body>
        <div style="margin: 24px">
            <h2>Upload Imageh2>
        div>

        <script src="./index.js">script>
    body>
html>
1$imgDOCTYPE html>
<html lang="en">
    <head>
        <meta charset="utf-8" />
        <meta name="viewport" content="width=device-width, initial-scale=1" />
        <link rel="stylesheet" href="./index.css" />
        <link
            href="https://cdn.jsdelivr.net/npm/[email protected]/dist/css/bootstrap.min.css"
            rel="stylesheet"
            integrity="sha384-EVSTQN3/azprG1Anm3QDgpJLIm9Nao0Yz1ztcQTwFspd3yD65VohhpuuCOmLASjC"
            crossorigin="anonymous"
        />
        <title>Base64 File Uploadtitle>
    head>

    <body>
        <div style="margin: 24px">
            <h2>Upload Imageh2>
        div>

        <script src="./index.js">script>
    body>
html>
3
 
9
 0 2 2
 3
đầu ra



iVBORw0KGgoAAAANSUhEUgAAApsAAAC4CAYAAACsNSfVAAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAAJ
cEhZcwAADsQAAA7EAZUrDhsAAAAZdEVYdFNvZnR3YXJdhfdsglgklAEFkb2JlIEltYWdlUmVhZHlxyWqwrwtwefd
...
TeUsalQKBQKhUKhsBvK2FQoFAqFQqFQ2A1lbCoUCoVCoVAo7IYyNhUKhUKhUCgUdkMZmwqFQKBQKO0H0fxpZ1bfc

Tài liệu tham khảo
http. //php. net/thủ công/vi/chức năng. mã hóa base64. php
http. //php. net/thủ công/vi/chức năng. tập tin lấy nội dung. php
PHP là ngôn ngữ kịch bản phía máy chủ được thiết kế dành riêng cho phát triển web. Bạn có thể học PHP từ đầu bằng cách làm theo Hướng dẫn PHP và Ví dụ về PHP này
 Tải tệp lên bằng cách sử dụng mã hóa Base64 là một phương pháp phổ biến. Trong hướng dẫn này, tôi sẽ chỉ cho bạn cách tải tệp lên bằng mã hóa base64
Mã hóa Base64 là gì?
DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="utf-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1" />
    <link rel="stylesheet" href="./index.css" />
    <link href="assets/css/bootstrap-responsive.css" rel="stylesheet" />
    <link
      href="https://cdn.jsdelivr.net/npm/[email protected]/dist/css/bootstrap.min.css"
      rel="stylesheet"
      integrity="sha384-EVSTQN3/azprG1Anm3QDgpJLIm9Nao0Yz1ztcQTwFspd3yD65VohhpuuCOmLASjC"
      crossorigin="anonymous"
    />

    <title>Base64 File Uploadtitle>
  head>
  <body>
    <div style="margin: 24px">
      <h2>Upload Imageh2>
    div>
    <div style="margin: 16px; padding: 16px">
      <input
        class="form-control form-control-lg"
        id="selectAvatar"
        type="file"
      />
    div>
html>
8 là kỹ thuật được sử dụng rộng rãi nhất để lưu trữ hoặc truyền dữ liệu nhị phân bằng cách chuyển đổi nó thành văn bản. Với kỹ thuật này, dữ liệu nhị phân, về cơ bản bao gồm các byte 8 bit, được chia thành các phần 6 bit (2^6 = 64). 64 số khác nhau được biểu thị bằng 6 bit được khớp với 64 ký tự khác nhau được biểu thị dưới dạng Ký tự có thể in trong bộ ký tự DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="utf-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1" />
    <link rel="stylesheet" href="./index.css" />
    <link href="assets/css/bootstrap-responsive.css" rel="stylesheet" />
    <link
      href="https://cdn.jsdelivr.net/npm/[email protected]/dist/css/bootstrap.min.css"
      rel="stylesheet"
      integrity="sha384-EVSTQN3/azprG1Anm3QDgpJLIm9Nao0Yz1ztcQTwFspd3yD65VohhpuuCOmLASjC"
      crossorigin="anonymous"
    />

    <title>Base64 File Uploadtitle>
  head>
  <body>
    <div style="margin: 24px">
      <h2>Upload Imageh2>
    div>
    <div style="margin: 16px; padding: 16px">
      <input
        class="form-control form-control-lg"
        id="selectAvatar"
        type="file"
      />
    div>
html>
9
Mã hóa Base64 được sử dụng phổ biến nhất để đính kèm các tệp nhị phân vào thư điện tử trong các ứng dụng của tiêu chuẩn MIME (Phần mở rộng thư Internet đa năng)
Một lĩnh vực sử dụng khác của Mã hóa Base64 là thêm hình ảnh và các tệp khác vào tài liệu HTML và CSS bằng cách mã hóa bằng Base64 bằng định dạng URL dữ liệu trong các trình duyệt hiện đại
ví dụ
Trong ví dụ của chúng tôi, chúng tôi sẽ tải lên tệp hình ảnh bằng cách mã hóa hình ảnh dưới dạng Base64. Trước tiên, hãy viết HTML đơn giản và đặt liên kết Bootstrap CSS
DOCTYPE html>
<html lang="en">
    <head>
        <meta charset="utf-8" />
        <meta name="viewport" content="width=device-width, initial-scale=1" />
        <link rel="stylesheet" href="./index.css" />
        <link
            href="https://cdn.jsdelivr.net/npm/[email protected]/dist/css/bootstrap.min.css"
            rel="stylesheet"
            integrity="sha384-EVSTQN3/azprG1Anm3QDgpJLIm9Nao0Yz1ztcQTwFspd3yD65VohhpuuCOmLASjC"
            crossorigin="anonymous"
        />
        <title>Base64 File Uploadtitle>
    head>

    <body>
        <div style="margin: 24px">
            <h2>Upload Imageh2>
        div>

        <script src="./index.js">script>
    body>
html>
Sau đó, chúng ta cần sử dụng thẻ đầu vào HTML để nhận tệp hình ảnh từ người dùng
Chúng tôi sẽ sử dụng 
DOCTYPE html>
<html lang="en">
    <head>
        <meta charset="utf-8" />
        <meta name="viewport" content="width=device-width, initial-scale=1" />
        <link rel="stylesheet" href="./index.css" />
        <link href="assets/css/bootstrap-responsive.css" rel="stylesheet" />
        <link
            href="https://cdn.jsdelivr.net/npm/[email protected]/dist/css/bootstrap.min.css"
            rel="stylesheet"
            integrity="sha384-EVSTQN3/azprG1Anm3QDgpJLIm9Nao0Yz1ztcQTwFspd3yD65VohhpuuCOmLASjC"
            crossorigin="anonymous"
        />

        <title>Base64 File Uploadtitle>
    head>
    <body>
        <div style="margin: 24px">
            <h2>Upload Imageh2>
        div>

        <div style="margin: 16px; padding: 16px">
            <input
                class="form-control form-control-lg"
                id="selectAvatar"
                type="file"
            />
        div>
        <div class="container">
            <div class="row">
                <div class="col">
                    <h6>Image Preview:h6>
                    <img class="img" id="avatar" />
                div>
                <div class="col">
                    <h6>Base64 Outputh6>
                    <textarea id="textArea" rows="30" cols="50">textarea>
                div>
            div>
        div>
        <script src="./index.js">script>
    body>
html>
0 vì nó phải là tệp loại đầu vào mà chúng tôi muốn nhận
DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="utf-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1" />
    <link rel="stylesheet" href="./index.css" />
    <link href="assets/css/bootstrap-responsive.css" rel="stylesheet" />
    <link
      href="https://cdn.jsdelivr.net/npm/[email protected]/dist/css/bootstrap.min.css"
      rel="stylesheet"
      integrity="sha384-EVSTQN3/azprG1Anm3QDgpJLIm9Nao0Yz1ztcQTwFspd3yD65VohhpuuCOmLASjC"
      crossorigin="anonymous"
    />

    <title>Base64 File Uploadtitle>
  head>
  <body>
    <div style="margin: 24px">
      <h2>Upload Imageh2>
    div>
    <div style="margin: 16px; padding: 16px">
      <input
        class="form-control form-control-lg"
        id="selectAvatar"
        type="file"
      />
    div>
html>
Bây giờ chúng tôi có một đầu vào để tương tác với người dùng và chọn một tệp. Hãy thêm các phần tử HTML sẽ hiển thị tệp hình ảnh và mã Base64 mà chúng tôi nhận được từ người dùng



DOCTYPE html>
<html lang="en">
    <head>
        <meta charset="utf-8" />
        <meta name="viewport" content="width=device-width, initial-scale=1" />
        <link rel="stylesheet" href="./index.css" />
        <link href="assets/css/bootstrap-responsive.css" rel="stylesheet" />
        <link
            href="https://cdn.jsdelivr.net/npm/[email protected]/dist/css/bootstrap.min.css"
            rel="stylesheet"
            integrity="sha384-EVSTQN3/azprG1Anm3QDgpJLIm9Nao0Yz1ztcQTwFspd3yD65VohhpuuCOmLASjC"
            crossorigin="anonymous"
        />

        <title>Base64 File Uploadtitle>
    head>
    <body>
        <div style="margin: 24px">
            <h2>Upload Imageh2>
        div>

        <div style="margin: 16px; padding: 16px">
            <input
                class="form-control form-control-lg"
                id="selectAvatar"
                type="file"
            />
        div>
        <div class="container">
            <div class="row">
                <div class="col">
                    <h6>Image Preview:h6>
                    <img class="img" id="avatar" />
                div>
                <div class="col">
                    <h6>Base64 Outputh6>
                    <textarea id="textArea" rows="30" cols="50">textarea>
                div>
            div>
        div>
        <script src="./index.js">script>
    body>
html>

Các trường của chúng tôi đã sẵn sàng để hiển thị tệp hình ảnh và mã Base64. Bây giờ, hãy thực hiện các thao tác của chúng tôi ở phía JavaScript
const input = document.getElementById("selectAvatar");
const avatar = document.getElementById("avatar");
const textArea = document.getElementById("textAreaExample");

const convertBase64 = (file) => {
    return new Promise((resolve, reject) => {
        const fileReader = new FileReader();
        fileReader.readAsDataURL(file);

        fileReader.onload = () => {
            resolve(fileReader.result);
        };

        fileReader.onerror = (error) => {
            reject(error);
        };
    });
};

const uploadImage = async (event) => {
    const file = event.target.files[0];
    const base64 = await convertBase64(file);
    avatar.src = base64;
    textArea.innerText = base64;
};

input.addEventListener("change", (e) => {
    uploadImage(e);
});
Ở đây chúng tôi lấy dữ liệu ở định dạng tệp và mã hóa thành Base64. Sau đó, chúng tôi hiển thị hình ảnh được mã hóa này và đầu ra mã hóa Base64

Live Codesandbox Ví dụ


Ứng dụng CRUD của bạn có cần quản lý trạng thái máy chủ không?
Làm quen với giải pháp dựa trên React không đầu để xây dựng các ứng dụng CRUD bóng bẩy. Với tính năng tinh chỉnh, bạn có thể yên tâm rằng cơ sở mã của mình sẽ luôn sạch sẽ và không có bản mẫu. 

Hãy thử tinh chỉnh để nhanh chóng xây dựng dự án CRUD tiếp theo của bạn, cho dù đó là bảng quản trị, trang tổng quan, công cụ nội bộ hay mặt tiền cửa hàng. 

Làm cách nào để Tải lên Base64 với Tinh chỉnh?
Quá trình upload file Base64 với tinh chỉnh rất đơn giản. Cách sử dụng được giải thích từng bước trong hướng dẫn và ví dụ
 
Làm cách nào để tải lên base64 trong PHP?
Cách tải base64 lên tệp trong PHP . 
  $base64string = '';
 $uploadpath = 'tải lên/hình ảnh/';
 $parts = phát nổ(";base64,", $base64string);
 $imageparts = phát nổ("hình ảnh/", @$parts[0]);
 $imagetype = $imageparts[1];
 $imagebase64 = base64_decode($parts[1]);
 $file = $uploadpath. uniqid(). '. png';
 
Làm cách nào để giải mã base64 trong PHP?
The base64_decode() là một hàm sẵn có trong PHP được sử dụng để Giải mã dữ liệu được mã hóa trong MIME base64. Thông số. Hàm này chấp nhận hai tham số như đã đề cập ở trên và được mô tả bên dưới. dữ liệu $. Đó là tham số bắt buộc chứa chuỗi được mã hóa. $ nghiêm ngặt. Nó là một tham số tùy chọn.

programming php

Tệp được tải lên mã hóa Base64 PHP

Mã hóa Base64 là gì?​

ví dụ​

Live Codesandbox Ví dụ

Làm cách nào để Tải lên Base64 với Tinh chỉnh?​

Làm cách nào để tải lên base64 trong PHP?

Làm cách nào để giải mã base64 trong PHP?

Bài Viết Liên Quan

Quảng Cáo

Có thể bạn quan tâm

Toplist được quan tâm

Quảng cáo

Xem Nhiều

Quảng cáo

Chúng tôi

Điều khoản

Trợ giúp

Mạng xã hội

Mã hóa Base64 là gì?

ví dụ

Làm cách nào để Tải lên Base64 với Tinh chỉnh?