PHP - Hinzufügen von Wasserzeichen beim hochladen eines Bildes

[Bildschirmfoto] Hinzufügen von Wasserzeichen beim hochladen eines Bildes.

Ein Wasserzeichen ist die beste Option, um das Bild vor Diebstahl oder der Wiederverwendung durch eine andere Person zu schützen. Sie können den Besitz anzeigen, indem Sie dem Bild Wasserzeichen hinzufügen. Das Wasserzeichen hilft, den Ersteller zu identifizieren.

Meistens wird der Wasserzeichenstempel in den urheberrechtlich geschützten Bildern verwendet. Im Allgemeinen wird das Firmenlogo oder der Name des Erstellers als Wasserzeichen zu Bildern hinzugefügt.

Mein Beispielskript hilft Ihnen, Bilder mit Wasserzeichen hochzuladen und mit PHP auf dem Server zu speichern. Sie können das Wasserzeichen automatisch mit PHP zu hochgeladenen Bildern hinzufügen.

Quelltext:  wasserzeichen.php AusblendenKopierenLinkZeilen

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
199
200
201
202
203
204
205
206
207
208
209
210
211
212
213
214
215
216
217
218
219
220
221
222
223
224
225
226
227
228
229
230
231
232
233
234
235
236
237
238
239
240
241
242
243
244
245
246
247
248
249
250
251
252
253
254
255
256
257
258
259
260
261
262
<?php
/*
 * Hinzufügen von Wasserzeichen beim hochladen eines Bildes
 */


// Verzeichnis der hochgeladenen Bilder
$uploadFolder "bilder/";

// Maximale Dateigröße in Bytes
// 1048576 Bytes = 1 MB
$maxFilesize 5242880// 5242880 Bytes = 5 MB

// Abmessungen der Bilddatei in Pixel
$maxWidth 1500// Maximale Breite
$maxHeight 1500// Maximale Höhe

// Angabe der Mimetypen (nur Bilddateien)
$mimeType = [
  
"jpg" => "image/jpeg",
  
"jpeg" => "image/jpeg",
  
"png" => "image/png",
  
"gif" => "image/gif",
  
"webp" => "image/webp"
];

// Maximale Länge des Dateinamens
$maxFilename 65// 65

// Pfad zum Wasserzeichen-Bild (muss vom Typ: .PNG sein!)
$watermarkPath "watermark.png";

// Position des Wasserzeichen
// 1 = links oben, 2 = rechts oben, 3 = links unten,
// 4 = rechts unten, 5 = mitte
// 0 = Andere Position, siehe Abschnitt: // Position manuell setzen
$watermarkPos 4// 4

// Wasserzeichen-Tranzparenz: 0 - 100 (0 = keine Transp.)
$watermarkTransp 35// 35

// Ausgabe
$output '';

