ลายน้ำโดยใช้ PHP การเพิ่มลายน้ำแบบไดนามิกให้กับรูปภาพโดยใช้ PHP การเลือกวิธีการใช้งานลายน้ำ

ในบางกรณี การเพิ่มลายน้ำให้กับรูปภาพที่คุณโพสต์บนเว็บไซต์ของคุณเป็นวิธีเดียวที่จะป้องกันการโจรกรรมได้ นอกจากนี้พวกเขายังบอกว่าลายน้ำดังกล่าวดึงดูดการเข้าชมเพิ่มเติม

มีหลายวิธีในการสร้างลายน้ำบนรูปภาพโดยใช้ PHP แต่ลูกค้าของฉันต้องการวิธีการสมัครที่จะอนุญาตให้เขาเปลี่ยนลายน้ำเป็นลายน้ำใหม่ได้ตลอดเวลา

เมื่อปรากฎว่ามีวิธีแก้ปัญหาดังกล่าว

โดยปกติจะใช้โดยผู้ที่พัฒนาเว็บไซต์ที่มีเนื้อหากราฟิกเป็นส่วนใหญ่

การเลือกวิธีการใส่ลายน้ำ

ปัญหาในการใช้ระเบียบทั้งหมดนี้คือการเลือกใช้ลายน้ำระหว่างประสิทธิภาพและความยืดหยุ่น ไม่มีวิธีแก้ปัญหาใดที่เหมาะกับทุกคน นั่นเป็นเหตุผลที่มีการใช้งานหลายอย่าง

ในกรณีของฉัน ลูกค้าขอสงวนสิทธิ์ในการรีแบรนด์ได้ตลอดเวลาและแทน "เขาและกีบ"เขียน “กีบและเขา”- วิธีการใส่ลายน้ำที่คุณเลือกก็ควรยอมรับสิ่งนี้เช่นกัน

สาระสำคัญของเทคโนโลยีลายน้ำที่อธิบายไว้ในที่นี้คือการเพิ่มเครื่องหมายนี้ทุกครั้งที่โหลดภาพ ใช่ วิธีการนี้มีข้อจำกัดหลายประการที่อาจส่งผลต่อประสิทธิภาพการทำงานอย่างมาก แต่อย่างที่พวกเขาพูด ลูกค้าจะถูกเสมอ ดังนั้นหากเป็นเช่นนั้น งานต้องใช้ลายน้ำแบบไดนามิกนี่คือสิ่งที่ต้องทำ

หากใครมีวิธีที่ง่ายกว่านี้ก็สามารถแสดงความคิดเห็นได้ มันจะน่าสนใจที่จะฟัง

ก่อนที่จะนำเสนอโค้ด ผมอยากจะอธิบายข้อดีพร้อมทั้งยกตัวอย่างการทำงานด้วย

ข้อดี:

คุณสามารถเปลี่ยนลายน้ำได้อย่างน้อย 500 ครั้งต่อวัน
สามารถนำไปใช้งานใน CMS ใดก็ได้ (ไม่ได้เชื่อมโยงกับมันแต่อย่างใด)

ข้อเสีย:

ขึ้นอยู่กับประสิทธิภาพของโฮสติ้ง (หากคุณมีรูปภาพจำนวนมากหรือมีความละเอียดสูง สิ่งนี้อาจทำให้เซิร์ฟเวอร์มีภาระงานมาก)
จิตใจที่อยากรู้อยากเห็นจะยังสามารถลบลายน้ำของคุณได้

ข้อสรุป:สำหรับการโพสต์ภาพที่มีลายน้ำจำนวนเล็กน้อยวิธีนี้เหมาะมาก แต่ถ้าคุณจะเปิดแกลเลอรี่ภาพก็ควรมองหาสิ่งที่โหลดน้อยกว่าจะดีกว่า

ตัวอย่าง

การใช้ลายน้ำโดยใช้ PHP

