php+WebUploader-Bild-Batch-Upload
1. Webuploader
Webuploader wird hauptsächlich zum Hochladen von Dateien verwendet, unterstützt Batch-Upload und Bildvorschau, Bildvorschau besteht darin, Base64-Daten aus dem Bild zu generieren und diese direkt im -Tag zu verwenden. Der erzielbare Effekt besteht darin, dass Sie die Auswirkung des Hochladens des Bildes sehen können, bevor Sie es tatsächlich hochladen. Eine ausführlichere Einführung finden Sie auf der offiziellen Website von Webuploader. Ich bin immer der Meinung, dass das Lesen der offiziellen Website-Dokumente der direkteste Weg ist, etwas zu lernen. offizielle Webuploader-Website, Webuploader wird übrigens vom Baidu Fex Team-Team gepflegt.
2. Webuploader-Upload-Prinzip
1. PHP+HTML-Formular-Upload-Datei
Bevor Sie darüber sprechen, müssen Sie die Datei-Upload-Methode von PHP verstehen Uploads. Teil
Erstellen Sie zunächst das
<form>-Formular über HTML, fügen Sie das Datei-Upload-Tag von
<input type='file' name='xxx'>
in das Formular ein und klicken Sie Mit der Schaltfläche „Upload senden“ können Sie die Datei auf den Server hochladen.
Wenn die hochgeladene Datei den Server erreicht, wird sie in dem von PHP angegebenen temporären Ordner gespeichert. Mit der in PHP integrierten Funktion
move_uploaded_file()können Sie die temporäre Datei dorthin verschieben Mit diesem Vorgang können Sie die Datei im gewünschten Zielordner umbenennen, ihre Größe bestimmen und feststellen, ob sie die Bedingungen erfüllt. Auf diese Weise ist der Upload abgeschlossen.
Für einen vollständigen Fall zum Hochladen von PHP-Formularen können Sie diesen Artikel von w3school lesen, daher werde ich hier nicht auf Details eingehen. PHP+HTML-Formular-Upload-Datei
2. Webuploader-Upload-Prinzip
Die Verwendung von PHP+HTML-Formular-Upload kann die Datei-Upload-Arbeit abschließen, weist jedoch Mängel auf,
Beim Hochladen einer Datei müssen Sie die gesamte Seite einreichen, damit die Seite aktualisiert wird
Es gibt keine Möglichkeit, beim Hochladen eine Vorschau des Bildes anzuzeigen Daher wird manchmal das falsche Bild hochgeladen. Dies erfahren Sie erst, wenn Sie die Seite aktualisieren, nachdem das Bild tatsächlich hochgeladen wurde.
Webuploader nutzt die Ajax-Technologie zum Senden des Formulars. Es ist nicht erforderlich, die Seite beim Hochladen zu übermitteln und treffen Sie Entscheidungen auf der Seite Feedback und können Sie auch eine Bildvorschau durchführen. Die Verwendung des Webuploaders zum Hochladen von Bildern erfordert nur wenige Schritte:
Die Front-End-HTML-Seite konfiguriert den Webuploader
Die PHP-Seite des Hintergrundservers akzeptiert hochgeladene Bilder Bilder vom Webuploader verarbeiten.
Nach der Verarbeitung des Bildes im Hintergrund wird das Ergebnis der zurückgegebenen JSON-Daten an die Rezeption gesendet.
Die Rezeption erhält das JSON-Daten und gibt Feedback.
Hier ist zu beachten, dass der Hintergrund, in dem PHP Bilder empfängt und verarbeitet, im Grunde derselbe ist wie beim PHP+HTML-Formular-Upload.
3. Konfiguration und Nutzung des Webuploaders
Alle Konfigurationsparameter und Nutzungsmethoden finden Sie in den offiziellen Dokumenten. offizielle Webuploader-Website, es gibt einige Beispielfälle im Github-Repository des Webuploaders als Referenz. Beispiel
Meine Laufumgebung: php5.6+nginx+macOS
Das Verzeichnis meines Ordners
index .php
upload_img.php
mywebupload.js
webuploader/
Uploads/
1. Der Front-End-HTML-Seitenkonfigurations-Webupload
führt hauptsächlich die folgenden Schritte aus:
Stellen Sie die relevanten JS- und CSS-Pakete des Webuploaders vor
HTML-Tags erstellen
Erstellen Sie eine JS-Datei und initialisieren Sie den Webuploader ist die gesamte Seite Der Code und der Webuploader-Ordner wurden vollständig von Github verschoben, und dann habe ich auch JQuery verwendet, um das Seitenerlebnis zu verbessern.
index.html
<!doctype html> <html> <head> <meta charset="UTF-8"> <meta http-equiv="Content-Type" content="text/html;charset=UTF-8"> <title>WebUploader演示</title> <link rel="stylesheet" type="text/css" href="webuploader/css/webuploader.css" /> <link rel="stylesheet" type="text/css" href="https://cdn.jsdelivr.net/npm/bootstrap@3.3.7/dist/css/bootstrap.min.css" /> <link rel="shortcut icon" href="favicon.ico"> </head> <body> <div id="imgPicker">选择文件</div> <button class="btn btn-primary btn-upload">上传</button> <div></div> <div></div> <!--jquery 1.12--> <script src="https://cdn.jsdelivr.net/npm/jquery@1.12.4/dist/jquery.min.js"></script> <!--bootstrap核心js文件--> <script src="https://cdn.jsdelivr.net/npm/bootstrap@3.3.7/dist/js/bootstrap.min.js"></script> <!--webuploader js--> <!--<script type="text/javascript" src="static/jquery.js"></script>--> <script type="text/javascript" src="webuploader/dist/webuploader.min.js"></script> <script type="text/javascript" src="mywebupload.js"></script> </body> </html>
mywebupload.js
$(function(){
/*
* 配置webuploader
*/
var imgUploader = WebUploader.create({
fileVal: 'img', // 相当于input标签的name属性，用于后台PHP识别接收上传文件的field
swf: './webuploader/dist/Uploader.swf', // swf文件路径
server: './upload_img.php', // 文件接收服务端。
fileNumLimit: 10, // 上传文件的限制
pick: {
id : '#imgPicker', //
multiple : true // 是否支持多文件上传
},
// 只允许上传图片
accept: {
title: 'Only Images',
extensions: 'gif,jpg,jpeg,bmp,png',
mimeTypes: 'image/jpg,image/jpeg,image/png,image/gif,image/bmp'
},
auto: false, // 添加文件后是否自动上传上去，我设置了false，后面我会利用自己的上传按钮上传
resize: false // 不压缩image, 默认如果是jpeg，文件上传前会压缩一把再上传！
});
/*
* 设置上传按钮的单击事件
*/
$('.btn-upload').click(function(){
imgUploader.upload(); // webuploader内置的upload函数，启动webuploader的上传
});
/*
* 配置webuploader的事件监听
*/
// 当图片文件被添加到上传队列中
imgUploader.on('fileQueued', function (file) {
addImgThumb(file);
});
// 生产图片预览
function addImgThumb(file){
imgUploader.makeThumb(file, function(error, ret){
if(!error){
img = '<img alt="" src="' + ret + '" />';
$('.img-thumb').append(img);
}else{
console.log('making img error');
}
},1,1);
}
imgUploader.on('uploadSuccess'), function(file, response){
// response 是后台upload_img.php返回的数据
if(response.success){
$('.result').append('<p>' + file.name + '上传成功</p>')
}else{
$('.result').append('<p>' + response.message + '</p>')
}
});
})2. Die Hintergrund-PHP-Seite verarbeitet hochgeladene Dateien
Es gibt zwei Was hier zu beachten ist Punkte:
Der Dateiname der im Hintergrund verarbeiteten PHP-Datei muss derselbe sein wie bei der Konfiguration des Webuploaders.
Denken Sie daran, die Berechtigungen für den hochgeladenen Ordner festzulegen. Linux kann chmod verwenden, um die Ordnerberechtigungen zu ändern, andernfalls schlägt der Upload fehl.
Meine Handhabung hier ist relativ einfach. Wenn Sie Fragen haben, hinterlassen Sie mir bitte eine Nachricht.
upload_img.php
<?php
$field = 'img'; // 对应webupload里设置的fileVal
$savePath = './uploads/'; // 这里注意设置uploads文件夹的权限
$saveName = time() . uniqid() . '_' . $_FILES[$field]['name']; // 为文件重命名
$fullName = $savePath . $saveName;
if (file_exists($fullName)) {
$result = [
'success'=>false,
'message'=>'相同文件名的文件已经存在'
];
}else{
move_uploaded_file($_FILES[$field]["tmp_name"], $fullName);
$result = ['success'=>true, 'fullName'=>$fullName];
}
return json_encode($result); // 将结果打包成json格式返回
?>Das Obige ist der gesamte Inhalt von Webuploader. Weitere Informationen zur Konfiguration und zu Ereignissen des Webuploaders finden Sie auf der offiziellen Website von Webuploader. Ich hoffe, dass jeder weitere Nachrichten hinterlässt, um Kommentare und Korrekturen auszutauschen.
Weitere technische Artikel zum Thema PHP finden Sie in der Spalte PHP-Tutorial, um mehr darüber zu erfahren!
Das obige ist der detaillierte Inhalt vonphp+WebUploader-Bild-Batch-Upload. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!
Heiße KI -Werkzeuge
Undresser.AI Undress
KI-gestützte App zum Erstellen realistischer Aktfotos
AI Clothes Remover
Online-KI-Tool zum Entfernen von Kleidung aus Fotos.
Undress AI Tool
Ausziehbilder kostenlos
Clothoff.io
KI-Kleiderentferner
AI Hentai Generator
Erstellen Sie kostenlos Ai Hentai.
Heißer Artikel
Heiße Werkzeuge
Notepad++7.3.1
Einfach zu bedienender und kostenloser Code-Editor
SublimeText3 chinesische Version
Chinesische Version, sehr einfach zu bedienen
Senden Sie Studio 13.0.1
Leistungsstarke integrierte PHP-Entwicklungsumgebung
Dreamweaver CS6
Visuelle Webentwicklungstools
SublimeText3 Mac-Version
Codebearbeitungssoftware auf Gottesniveau (SublimeText3)
Heiße Themen
1379
52
PHP 8.4 Installations- und Upgrade-Anleitung für Ubuntu und Debian
Dec 24, 2024 pm 04:42 PM
PHP 8.4 bringt mehrere neue Funktionen, Sicherheitsverbesserungen und Leistungsverbesserungen mit einer beträchtlichen Menge an veralteten und entfernten Funktionen. In dieser Anleitung wird erklärt, wie Sie PHP 8.4 installieren oder auf PHP 8.4 auf Ubuntu, Debian oder deren Derivaten aktualisieren. Obwohl es möglich ist, PHP aus dem Quellcode zu kompilieren, ist die Installation aus einem APT-Repository wie unten erläutert oft schneller und sicherer, da diese Repositorys in Zukunft die neuesten Fehlerbehebungen und Sicherheitsupdates bereitstellen.
So richten Sie Visual Studio-Code (VS-Code) für die PHP-Entwicklung ein
Dec 20, 2024 am 11:31 AM
Visual Studio Code, auch bekannt als VS Code, ist ein kostenloser Quellcode-Editor – oder eine integrierte Entwicklungsumgebung (IDE) –, die für alle gängigen Betriebssysteme verfügbar ist. Mit einer großen Sammlung von Erweiterungen für viele Programmiersprachen kann VS Code c
7 PHP-Funktionen, die ich leider vorher nicht kannte
Nov 13, 2024 am 09:42 AM
Wenn Sie ein erfahrener PHP-Entwickler sind, haben Sie möglicherweise das Gefühl, dass Sie dort waren und dies bereits getan haben. Sie haben eine beträchtliche Anzahl von Anwendungen entwickelt, Millionen von Codezeilen debuggt und eine Reihe von Skripten optimiert, um op zu erreichen
Wie analysiert und verarbeitet man HTML/XML in PHP?
Feb 07, 2025 am 11:57 AM
Dieses Tutorial zeigt, wie XML -Dokumente mit PHP effizient verarbeitet werden. XML (Extensible Markup-Sprache) ist eine vielseitige textbasierte Markup-Sprache, die sowohl für die Lesbarkeit des Menschen als auch für die Analyse von Maschinen entwickelt wurde. Es wird üblicherweise für die Datenspeicherung ein verwendet und wird häufig verwendet
Erklären Sie JSON Web Tokens (JWT) und ihren Anwendungsfall in PHP -APIs.
Apr 05, 2025 am 12:04 AM
JWT ist ein offener Standard, der auf JSON basiert und zur sicheren Übertragung von Informationen zwischen Parteien verwendet wird, hauptsächlich für die Identitätsauthentifizierung und den Informationsaustausch. 1. JWT besteht aus drei Teilen: Header, Nutzlast und Signatur. 2. Das Arbeitsprinzip von JWT enthält drei Schritte: Generierung von JWT, Überprüfung von JWT und Parsingnayload. 3. Bei Verwendung von JWT zur Authentifizierung in PHP kann JWT generiert und überprüft werden, und die Funktionen und Berechtigungsinformationen der Benutzer können in die erweiterte Verwendung aufgenommen werden. 4. Häufige Fehler sind Signaturüberprüfungsfehler, Token -Ablauf und übergroße Nutzlast. Zu Debugging -Fähigkeiten gehört die Verwendung von Debugging -Tools und Protokollierung. 5. Leistungsoptimierung und Best Practices umfassen die Verwendung geeigneter Signaturalgorithmen, das Einstellen von Gültigkeitsperioden angemessen.
PHP -Programm zum Zählen von Vokalen in einer Zeichenfolge
Feb 07, 2025 pm 12:12 PM
Eine Zeichenfolge ist eine Folge von Zeichen, einschließlich Buchstaben, Zahlen und Symbolen. In diesem Tutorial wird lernen, wie Sie die Anzahl der Vokale in einer bestimmten Zeichenfolge in PHP unter Verwendung verschiedener Methoden berechnen. Die Vokale auf Englisch sind a, e, i, o, u und sie können Großbuchstaben oder Kleinbuchstaben sein. Was ist ein Vokal? Vokale sind alphabetische Zeichen, die eine spezifische Aussprache darstellen. Es gibt fünf Vokale in Englisch, einschließlich Großbuchstaben und Kleinbuchstaben: a, e, ich, o, u Beispiel 1 Eingabe: String = "TutorialPoint" Ausgabe: 6 erklären Die Vokale in der String "TutorialPoint" sind u, o, i, a, o, ich. Insgesamt gibt es 6 Yuan
Erklären Sie die späte statische Bindung in PHP (statisch: :).
Apr 03, 2025 am 12:04 AM
Statische Bindung (statisch: :) implementiert die späte statische Bindung (LSB) in PHP, sodass das Aufrufen von Klassen in statischen Kontexten anstatt Klassen zu definieren. 1) Der Analyseprozess wird zur Laufzeit durchgeführt.
Was sind PHP Magic -Methoden (__construct, __Destruct, __call, __get, __set usw.) und geben Sie Anwendungsfälle an?
Apr 03, 2025 am 12:03 AM
Was sind die magischen Methoden von PHP? Zu den magischen Methoden von PHP gehören: 1. \ _ \ _ Konstrukt, verwendet, um Objekte zu initialisieren; 2. \ _ \ _ Destruct, verwendet zur Reinigung von Ressourcen; 3. \ _ \ _ Call, behandeln Sie nicht existierende Methodenaufrufe; 4. \ _ \ _ GET, Implementieren Sie den dynamischen Attributzugriff; 5. \ _ \ _ Setzen Sie dynamische Attributeinstellungen. Diese Methoden werden in bestimmten Situationen automatisch aufgerufen, wodurch die Code -Flexibilität und -Effizienz verbessert werden.
