PHP-Implementierung zum Hochladen des PC-Scancodes

Das Scannen und Hochladen von QR-Codes auf dem PC war in den letzten Jahren ein heißes Thema im Entwicklungsbereich. Es kann problemlos lokale Dateien auf den Server hochladen und verwendet das Scannen von QR-Codes, um die herkömmliche Upload-Methode zu ersetzen, was bequemer und effizienter ist . In diesem Artikel stellen wir vor, wie Sie mit PHP das Scannen und Hochladen auf dem PC implementieren.

Für das Scannen und Hochladen auf dem PC müssen wir zunächst einige Konzepte verstehen. Das erste ist das Prinzip der QR-Code-Generierung und des Scannens und das zweite ist die PHP-Technologie zur Implementierung des Datei-Uploads.

Prinzip der QR-Code-Generierung und des Scannens

QR-Code ist ein grafischer Code, der eine große Menge an Informationen speichern kann. Es kann in einer Vielzahl von Situationen verwendet werden, z. B. für Links, Text, Karten, Kontaktdaten und mehr. Es gibt viele Möglichkeiten, QR-Codes zu generieren. Die am häufigsten verwendete Methode ist die Verwendung des JavaScript-Frameworks QRCode.js. Durch dieses Framework können wir entsprechende QR-Codes aus Text, URL und anderen Informationen generieren.

Beim Scannen des QR-Codes können wir die Mobiltelefon-Scansoftware verwenden, um den QR-Code mit der Mobiltelefonkamera zu scannen und durch Scannen die durch den QR-Code dargestellten Informationen zu erhalten. Auf der PC-Seite können wir auch eine QR-Code-Scan-Software wie Zbar verwenden, um den QR-Code zu scannen.

PHP implementiert Datei-Upload-Technologie

PHP ist eine sehr beliebte serverseitige Skriptsprache und spielt eine wichtige Rolle im Bereich der Webentwicklung. Für das Hochladen von Dateien bietet PHP eine sehr praktische Datei-Upload-Klasse – Upload-Klasse.

Wenn wir die Upload-Klasse zum Implementieren des Datei-Uploads verwenden, müssen wir nur die Klasse instanziieren und die entsprechende Methode zum Hochladen der Datei verwenden. Zu den wichtigen Methoden gehören: upload(), getFileName(), getErrorMsg() usw.

PHP implementiert das Scannen und Hochladen von PC-Codes

Mit den oben genannten Grundkenntnissen können wir mit der Implementierung der Funktion zum Scannen und Hochladen von PC-Codes beginnen. Hier werden wir es in zwei Teile unterteilen, nämlich die Hintergrunddateiverarbeitung und die Front-End-Dateigenerierung.

Hintergrunddateiverarbeitung

1. Schnittstelle zum Hochladen von Dateien

Zuerst müssen wir eine Schnittstelle zum Hochladen von Dateien implementieren, die zur Verarbeitung des von der Rezeption übermittelten Dateistroms und der Dateiinformationen verwendet wird, die wir hochladen müssen. Für unterschiedliche Dateitypen und Dateigrößen müssen wir eine spezielle Verarbeitung durchführen, z. B. die Größe und Art der hochgeladenen Bilder begrenzen usw.

Codebeispiel:

<?php
header('Content-type: application/json');
$FILE_BASE = './files/';
$MAX_SIZE = 10 * 1024 * 1024;//10M
$ALLOW_FILE_SUFFIX = ['png', 'jpg', 'jpeg', 'bmp', 'gif'];//允许上传的文件类型
$max_size_POST = ini_get('post_max_size');
$max_size_UPLOAD = ini_get('upload_max_filesize');
$max_size = min($MAX_SIZE, getBytes($max_size_POST), getBytes($max_size_UPLOAD));

$filename = $_POST['filename'];

if (empty($filename)) {
    echo json_encode(['status' => 'error', 'msg' => 'filename is empty']);
    return;
}

if(empty($_FILES) || empty($_FILES['file'])){
    echo json_encode(['status' => 'error', 'msg' => 'file is empty']);
    return;
}

$file_size = $_FILES['file']['size'];

if($file_size > $max_size){
    echo json_encode(['status' => 'error', 'msg' => 'file size is too big']);
    return;
}

$file_type = strtolower(pathinfo($_FILES["file"]["name"], PATHINFO_EXTENSION));

if(!in_array($file_type, $ALLOW_FILE_SUFFIX)){
    echo json_encode(['status' => 'error', 'msg' => 'file type is not allowed']);
    return;
}