ตามที่สัญญาไว้ คุณไม่จำเป็นต้องมีความรู้พิเศษใดๆ เกี่ยวกับเรื่องนี้ คุณต้อง:

ซึ่งอยู่ในไฟล์เก็บถาวรและวางไว้ในไดเร็กทอรีรากของไซต์ของคุณ
เราวางรูปภาพที่จะทำหน้าที่เป็นลายน้ำในไดเร็กทอรีรากของไซต์และตั้งชื่อให้กับรูปภาพนั้น (ในกรณีของฉันคือเส้นแปรงสีขาว ดังนั้นลิงก์อาจไม่ปรากฏให้เห็นบนพื้นหลังของเบราว์เซอร์ของคุณ) รูปภาพต้องเป็น PNG เนื่องจากมีเลเยอร์โปร่งใส หากต้องการใช้ GIF คุณต้องแก้ไขไฟล์ รูปภาพ.php;
ในตำแหน่งที่คุณต้องการแสดงภาพพร้อมลายน้ำ ให้วางโค้ด:

นั่นคือทั้งหมดที่ ทุกคนมีความสุขทั้งคุณและลูกค้า

หากคุณต้องการเพิ่มลายน้ำให้กับภาพถ่ายโดยไม่ต้องใช้เครื่องมือแก้ไขรูปภาพหรือเพิ่มลายน้ำในขณะที่อัพโหลดรูปภาพไปยังเซิร์ฟเวอร์ บทช่วยสอนนี้เหมาะสำหรับคุณ

ในบทช่วยสอนนี้ ฉันจะแสดงให้คุณเห็นถึงวิธีการเพิ่มลายน้ำให้กับรูปภาพได้ทันทีโดยไม่ต้องเปลี่ยนรูปภาพต้นฉบับ ก่อนอื่น คุณจะต้องมีรูปภาพเพื่อใช้เป็นลายน้ำ

จากนั้นเราสร้างส่วนหัวของไฟล์:

// บรรทัดนี้จะบอกเบราว์เซอร์ว่าเรากำลังส่งส่วนหัวของรูปภาพ jpg ("content-type: image/jpeg");

จากนั้นเราสร้างภาพ PNG และรับขนาดของมัน:

// สร้างลายน้ำในรูปแบบ PNG $watermark = imagecreatefrompng("watermark.png"); // รับความกว้างและความสูง $watermark_width = imagesx($watermark); $watermark_height = ภาพ ($ลายน้ำ);

เราจะทำเช่นเดียวกันกับรูปภาพต้นฉบับ แต่จะอยู่ในรูปแบบ jpg เท่านั้น นี่เป็นเรื่องปกติสำหรับรูปภาพที่อัปโหลดผ่านแบบฟอร์ม เราดำเนินการดังต่อไปนี้:

// สร้างภาพ jpg $image_path = "Original.jpg"; $image = imagecreatefromjpeg($image_path); // รับขนาดภาพ $size = getimagesize($image_path);

ตอนนี้เราต้องใส่ลายน้ำบนภาพ:

// วางลายน้ำที่มุมขวาล่าง เยื้อง 5px $dest_x = $size - $watermark_width - 5; $dest_y = $size - $watermark_height - 5;

ต่อไป มาตั้งค่าตัวเลือกการผสมสำหรับรูปภาพทั้งสอง:

Imagealphableding($รูปภาพ, จริง); imagealphableding($ลายน้ำ, จริง);

ในที่สุดเราก็สร้างภาพใหม่โดยใช้พารามิเตอร์:

// สร้างสำเนารูปภาพใหม่ ($image, $watermark, $dest_x, $dest_y, 0, 0, $watermark_width, $watermark_height); imagejpeg($ภาพ);

สิ่งสำคัญคือต้องทำความสะอาดตัวเอง:

// เพิ่มหน่วยความจำ imagedestroy($image); imagedestroy($ลายน้ำ);

คุณสามารถใช้ Photoshop เพื่อปรับความโปร่งใสของลายน้ำได้

