Sekarang, kita semua telah menemui imej Captcha dalam bentuk dalam talian. Captchas adalah kejahatan yang diperlukan, dan artikel ini akan mengajar anda bagaimana mereka dibuat.
Sila ambil perhatian bahawa walaupun terdapat penyelesaian pihak ketiga yang lebih baik, automatik untuk Captchas di luar sana seperti Recaptcha, tutorial ini bertujuan untuk menerangkan dan menunjukkan bagaimana teknologi tersebut berfungsi. Kami tidak akan menjelaskan apa sebenarnya Captchas, kerana ia dianggap pengetahuan umum dan sudah diliputi dengan lebih terperinci di tempat lain.
Takeaways Key
captchas biasanya terdiri daripada 3 perkara - bentuk, penyelewengan, dan teks.
Kami akan mengikuti langkah -langkah yang disebutkan di bawah:
Paparkan gambar kosong
Baris pertama menunjukkan permulaan sesi pengguna pada halaman kami.
<span><span><?php </span></span><span><span>session_start(); </span></span><span><span>?></span> </span> <span><span><span><title</span>></span>demo.php<span><span></title</span>></span> </span> <span><span><span><body</span> <span>style<span>="<span>background-color:#ddd; </span>"</span></span>></span> </span> <span><span><?php </span></span><span> <span>create_image(); </span></span><span> <span>display(); </span></span><span> <span>/***** definition of functions *****/ </span></span><span> <span>function display() </span></span><span> <span>{ </span></span><span> <span>?></span> </span> <span><span><span><div</span> <span>style<span>="<span>text-align:center;</span>"</span></span>></span> </span> <span><span><span><h3</span>></span>TYPE THE TEXT YOU SEE IN THE IMAGE<span><span></h3</span>></span> </span> <span><span><span><b</span>></span>This is just to check if you are a robot<span><span></b</span>></span> </span> <span><span><span><div</span> <span>style<span>="<span>display:block;margin-bottom:20px;margin-top:20px;</span>"</span></span>></span> </span> <span><span><span><img</span> src<span>="image.png"</span>></span> </span> <span><span><span></div</span>></span> </span> //div1 ends <span><span><span></div</span>></span> //div2 ends </span> <span><span><?php </span></span><span> <span>} </span></span><span> </span><span> <span>function create_image() </span></span><span> <span>{ </span></span><span> <span>$image = imagecreatetruecolor(200, 50); </span></span><span> <span>imagepng($image, "image.png"); </span></span><span> <span>} </span></span><span> </span><span> <span>?></span> </span> <span><span><span></body</span>></span> </span><span><span><?php </span></span><span><span>?></span></span>
Fungsi paparan () tidak mempunyai apa -apa selain kod HTML biasa yang memaparkan imej dalam penyemak imbas. Selain itu, hanya gaya yang dilakukan untuk output untuk kelihatan cantik.
Di dalam fungsi create_image (), pembolehubah digunakan untuk merujuk imej yang dikembalikan oleh fungsi ImageAteTetRuecolor () yang mengambil lebar dan panjang imej sebagai argumennya. ImagePng () mencipta imej PNG nama dan laluan yang ditentukan (dalam direktori yang sama).
Imej hitam akan menjadi output selepas langkah pertama kami.
Buat bentuk
Fungsi ImageColorAllocate () memperuntukkan warna kepada pembolehubah kerana ia mengambil gabungan RGB warna sebagai argumen. Kod berikut akan dilampirkan dalam fungsi CREATE ().
<span><span><?php </span></span><span><span>session_start(); </span></span><span><span>?></span> </span> <span><span><span><title</span>></span>demo.php<span><span></title</span>></span> </span> <span><span><span><body</span> <span>style<span>="<span>background-color:#ddd; </span>"</span></span>></span> </span> <span><span><?php </span></span><span> <span>create_image(); </span></span><span> <span>display(); </span></span><span> <span>/***** definition of functions *****/ </span></span><span> <span>function display() </span></span><span> <span>{ </span></span><span> <span>?></span> </span> <span><span><span><div</span> <span>style<span>="<span>text-align:center;</span>"</span></span>></span> </span> <span><span><span><h3</span>></span>TYPE THE TEXT YOU SEE IN THE IMAGE<span><span></h3</span>></span> </span> <span><span><span><b</span>></span>This is just to check if you are a robot<span><span></b</span>></span> </span> <span><span><span><div</span> <span>style<span>="<span>display:block;margin-bottom:20px;margin-top:20px;</span>"</span></span>></span> </span> <span><span><span><img</span> src<span>="image.png"</span>></span> </span> <span><span><span></div</span>></span> </span> //div1 ends <span><span><span></div</span>></span> //div2 ends </span> <span><span><?php </span></span><span> <span>} </span></span><span> </span><span> <span>function create_image() </span></span><span> <span>{ </span></span><span> <span>$image = imagecreatetruecolor(200, 50); </span></span><span> <span>imagepng($image, "image.png"); </span></span><span> <span>} </span></span><span> </span><span> <span>?></span> </span> <span><span><span></body</span>></span> </span><span><span><?php </span></span><span><span>?></span></span>
Menjana garis rawak.
Fungsi imageline () mengambil koordinat x1, x2, y1, y2 sebagai argumen dalam perintah itu selain daripada rujukan imej dan warna garis. Warna garis telah diperuntukkan sama seperti warna latar belakang telah diperuntukkan pada langkah sebelumnya.
<span>$background_color = imagecolorallocate($image, 255, 255, 255); </span><span>imagefilledrectangle($image,0,0,200,50,$background_color);</span>
Koordinat Y diberikan sebagai rand ()*p kerana ini adalah ketinggian kotak kami dan akan sentiasa mengembalikan nilai di bawah 50. Anda boleh menggunakan RAND (0,50) secara alternatif. Mereka akan menghasilkan julat output yang sama.
Menjana titik rawak.
Koordinat X dijana secara rawak dengan menggunakan rand ()* 0 kerana ini adalah lebar kotak kami dan ini akan sentiasa mengembalikan nilai di bawah 200. Anda boleh menggunakan RAND (0,200) secara alternatif. Mereka akan menghasilkan julat output yang sama. Koordinat Y dijana seperti dalam langkah garis.
<span><span><?php </span></span><span><span>session_start(); </span></span><span><span>?></span> </span> <span><span><span><title</span>></span>demo.php<span><span></title</span>></span> </span> <span><span><span><body</span> <span>style<span>="<span>background-color:#ddd; </span>"</span></span>></span> </span> <span><span><?php </span></span><span> <span>create_image(); </span></span><span> <span>display(); </span></span><span> <span>/***** definition of functions *****/ </span></span><span> <span>function display() </span></span><span> <span>{ </span></span><span> <span>?></span> </span> <span><span><span><div</span> <span>style<span>="<span>text-align:center;</span>"</span></span>></span> </span> <span><span><span><h3</span>></span>TYPE THE TEXT YOU SEE IN THE IMAGE<span><span></h3</span>></span> </span> <span><span><span><b</span>></span>This is just to check if you are a robot<span><span></b</span>></span> </span> <span><span><span><div</span> <span>style<span>="<span>display:block;margin-bottom:20px;margin-top:20px;</span>"</span></span>></span> </span> <span><span><span><img</span> src<span>="image.png"</span>></span> </span> <span><span><span></div</span>></span> </span> //div1 ends <span><span><span></div</span>></span> //div2 ends </span> <span><span><?php </span></span><span> <span>} </span></span><span> </span><span> <span>function create_image() </span></span><span> <span>{ </span></span><span> <span>$image = imagecreatetruecolor(200, 50); </span></span><span> <span>imagepng($image, "image.png"); </span></span><span> <span>} </span></span><span> </span><span> <span>?></span> </span> <span><span><span></body</span>></span> </span><span><span><?php </span></span><span><span>?></span></span>
<span>$background_color = imagecolorallocate($image, 255, 255, 255); </span><span>imagefilledrectangle($image,0,0,200,50,$background_color);</span>
<span>$line_color = imagecolorallocate($image, 64,64,64); </span><span>for($i=0;$i<10;$i++) { </span> <span>imageline($image,0,rand()%50,200,rand()%50,$line_color); </span><span>}</span>
Fungsi Imagestring () menulis teks dalam imej kami. Ia mempunyai 6 argumen:
Pengiraan koordinat X dilakukan dengan pemeriksaan. Secara kasar, huruf itu jarak kira -kira 35 piksel (5 ($ i*30)) di mana $ i = 0,1,2,3,4,5,6. Ini kerana jika kita telah menyimpan nilai ini sekitar 15-20px, akan ada kemungkinan dua huruf bertindih. Sekiranya nilai itu lebih daripada 40px, huruf -huruf itu sama sekali tidak sesuai dengan kotak.
Ini akan menjana teks Captcha 6 abjad. Kami sentiasa boleh membuat lebih banyak rawak dengan mengubah aspek-aspek yang telah disimpan malar kerana kesederhanaan, seperti warna, koordinat y dan lain-lain
Captcha terakhir akan kelihatan seperti ini
Teks yang ditulis dalam Captcha akan berubah setiap kali anda menyegarkan halaman.
Mengesahkan
Dua baris yang ditinggalkan tidak dapat dijelaskan dalam coretan kod sebelumnya yang dimainkan sekarang:
$ word. = $ Huruf; - Operator Concatenation. digunakan untuk menambah semua huruf individu satu demi satu, menghasilkan perkataan 6 huruf.
dua butang hantar akan digunakan, satu untuk menyerahkan rentetan dan yang lain untuk menyegarkan halaman.
baris berikut akan ditambah di antara dua tag div penutup (lihat komen dalam fungsi paparan sebelumnya ())
<span><span><?php </span></span><span><span>session_start(); </span></span><span><span>?></span> </span> <span><span><span><title</span>></span>demo.php<span><span></title</span>></span> </span> <span><span><span><body</span> <span>style<span>="<span>background-color:#ddd; </span>"</span></span>></span> </span> <span><span><?php </span></span><span> <span>create_image(); </span></span><span> <span>display(); </span></span><span> <span>/***** definition of functions *****/ </span></span><span> <span>function display() </span></span><span> <span>{ </span></span><span> <span>?></span> </span> <span><span><span><div</span> <span>style<span>="<span>text-align:center;</span>"</span></span>></span> </span> <span><span><span><h3</span>></span>TYPE THE TEXT YOU SEE IN THE IMAGE<span><span></h3</span>></span> </span> <span><span><span><b</span>></span>This is just to check if you are a robot<span><span></b</span>></span> </span> <span><span><span><div</span> <span>style<span>="<span>display:block;margin-bottom:20px;margin-top:20px;</span>"</span></span>></span> </span> <span><span><span><img</span> src<span>="image.png"</span>></span> </span> <span><span><span></div</span>></span> </span> //div1 ends <span><span><span></div</span>></span> //div2 ends </span> <span><span><?php </span></span><span> <span>} </span></span><span> </span><span> <span>function create_image() </span></span><span> <span>{ </span></span><span> <span>$image = imagecreatetruecolor(200, 50); </span></span><span> <span>imagepng($image, "image.png"); </span></span><span> <span>} </span></span><span> </span><span> <span>?></span> </span> <span><span><span></body</span>></span> </span><span><span><?php </span></span><span><span>?></span></span>
sebelum bergerak lebih jauh kita mesti tahu bila hendak memaparkan dan apabila tidak memaparkan kotak input. Ia hanya akan dipaparkan
Keadaan pertama dipenuhi dengan menggunakan bendera $ yang ditetapkan kepada '1' setiap kali butang hantar diklik. Pada mulanya, ia telah ditetapkan kepada sebarang nilai lain. Keadaan kedua dicapai dengan menyemak sama ada nilai yang disimpan dalam pemboleh ubah sesi kami adalah sama dengan input pengguna (lihat kod di bawah).
untuk mencapai matlamat ini, kami akan menggantikan baris langkah awal kami pada permulaan artikel:
<span>$background_color = imagecolorallocate($image, 255, 255, 255); </span><span>imagefilledrectangle($image,0,0,200,50,$background_color);</span>
dengan:
<span>$line_color = imagecolorallocate($image, 64,64,64); </span><span>for($i=0;$i<10;$i++) { </span> <span>imageline($image,0,rand()%50,200,rand()%50,$line_color); </span><span>}</span>
Perhatikan bahawa fungsi create_image () dan paparan () dipanggil hanya mengikut syarat -syarat yang dibincangkan di atas.
Kami memerlukan pemboleh ubah sesi dari halaman sebelumnya, jadi sesi tidak dimusnahkan di sini. Sesi ini akan dimusnahkan secara automatik apabila tetingkap penyemak imbas ditutup.
Captcha akan kelihatan seperti ini-
Jika input betul, pengguna akan ditunjukkan mesej.
Terdapat kaveat kecil - apabila pengguna menekan butang belakang, mana -mana imej yang sudah ada di dalam cache penyemak imbas tidak akan dimuat semula, sementara halaman itu dilakukan. Dalam permintaan pos, butang Back Browser akan menunjukkan halaman "Dokumen tamat", tetapi apabila permintaan itu mendapat, imej tidak tumbuh semula.
Tambahkan baris ini di bawah mana anda memulakan sesi anda:
Gantikan tag IMG SRC dalam fungsi paparan () dengan
<span>$pixel_color = imagecolorallocate($image, 0,0,255); </span><span>for($i=0;$i<1000;$i++) { </span> <span>imagesetpixel($image,rand()%200,rand()%50,$pixel_color); </span><span>} </span>
dan bahagian di mana kita mencipta imej PNG dalam fungsi create_image () juga akan digantikan dengan
<span>$letters = 'ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz'; </span><span>$len = strlen($letters); </span><span>$letter = $letters[rand(0, $len-1)]; </span> <span>$text_color = imagecolorallocate($image, 0,0,0);</span>
imej kini akan dipanggil sesuatu seperti image39342015.png. Prosedur ini akan membuat imej seberapa banyak kali apabila halaman disegarkan yang boleh membazirkan sejumlah besar ruang cakera, jadi kami akan memastikan bahawa sebelum membuat imej, semua imej lain dari lanjutan PNG dipadamkan. Tambah yang berikut sebelum fungsi ImagePng () dipanggil.
<span>for ($i = 0; $i< 6;$i++) { </span> <span>$letter = $letters[rand(0, $len-1)]; </span> <span>imagestring($image, 5, 5+($i*30), 20, $letter, $text_color); </span> <span>$word.=$letter; </span><span>} </span><span>$_SESSION['captcha_string'] = $word;</span>
Dalam aplikasi pengeluaran, pastikan anda mengasingkan folder di mana imej Captcha disimpan lain -lain imej berguna lain mungkin akan dipadam juga.
<span>$word.=$letter; </span><span>$_SESSION['captcha_string'] = $word; </span>
Membuat pelbagai jenis Captchas dalam PHP sangat mudah. Artikel ini meliputi tiga perkara asas yang digunakan untuk mencipta CAPTCHA - bentuk, penyelewengan, dan teks standard. Artikel ini adalah bukti konsep, dan kod yang dibentangkan di sini tidak boleh digunakan dalam pengeluaran - terutamanya kerana alternatif yang sangat baik seperti Recaptcha wujud, yang juga menyokong output bunyi untuk membantu orang yang mengalami masalah pendengaran. Kami harap anda dapati artikel ini menarik. Tinggalkan komen dan maklum balas anda di bawah!
Menyesuaikan penampilan CAPTCHA anda boleh dilakukan dengan mengubah suai kod PHP. Anda boleh menukar fon, warna, saiz, dan juga latar belakang Captcha. Sebagai contoh, untuk menukar fon, anda boleh menggunakan fungsi ImagettFtext () dan tentukan fail fon dalam parameter. Untuk menukar warna, anda boleh menggunakan fungsi ImageColorAllocate () dan menentukan nilai RGB untuk warna yang anda inginkan. Ingat, penyesuaian bukan sahaja menjadikan Captcha anda lebih estetika menyenangkan tetapi juga lebih selamat terhadap bot. Salah satu cara ialah menggunakan campuran aksara alfanumerik, kedua -dua kes atas dan bawah. Ini meningkatkan bilangan kombinasi yang mungkin, menjadikannya lebih sukar untuk ditebak. Anda juga boleh meningkatkan panjang Captcha. Kaedah lain adalah untuk menambah bunyi, seperti garis atau titik, ke imej CAPTCHA. Ini boleh dilakukan menggunakan fungsi imageLine () dan imageEllipse () dalam php. beberapa sebab. Salah satu sebab yang sama ialah perpustakaan GD tidak dipasang atau didayakan dalam pemasangan PHP anda. Anda boleh menyemak ini dengan menggunakan fungsi Function_exists ('GD_INFO'). Jika ia kembali palsu, maka GD tidak didayakan. Sebab lain boleh menjadi kesilapan dalam kod PHP anda. Pastikan untuk menyemak log ralat anda untuk sebarang petunjuk.
Bolehkah saya menggunakan Captcha tanpa perpustakaan GD? Mewujudkan Captchas di PHP, ini bukan satu -satunya cara. Anda juga boleh menggunakan perpustakaan lain seperti ImageMagick atau bahkan membuat CAPTCHA berasaskan teks. Walau bagaimanapun, kaedah ini mungkin tidak memberikan tahap keselamatan dan penyesuaian yang sama seperti Perpustakaan GD.
Menambah Captcha ke borang hubungan anda melibatkan mengubah suai kod HTML dan PHP borang. Dalam HTML, anda perlu menambah tag imej untuk CAPTCHA dan medan input untuk pengguna memasukkan CAPTCHA. Di PHP, anda perlu menghasilkan CAPTCHA dan mengesahkan input pengguna. kepada beberapa sebab. Salah satu sebab yang sama ialah pembolehubah sesi tidak ditetapkan atau diambil dengan betul. Pastikan session_start () dipanggil sebelum sebarang output dihantar ke penyemak imbas dan pembolehubah sesi sedang digunakan dengan betul. Sebab lain ialah input pengguna tidak dibandingkan dengan betul dengan CAPTCHA. Pastikan anda menggunakan perbandingan kes-tidak sensitif jika captcha anda termasuk kedua-dua watak kes dan bawah. Pengguna yang cacat boleh mencabar, tetapi terdapat beberapa kaedah. Satu kaedah adalah untuk menyediakan pilihan audio captcha. Ini melibatkan menghasilkan fail audio dengan watak -watak Captcha yang dituturkan dengan kuat. Kaedah lain ialah menggunakan Captcha berasaskan soalan alternatif, di mana pengguna ditanya soalan mudah bahawa bot akan mengalami kesukaran menjawab.
Atas ialah kandungan terperinci Captchas sederhana dengan PHP dan GD. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!