if(!is_dir($FILE_BASE)){
    mkdir($FILE_BASE, 0777, true);
}
$file_path = $FILE_BASE.$filename;
if(move_uploaded_file($_FILES["file"]["tmp_name"], $file_path)){
    echo json_encode(['status' => 'success', 'msg' => 'upload success']);
}else{
    echo json_encode(['status' => 'error', 'msg' => 'upload fail']);
}
function getBytes($val)
{
    $val = trim($val);
    $last = strtolower($val[strlen($val) - 1]);
    $val = preg_replace('/[^0-9]/', '', $val);
    switch ($last) {
        case 'g':
            $val *= 1024 * 1024 * 1024;
            break;
        case 'm':
            $val *= 1024 * 1024;
            break;
        case 'k':
            $val *= 1024;
            break;
    }
    return $val;
}
?>

2. QR-Code generieren

Das Generieren von QR-Code kann mit dem QRCode.js-Framework erreicht werden. Wir müssen den Dateinamen und die zugehörigen Informationen, die hochgeladen werden sollen, in QR-Code-Informationen umwandeln und dann den entsprechenden QR-Code generieren.

Codebeispiel:

<?php
$filename = $_POST['filename'];
$path = 'http://localhost/'; //服务器地址
$text = urlencode(json_encode(['filename' => $filename, 'path' => $path]));
$url = "http://qr.liantu.com/api.php?text=" . $text;
echo $url; //返回二维码地址
?>

Frontend-Dateigenerierung

Im Frontend müssen wir einen QR-Code generieren und ihn im Vorschaufeld rechts anzeigen. Darüber hinaus müssen wir auch Bedienschaltflächen und entsprechende Eingabeaufforderungen zum Hochladen von Dateien hinzufügen.

Codebeispiel:

<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <title>PC扫码上传</title>
    <style type="text/css">
        .upload {
            display: inline-block;
            background: #1B96F3;
            color: #fff;
            padding: 8px 12px;
            border-radius: 4px;
            cursor: pointer;
            outline: none;
        }

        .upload:hover {
            background-color: #2A87CB;
        }

        .img-preview {
            width: 200px;
            height: 200px;
            overflow: hidden;
            display: flex;
            justify-content: center;
            align-items: center;
        }

        .img-preview img {
            max-width: 100%;
            max-height: 100%;
            object-fit: contain;
        }
    </style>
</head>
<body>
    <div class="wrapper">
        <div class="qrcode-container">
            <div class="qrcode"></div>
        </div>
        <div class="upload-container">
            <input type="file" id="file" style="display:none" onchange="uploadFile(this)"/>
            <button class="upload" onclick="document.getElementById('file').click()">上传文件</button>
            <div class="alert"></div>
        </div>
        <div class="img-preview-container">
            <h4>预览</h4>
            <div class="img-preview"></div>
        </div>
    </div>

    <script src="https://cdn.bootcdn.net/ajax/libs/jquery/3.6.0/jquery.min.js"></script>
    <script src="https://cdn.bootcdn.net/ajax/libs/qrcodejs/1.0.0/qrcode.min.js"></script>
    <script type="text/javascript">
        function createQrcode(url) {
            var qrcode = new QRCode(document.querySelector('.qrcode'), {
                text: url,
                width: 200,
                height: 200,
                colorDark: "#000000",
                colorLight: "#ffffff",
                correctLevel: QRCode.CorrectLevel.H
            });
        }

        function showPreview(file) {
            var fr = new FileReader();
            fr.onload = function () {
                $('<img>').attr('src', fr.result).appendTo('.img-preview');
            }
            fr.readAsDataURL(file);
        }

        function uploadFile(obj) {
            var file = obj.files[0];
            var fd = new FormData();
            fd.append('file', file);
            fd.append('filename', file.name);
            $.ajax({
                url: '/upload.php',
                type: 'POST',
                data: fd,
                processData: false,
                contentType: false,
                success: function (data) {
                    if (data.status == 'success') {
                        createQrcode(data.msg);
                        showPreview(file);
                        $('.alert').text('上传成功');
                    } else {
                        $('.alert').text('上传失败');
                    }
                },
                error: function () {
                    $('.alert').text('上传失败');
                }
            });
        }
    </script>
</body>
</html>

Zusammenfassend haben wir die Entwicklung des PC-Scancode-Uploads erfolgreich abgeschlossen. In diesem Prozess lernten wir die Prinzipien der QR-Code-Generierung und des QR-Code-Scans sowie die Technologie des Datei-Uploads mit PHP kennen und kombinierten beide, um die Implementierung der PC-Code-Scan- und Upload-Funktion abzuschließen. Für Entwickler wird diese bequemere und effizientere Upload-Methode zu einem heißen Thema und einer hohen Nachfrage in der Entwicklung.

Das obige ist der detaillierte Inhalt vonPHP-Implementierung zum Hochladen des PC-Scancodes. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!