นั่นคือทั้งหมดที่มีทฤษฎี ตอนนี้เรามาประยุกต์ใช้ความรู้ของเรากับโครงการจริง ทั้งหมดนี้จะต้องบันทึกลงในไฟล์ ตัวอย่างเช่นเรียกว่า watermark.php

ส่วนหัว("ประเภทเนื้อหา: รูปภาพ/jpeg"); // รับชื่อรูปภาพผ่าน GET $image = $_GET["image"]; // สร้างลายน้ำ $watermark = imagecreatefrompng("watermark.png"); // รับความสูงและความกว้างของลายน้ำ $watermark_width = imagesx($watermark); $watermark_height = ภาพ ($ลายน้ำ); // สร้าง jpg จากรูปภาพต้นฉบับ $image_path = "/path/to/image/folder/" $ภาพ; $image = imagecreatefromjpeg($image_path); //หากมีสิ่งผิดปกติเกิดขึ้น if ($image === false) ( return false; ) $size = getimagesize($image_path); // ใส่ลายน้ำบนภาพ $dest_x = $size - $watermark_width - 5; $dest_y = $size - $watermark_height - 5; imagealphableding($ ภาพ, จริง); imagealphableding($ลายน้ำ, จริง); // สร้างสำเนารูปภาพใหม่ ($image, $watermark, $dest_x, $dest_y, 0, 0, $watermark_width, $watermark_height); imagejpeg($ภาพ); // เพิ่มหน่วยความจำ imagedestroy($image); imagedestroy($ลายน้ำ);

ตอนนี้ ในการแสดงภาพถ่ายที่มีลายน้ำโดยไม่ต้องเปลี่ยนภาพต้นฉบับ ให้ใช้โค้ดต่อไปนี้

เจ้าของเว็บไซต์ (ฟอรัม กระดานข้อความ ฯลฯ) มักประสบปัญหาในการสร้างลายน้ำบนรูปภาพขนาดใหญ่ทั้งหมดของไซต์

แน่นอน คุณสามารถแก้ปัญหานี้ได้ด้วยการสร้างลายน้ำในแต่ละภาพด้วยตนเอง อย่างไรก็ตาม ประการแรก ขั้นตอนนี้ใช้เวลานาน และประการที่สอง จำเป็นต้องจัดเก็บรูปภาพสองเวอร์ชัน โดยมีและไม่มีลายน้ำ

วิธีแก้ปัญหานี้คือการใช้ลายน้ำแบบไดนามิกกับรูปภาพก่อนที่จะส่งไปยังผู้เยี่ยมชมไซต์

มีวิธีแก้ไขปัญหานี้บนอินเทอร์เน็ตในรูปแบบของไฟล์สองไฟล์ซึ่งมีเนื้อหาดังนี้
ซอร์สโค้ดของไฟล์ ".htaccess"

DirectoryIndex index.php RewriteEngine บน RewriteCond %(REQUEST_FILENAME) -f RewriteRule ^(.*)$ /watermark/_watermark.php

ซอร์สโค้ดของไฟล์ "_watermark.php"