// Daten wurden über das Formular gesendet
if ($_SERVER["REQUEST_METHOD"] == "POST") {

  
// Temporäre Datei wurde hochgeladen
  
if (is_uploaded_file($_FILES["file"]["tmp_name"])) {

    
// Info über die Datei holen
    
list($tmpWidth$tmpHeight$tmpType) = getImageSize($_FILES["file"]["tmp_name"]);
    
$path pathinfo($_FILES["file"]["name"]);
    
$extension strtolower($path["extension"]);
    
$filename $path["filename"];
    
// $filename = "image_"; // Bsp. für einheitliche Dateinamen

    // Nur Bilddateien durchlassen
    
if (
      
$tmpWidth > &&
      
$tmpHeight > &&
      
in_array($_FILES["file"]["type"], $mimeType) &&
      
in_array($extensionarray_keys($mimeType))
    ) {

      
// Dateigröße überprüfen
      
if ($_FILES["file"]["size"<$maxFilesize) {

        
// Abmessungen überprüfen
        
if (
          
$tmpWidth <$maxWidth &&
          
$tmpHeight <$maxHeight
        
) {

          
// Dateiname filtern
          
$filename iconv("ISO-8859-1""UTF-8"$filename); // UTF-8 decodiert
          
$filename trim($filename); // Whitespace
          
$filename mb_strtolower($filename); // Kleinbuchstaben

          // Hier entsprechende Zeichen und Ersatzzeichen (vom ASCII-Zeichensatz) einfügen
          
$filename str_replace(["ä""ö""ü""ß"" ",], ["ae""oe""ue""ss""_",], $filename);

          
// Angegebene Zeichen durchlassen, alle sonstigen filtern
          
$filename preg_replace("/[^a-z0-9_-]/"""$filename);

          
// Länge des Dateinamens eventuell kürzen
          
$newname substr($filename0$maxFilename) . "." $extension;

          
// Wenn die Datei vorhanden ist, hänge eine Zahl an den Dateinamen
          // Beispiel: bild_002.jpg, bild_003.jpg, bild_004.jpg ...
          
if (file_exists($uploadFolder $newname)) {
            
$nr 2// Startzahl
            
do {
              
$newname substr($filename0$maxFilename)  . '_' .  str_pad($nr3"0"STR_PAD_LEFT) . "." $extension;
              
$nr++;
            } while (
file_exists($uploadFolder $newname));
          }

          
// Wasserzeichen hinzufügen
          
watermark($_FILES["file"]["tmp_name"], $extension$watermarkPath$watermarkPos$watermarkTransp);

          
// Datei auf den Server hochladen
          
if (move_uploaded_file($_FILES["file"]["tmp_name"], $uploadFolder $newname)) {
            
$output '<p>Die Datei: &bdquo;$newname '&rdquo; wurde hochgeladen.</p>';
          } else {
            
$output '<p>Fehler beim hochladen!</p>';
          }
        } else {
          
$output '<p>Die Abmessungen des Bildes: ' $tmpWidth 'px * ' $tmpHeight 'px sind zu groß!</p>';
        }
      } else {
        
$output '<p>Das Bild ist zu groß (max: ' $maxFilesize ' Bytes)!</p>';
      }
    } else {
      
$output '<p>Bitte nur Bilddateien hochladen!</p>';
    }
  }
}

// Wasserzeichen
function watermark($targetFilePath$extension$watermarkPath$watermarkPos$watermarkTransp) {

  
// Erzeugt ein neues Bild aus einer Datei (je nach Dateityp)
  
switch ($extension) {
    case 
'jpg':
      
$img imageCreateFromJPEG($targetFilePath);
      break;
    case 
'jpeg':
      
$img imageCreateFromJPEG($targetFilePath);
      break;
    case 
'png':
      
$img imageCreateFromPNG($targetFilePath);
      break;
    case 
'gif':
      
$img imageCreateFromGIF($targetFilePath);
      break;
    case 
'webp':
      
$img imageCreateFromWEBP($targetFilePath);
      break;
    default:
      
$img imageCreateFromJPEG($targetFilePath);
  }

  
// Breite und Höhe des Bildes
  
$imgW imagesX($img);
  
$imgH imagesY($img);

  
// Erzeugt ein neues Wasserzeichen-Bild aus einer Datei
  
$watermarkImg imageCreateFromPNG($watermarkPath);

  
// Festlegen des Mischmodus für das Bild
  
imageAlphaBlending($watermarkImgfalse);

  
// Alphakanal-Information erhalten
  
imageSaveAlpha($watermarkImgtrue);

  
// Breite und Höhe des Wasserzeichens
  
$wmW imagesX($watermarkImg);
  
$wmH imagesY($watermarkImg);

  
// Position des Wasserzeichen
  
$margin 10// Pixel Abstand vom Bildrand

  
switch ($watermarkPos) {
    case 
1// links oben
      
$wmX $margin;
      
$wmY $margin;
      break;
    case 
2// rechts oben
      
$wmX $imgW $wmW $margin;
      
$wmY $margin;
      break;
    case 
3// links unten
      
$wmX $margin;
      
$wmY $imgH $wmH $margin;
      break;
    case 
4// rechts unten
      
$wmX $imgW $wmW $margin;
      
$wmY $imgH $wmH $margin;
      break;
    case 
5// mitte
      
$wmX round($imgW 2) - round($wmW 2);
      
$wmY round($imgH 2) - round($wmH 2);
      break;
    default: 
// Position manuell setzen
      
$wmX 150// Position von links
      
$wmY 250// Position von oben
  
}

  
// Kopiere das Wasserzeichen mit der Tranzparenz und der Position ins Bild
  
imageCopyMerge($img$watermarkImg$wmX$wmY00$wmW$wmH$watermarkTransp);

  
// Bild speichern und den Grafikspeicher löschen
  
imagePNG($img$targetFilePath);
  
imageDestroy($img);
}
?>
<!DOCTYPE html>
<html lang="de">

<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>Hinzufügen von Wasserzeichen</title>

  <style>
    body {
      font-family: Arial, Tahoma, Sans-Serif;
      margin: 25px;
    }

    p {
      width: 430px;
      padding: 10px;
      background-color: Whitesmoke;
      box-shadow: 0px 0px 4px 1px Gainsboro;
    }
  </style>


</head>

<body>

  <form method="post" enctype="multipart/form-data">

    <p>
      <label>Bild:
        <input type="file" name="file" id="file" accept="image/*" data-size-max="<?= $maxFilesize?>" required="required"></label><br>
      <small>Dateiformate: <?= implode(", "array_unique(array_keys($mimeType))); ?> -
        Max. Dateigröße: <?= number_format(($maxFilesize 1024 1024), 1",""."); ?> MB<br>
        Max. Abmessungen: <?= $maxWidth ' x ' $maxHeight?> Pixel</small>
    </p>

    <p>
      <button type="submit">Absenden</button>
    </p>

  </form>

  <?= $output?>

  <script>
    document.getElementById("file").addEventListener('change', (e) => {
      FileList.prototype.every = Array.prototype.every;
      var element = e.target;
      if (!element.matches('input[type="file"][data-size-max]')) {
        return;
      }
      var sizeMax = parseInt(element.dataset.sizeMax);
      var valid = element.files.every(function(file) {
        return file.size < sizeMax;
      });

      if (!valid) {
        element.setCustomValidity(`Datei darf maximal ${sizeMax} Byte gross sein!`);
      }
    });
  </script>


</body>

</html>

Tipps

Vorschaubilder (Thumbnails) erstellen

Bilder mit Wasserzeichen markieren

Bilder in den Browser laden per File API

Bilder in einer Datenbank-Tabelle speichern und ausgeben

Bausteine  Alle Anzeigen

Eine zufällige Auswahl von Codeschnipseln aus den Bereichen HTML, CSS, PHP, JavaScript und MySQL.

<area> Areal (Verweis-sensitive Grafik)

CSS - Elemente ab einer bestimmten Fensterbreite ausblenden

PHP - Ein Verzeichnis als ZIP-Archiv verpacken

JavaScript - Audiodatei in JavaScript verstecken

MySQL - Spalte umbenennen