250) && ($info_o > 250)) ( // สำหรับรูปภาพที่ไม่มีช่องอัลฟา // พารามิเตอร์สุดท้ายของฟังก์ชันคือระดับความทึบของลายน้ำ imageCopyMerge($out, $watermark, ($info_o-$info_w) /2, ($info_o -$info_w)/2, 0, 0, $info_w, $info_w, 25); // สำหรับรูปภาพที่มีช่องอัลฟ่า // ในกรณีนี้ ความโปร่งใสจะถูกปรับโดยช่องอัลฟ่าของ ภาพตัวเอง // imageCopy($out, $watermark, ($info_o-$info_w)/2, ($info_o-$info_w)/2, 0, 0, $info_w, $info_w ) สลับ ($info_o) ( กรณีที่ 1 : imageGIF($out); กรณีที่ 2: imageJPEG($out); กรณีที่ 3: imagePNG($out); imageDestroy($ต้นฉบับ); imageDestroy($ลายน้ำ); กลับเป็นจริง; -

วิธีแก้ปัญหามีดังนี้: ไฟล์ “.htaccess” ถูกวางไว้ในไดเร็กทอรีพร้อมกับไฟล์รูปภาพ นอกจากนั้น โฟลเดอร์ “ลายน้ำ” จะถูกสร้างขึ้นบนเซิร์ฟเวอร์ ซึ่งมีไฟล์สคริปต์ “_watermark.php” และไฟล์ลายน้ำจริง “watermark.png”

ในเวลาเดียวกัน เมื่อเปรียบเทียบกับเวอร์ชันดั้งเดิมที่พบในอินเทอร์เน็ต ฉันได้ทำการเปลี่ยนแปลงเล็กน้อยกับไฟล์ข้อความทั้งสองไฟล์

ในไฟล์ ".htaccess" ส่วนขยาย "jpeg" ได้ถูกเพิ่มลงในนิพจน์ทั่วไปสำหรับการค้นหาไฟล์รูปภาพ เนื่องจากพบบ่อยเช่นกัน

สคริปต์ "_watermark.php" ได้รับการปรับปรุงใหม่ในลักษณะที่จะวางลายน้ำไว้ที่กึ่งกลางของภาพ (ซึ่งจำเป็นสำหรับปัญหาเฉพาะที่กำลังแก้ไข) และความสามารถในการปรับความโปร่งใสของลายน้ำที่สร้างขึ้นได้ ถูกเพิ่มแล้ว (ความคิดเห็นในส่วนเนื้อหาของสคริปต์จะช่วยคุณกำหนดค่าพารามิเตอร์นี้ด้วยตนเอง)

คุณควรใส่ใจกับความจริงที่ว่าการวางโฟลเดอร์ "ลายน้ำ" ในโฟลเดอร์ที่มีรูปภาพตามที่แหล่งข้อมูลดั้งเดิมแนะนำเราจะไม่ได้ผลลัพธ์ที่ต้องการเพราะ ในกรณีนี้เราจะต้องมีไฟล์ ".htaccess" และโฟลเดอร์ "ลายน้ำ" ของตัวเองในแต่ละโฟลเดอร์ นี่เป็นเพราะว่าไฟล์ ".htaccess" ระบุเส้นทางที่แน่นอนจากไดเร็กทอรีรากของไซต์ไปยังไฟล์ "_watermark.php" ดังนั้นการมีโฟลเดอร์ย่อย "ลายน้ำ" แยกต่างหากในแต่ละโฟลเดอร์ที่มีรูปภาพ หากเราจำเป็นต้องเปลี่ยนลายน้ำ (หรือสคริปต์ที่ซ้อนทับบนรูปภาพ) เราจะต้องทำการเปลี่ยนแปลงในทุกโฟลเดอร์

เพื่อหลีกเลี่ยงปัญหานี้ ฉันขอแนะนำให้สร้างโฟลเดอร์ "ลายน้ำ" ในไดเร็กทอรีรากของไซต์ และวางไฟล์ ".htaccess" ในไดเร็กทอรีรูปภาพโดยไม่ต้องเปลี่ยนทุกครั้ง ในกรณีนี้ หากต้องการเปลี่ยนลายน้ำหรือสคริปต์ เราจะต้องทำการเปลี่ยนแปลงในที่เดียวบนเว็บไซต์เท่านั้น ในกรณีนี้ คุณสามารถสร้างลายน้ำที่แตกต่างกันสำหรับโฟลเดอร์ที่มีรูปภาพต่างๆ ได้โดยอ้างอิงจากไฟล์ “.htaccess” ที่แตกต่างกันไปยังสคริปต์ต่างๆ เช่น “_watermark-1.php”, “_watermark-2.php” เป็นต้น

ดังนั้นโดยสรุปเราสามารถพูดได้ว่าในการใช้ลายน้ำกับรูปภาพทั้งหมดของไซต์คุณต้องดาวน์โหลดไฟล์เก็บถาวรที่แนบมาด้านล่างแกะมันออกวางโฟลเดอร์ "ลายน้ำ" ในไดเร็กทอรีรากของไซต์แทนที่ไฟล์ลายน้ำ " watermark.png” ลงในไฟล์ของคุณเอง และวางไฟล์ ".htaccess" ลงในไดเร็กทอรีของไซต์ รูปภาพที่ควรใส่ลายน้ำ

คุณสามารถดาวน์โหลดไฟล์เก็บถาวรที่มีไฟล์ที่จำเป็นทั้งหมดได้ที่นี่

คุณมีความเสี่ยงอย่างมากเมื่อคุณเผยแพร่ภาพและวิดีโอของคุณบนอินเทอร์เน็ต เนื่องจากเนื้อหาของคุณสามารถคัดลอกไปยังแหล่งข้อมูลอื่น ๆ หลายร้อยแห่งได้อย่างง่ายดาย คงจะไม่ใช่เรื่องดีเลยที่จะหารูปภาพของคุณสำหรับเรื่องราวข่าว เช่น ที่คุณทำงานอย่างหนักบนไซต์อื่นโดยไม่ระบุแหล่งที่มา นั่นคือ ไซต์ของคุณ ใช่ไหม พูดง่ายๆ คุณจะอารมณ์เสีย และถ้าไม่ใช่ภาพธรรมดาสำหรับข่าว แต่เป็นงานที่ซับซ้อนใน Photoshop การจะบอกว่าคุณจะโกรธก็คือไม่ต้องพูดอะไรเลย! แล้วคุณจะทำอย่างไรเพื่อปกป้องกราฟิกของคุณ?

เพื่อปกป้องลิขสิทธิ์ของภาพหรือวิดีโอบนอินเทอร์เน็ต โดยปกติจะใช้ลายน้ำดิจิทัลหรือลายน้ำดิจิทัลเพื่อความสะดวก แนบแบนเนอร์ดิจิทัลกับรูปภาพที่อัปโหลดแต่ละภาพเพื่อป้องกัน CEZ อาจเป็นโลโก้ของเว็บไซต์หรือบริษัทของคุณ โดยวางไว้อย่างสวยงามและสวยงามบนภาพที่อัปโหลด

ขั้นแรกเรามาสร้างไฟล์ที่มีการตั้งค่าที่จำเป็นในรูปแบบของค่าคงที่ - /config.php:

กำหนด ("WATERMARK_OVERLAY_IMAGE", "/develop/images/watermark.png"); // เส้นทางไปยังศูนย์แสดงสินค้ากลางของคุณ กำหนด("WATERMARK_OUTPUT_QUALITY", 100); // คุณภาพของภาพที่ได้มาจากการบันทึกวิดีโอดิจิทัล โปรดจำไว้ว่าคุณภาพส่งผลโดยตรงต่อขนาดไฟล์ กำหนด("UPLOADED_IMAGE_DESTINATION", "/develop/folder1/"); // เส้นทางไปยังตำแหน่งของภาพที่โหลดต้นฉบับกำหนด ("WATERMARK_IMAGE_DESTINATION", "/develop/folder2/"); // พาธไปยังรูปภาพที่มีรูปคลื่นดิจิทัลซ้อนทับ

มารวบรวมไฟล์ที่สร้างขึ้นด้านบนในไฟล์ที่ดำเนินการดาวน์โหลด /upload.php

รวม("config.php"); รวม("functions.php"); $result = ImageUpload($_FILES["userfile"]["tmp_name"], $_FILES["userfile"]["name"]); if ($result === false)( echo "การดาวน์โหลดล้มเหลว!"; )

ตัวอย่างเช่น หากรูปภาพที่กำลังโหลดคือ:

หลังจากดาวน์โหลดและใช้ลายน้ำแล้ว คุณจะได้ภาพดังต่อไปนี้:

ในตัวอย่างนี้ รูปภาพที่ดาวน์โหลดจะถูกบันทึกในโฟลเดอร์หนึ่ง และรูปภาพที่มีลายน้ำดิจิทัลซ้อนทับอยู่ในอีกโฟลเดอร์หนึ่ง เพื่อให้คุณสามารถเข้าถึงรูปภาพต้นฉบับได้ตลอดเวลา แต่แน่นอนว่าการโพสต์รูปภาพจากดิจิทัลนั้นคุ้มค่า นิทรรศการบนเว็บไซต์

(178.4 KiB, 989 ครั้ง)

มีรูปภาพจำนวนมากบนอินเทอร์เน็ต ซึ่งโดยปกติแล้วเจ้าของไซต์หรือผู้ใช้ไซต์จะอัปโหลด รูปภาพอาจย้ายจากไซต์หนึ่งไปอีกไซต์หนึ่ง ทั้งนี้ขึ้นอยู่กับความเกี่ยวข้อง ไม่ต้องพูดถึงเรื่องลิขสิทธิ์ ไม่ใช่เจ้าของเว็บไซต์ทุกคนอาจชอบที่ภาพจากเว็บไซต์ของเขาถูกคัดลอกไปยังแหล่งข้อมูลอื่น เพื่อเป็นวิธีการต่อสู้กับการคัดลอกรูปภาพไซต์ซ้ำ ๆ จึงถูกคิดค้นเพื่อใช้ลายน้ำกับรูปภาพเพื่อระบุว่ารูปภาพนั้นเป็นของทรัพยากรเฉพาะ โดยเฉพาะอย่างยิ่งสำหรับไซต์ที่มีรูปภาพที่ไม่ซ้ำใครจำนวนมาก

มาดูตัวอย่างโค้ดที่สาธิตการใช้ลายน้ำกับภาพที่ดาวน์โหลด

ดังนั้นการตั้งค่าหลักจะอยู่ในรูปแบบของค่าคงที่และมาก่อนในโค้ด:

// เส้นทางไปยังภาพลายน้ำกำหนด ("WATERMARK_OVERLAY_IMAGE", "/lab/watermark/watermark.png"); // การบีบอัด ช่วง 0-100 (ส่งผลต่อคุณภาพของภาพ) กำหนด ("WATERMARK_OUTPUT_QUALITY", 100); // โฟลเดอร์ที่มีอิมเมจต้นฉบับกำหนด ("UPLOADED_IMAGE_DESTINATION", "/lab/watermark/upload/src/"); // โฟลเดอร์ที่มีรูปภาพที่ประมวลผลกำหนด ("WATERMARK_IMAGE_DESTINATION", "/lab/watermark/upload/");

บนหน้าเราจะวางแบบฟอร์มอัพโหลดรูปภาพซึ่งรูปภาพจะถูกส่งไปยังเซิร์ฟเวอร์
รหัสแบบฟอร์ม:

ภาพต้นฉบับ

" style="ความกว้างสูงสุด: 300px;" />

รูปภาพที่มีลายน้ำ

" style="ความกว้างสูงสุด: 300px;" />

ตอนนี้สิ่งที่สำคัญที่สุดคือฟังก์ชั่นการประมวลผลภาพ ควรวางฟังก์ชันเหล่านี้ก่อนที่จะแสดงแบบฟอร์มบนเพจ

ฟังก์ชั่นหลักสองประการด้วยความช่วยเหลือของอันหนึ่งรูปภาพจะถูกอัพโหลดไปยังเซิร์ฟเวอร์และอีกอันหนึ่งจะใช้ลายน้ำ บางทีความคิดเห็นเกี่ยวกับฟังก์ชันอาจมีการอธิบายรายละเอียดเพิ่มเติม และการเขียนสิ่งเดียวกันที่นี่อาจไม่จำเป็น