How to Code a Signup Form with Email Confirmation

() translation by (you can also view the original English article)

Dalam tutorial ini, kita akan menciptakan formulir pendaftaran pengguna yang menambahkan pengguna ke database, dan kemudian mengirimkan email konfirmasi yang pengguna harus klik pada sebelum account akan diaktifkan.

Langkah 1: Template

Saya telah menyertakan tata letak situs dasar sehingga kita tidak membuang-buang waktu untuk membuat bentuk dan membuat situs terlihat cantik. Kita akan mendapatkan hak dalam pengkodean yang adalah apa yang Anda datang di sini untuk.

Membuka situs Template folder dan menyalinnya ke salah satu server web atau localhost.

Buka index.php dan mengambil cepat melihat. Anda akan melihat bentuk sederhana dengan 3 masukan. Ini adalah bidang yang kita akan menangkap. Kami ingin nama pengguna, sandi, serta email mereka. Anda dapat memilih untuk menangkap unsur-unsur lain ketika pengguna yang mendaftar, tetapi ini adalah elemen barebones 3 yang kita butuhkan.

Langkah 2: Menyiapkan MySQL Database

Buka PHPMyAdmin atau apa pun program yang Anda gunakan untuk mengelola database MySQL Anda dan membuat database baru. Anda dapat nama ini apa pun yang Anda suka. Sekarang kami ingin membuat baris yang akan terus kami informasi pengguna dan konfirmasi informasi. Untuk ini, kami membuat dua tabel. Pengguna dan mengkonfirmasi.

CREATE TABLE `users` (
  `id` int(11) NOT NULL auto_increment,
  `username` varchar(50) NOT NULL default '',
  `password` varchar(128) NOT NULL default '',
  `email` varchar(250) NOT NULL default '',
  `active` binary(1) NOT NULL default '0',
  PRIMARY KEY  (`id`)
) ENGINE=MyISAM AUTO_INCREMENT=27 DEFAULT CHARSET=utf8;

Tabel pertama kami memiliki 5 baris. Yang pertama adalah ID yang diberikan kepada pengguna ketika mereka mendaftar. Ini diatur ke otomatis kenaikan sehingga setiap pengguna diberikan id yang unik. Next is the username, password and ID. Baris terakhir Mari kita menetapkan pengguna negara aktif. Ketika kita pertama kali membuat baris pengguna, negara aktif akan default ke 0. Ini berarti bahwa account pengguna saat ini tidak aktif. Setelah pengguna menegaskan account mereka kita akan mengatur ini 1. Ini akan menyatakan bahwa rekening aktif.

CREATE TABLE `confirm` (
  `id` int(11) NOT NULL auto_increment,
  `userid` varchar(128) NOT NULL default '',
  `key` varchar(128) NOT NULL default '',
  `email` varchar(250) default NULL,
  PRIMARY KEY  (`id`)
) ENGINE=MyISAM AUTO_INCREMENT=27 DEFAULT CHARSET=utf8;

Tabel kedua kami adalah tabel konfirmasi. Ini memegang ID pengguna dan email serta kunci dihasilkan secara acak yang akan kita gunakan untuk account pengguna.

Langkah 3: Menghubungkan ke MySQL Database

Buka inc/php/config.php.

Pertama kita perlu membuat sambungan ke database.

1	mysql_connect('localhost', 'username', 'password') or die("I couldn't connect to your database, please make sure your info is correct!");

Tergantung pada konfigurasi Anda, kita akan perlu mengubah beberapa variabel. Jadi maju dan mengisi dalam segala hal.

Selanjutnya kita perlu memberitahu MySQL database yang kita ingin menggunakan.

1	mysql_select_db('your_database_name') or die("I couldn't find the database table make sure it's spelt right!");

Setelah semuanya telah diedit agar sesuai database Anda pergi ke depan dan arahkan ke file index.php pada server Anda.

Jika Anda tidak melihat kesalahan apapun di atas, kita semua terhubung.

Langkah 4: Menyerahkan formulir

OK, sekarang bahwa kita semua terhubung ke database, kita perlu untuk menangkap data formulir sehingga kita bisa mendapatkan pengguna mendaftar.

Aku akan memberikan potongan kode dan kemudian menjelaskan apa yang terjadi. Setelah itu kita akan membuat perubahan dan menambah fungsionalitas.

Here is the base; place this right after the first includes at the top of index.php

1	//check if the form has been submitted
2	if(isset($_POST['signup'])){
3
4	}

Ini jika pernyataan memeriksa untuk melihat jika formulir sudah diserahkan.

Tanpa ini, script kami akan dijalankan setiap kali halaman di-refresh dan kami tidak ingin.

Tanpa ini, script kami akan dijalankan setiap kali halaman di-refresh dan kami tidak ingin. Saya telah meletakkan kode semua dalam satu file untuk menjaga hal-hal sederhana dan mudah untuk mengikuti bersama.

Langkah 5: Membersihkan dan memeriksa variabel

Kami ingin memastikan bahwa pengguna mengirimkan konten yang sebenarnya bukan hanya suatu bentuk kosong, jadi kami akan melakukan beberapa pemeriksaan cepat.

Bagian pertama adalah untuk menempatkan variabel $_POST ke variabel yang sederhana dan bersih mereka untuk database. Tempat ini di dalam kami jika pernyataan.

1	$username = mysql_real_escape_string($_POST['username']);
2	$password = mysql_real_escape_string($_POST['password']);
3	$email = mysql_real_escape_string($_POST['email']);

mysql_real_escapse_string() memastikan bahwa pengguna tidak mencoba menggunakan apostrof untuk mengakses database kami dengan MySQL injeksi. Setiap kali Anda ingin menempatkan informasi ke dalam database pengguna memiliki diinputkan, silahkan menjalankannya melalui mysql_real_escape_string(). Untuk informasi lebih lanjut tentang injeksi MySQL Anda dapat membaca artikel di Wikipedia

Jadi, kita telah membersihkan variabel kami, sekarang mari kita periksa untuk melihat jika pengguna lupa bidang apapun.

1	if(empty($username)){ //put code in me please }
2	if(empty($password)){ //put code in me please }
3	if(empty($email)){ //put code in me please }

Sekarang kita memiliki tiga jika pernyataan yang akan memeriksa apakah masing-masing bidang kosong. Jika bidang kosong kita akan menetapkan beberapa variabel.

Untuk membuat hal-hal membersihkan kita akan menciptakan array yang akan memegang status proses pendaftaran serta teks kita perlu menunjukkan pengguna.

Right above that piece of code, let's create an array and a few variables.

1	$action = array();
2	$action['result'] = null;
3
4	$text = array();

Pertama kami menciptakan sebuah array kosong yang disebut Aksi dan kemudian menetapkan nilai array hasil. Hasil akan memegang nilai sukses atau kesalahan. Selanjutnya kita menciptakan array kosong lain yang disebut teks. Ini akan terus teks apapun yang kita ingin menunjukkan pengguna selama pendaftaran.

Sekarang, kami jika laporan yang Check variabel kami tidak menjalankan salah satu kode, jadi mari kita pergi ke depan dan menaruh beberapa kode dalam pertama jika pernyataan.

Put this code inside the username if statement.

1	$action['result'] = 'error';
2	array_push($text,'You forgot your username');

Katakanlah pengguna mengirimkan formulir tanpa nama pengguna. Pernyataan kami akan menjalankan kode diatas. Pertama ini akan menyetel kolom hasil dari array tindakan kita untuk kesalahan.

Kemudian kita akan menggunakan array_push() untuk meletakkan beberapa teks ke dalam array teks kami. Kita akan menggunakan potongan kode ini sama untuk kedua akhir "jika" pernyataan jadi copy dan paste kode ke dua jika pernyataan. You'll probably want to change the text to match the current if statement.

Catatan: Kami menggunakan array_push() jika kita memiliki beberapa kesalahan dalam data pada form. Jika semua jika pernyataan dijalankan, teks array akan terlihat seperti:

Array(
  [0] => 'You forgot your username',
	[1] => 'You forgot your password',
	[2] => 'You forgot your email'
)

We now need to check if we have any errors so we can continue on with the signup process.

Step 6: No Errors, Let's Signup the User

Kita akan memeriksa untuk melihat apakah nilai hasil tindakan array ditetapkan kesalahan.

if($action['result'] != 'error'){
	//no errors, continue signup
       $password = md5($password);
}
	
$action['text'] = $text;

Kami juga menjalankan sandi kami melalui fungsi md5(). Ini mengambil password dan mengembalikan sebuah string 32 karakter yang terlihat seperti ini: a3470ce826283eca7ce3360d0f26b230. Itu adalah praktik yang baik untuk menjalankan password melalui semacam hashing fungsi sebelum memasukkannya ke dalam database. This prevents people from viewing the users passwords if your database is hacked.

Dengan cepat memeriksa hasil tindakan kami nilai dan kami dapat melanjutkan dengan pendaftaran. Jika hasilnya kita adalah kesalahan yang kita akan melewatkan semua kode ini dan output kesalahan untuk pengguna kami sehingga mereka dapat membuat perubahan yang diperlukan.

Bagian terakhir dari kode ini kami menempatkan nilai-nilai array teks Anda ke dalam array tindakan kita.

Langkah 7: Menambahkan pengguna ke Database

Letakkan kode ini di dalam kami terakhir jika pernyataan.

...
If Statement checking for errors
...

//add to the database
$add = mysql_query("INSERT INTO `users` VALUES(NULL,'$username','$password','$email',0)");
		
if($add){

	//the user was added to the database	
			
}else{
		
	$action['result'] = 'error';
	array_push($text,'User could not be added to the database. Reason: ' . mysql_error());
	=
}

Kami menggunakan mysql_query() dan INSERT untuk memasukkan informasi pengguna ke database. Selanjutnya, kita membuat lain jika pernyataan memeriksa untuk melihat jika pengguna telah ditambahkan ke database. Kita melakukan ini dengan memeriksa jika variabel $add true atau false.

Jika pengguna menambahkan kita dapat melanjutkan dengan pendaftaran; Kalau tidak kita akan menetapkan beberapa variabel yang akrab dan menghentikan pendaftaran.

Ketika bekerja dengan MySQL permintaan, kami menggunakan fungsi mysql_error() jika ada kesalahan karena membantu dengan debug apa salah dengan pertanyaan Anda. Ini akan menampilkan teks kesalahan ketika ada sesuatu salah. Ini bagus!

Langkah 8: Konfirmasi diperlukan

Pengguna telah mengajukan bentuk, semuanya ternyata dan sekarang mereka tinggal dalam database. We want the user to be able to use their account, so let's setup the confirmation.

...
if added check
...

//get the new user id
$userid = mysql_insert_id();
			
//create a random key
$key = $username . $email . date('mY');
$key = md5($key);
			
//add confirm row
$confirm = mysql_query("INSERT INTO `confirm` VALUES(NULL,'$userid','$key','$email')");	
			
if($confirm){
			
	//let's send the email

}else{
				
	$action['result'] = 'error';
	array_push($text,'Confirm row was not added to the database. Reason: ' . mysql_error());
				
}

Untuk membuat hal-hal mudah, mari kita menetapkan id pengguna baru ke variabel sehingga kita dapat menggunakannya nanti. We do this by using mysql_insert_id(). Ini akan menetapkan $userid untuk apa pun ID pengguna baru.

Next we create the random key for that specific user. Kami menciptakan sebuah variabel yang bernama kunci dan mengisinya dengan nilai username, email dan tanggal. String akan terlihat seperti mattmatt@email.com012009. After that we use the md5() function to convert it to a random string that is unique to that user.

Menggunakan mysql_query() dan masukkan lagi, kami menempatkan ID pengguna baru, kunci dan pengguna email ke dalam database.

Langkah 9: Pengaturan template Email

Kita akan mengambil istirahat dari PHP coding dan menciptakan dua file baru. Demi menjadi cepat dan mudah kita benar-benar akan menggunakan dua template yang saya telah menyertakan dengan tutorial ini. Dua file yang kita akan melihat adalah signup_template.html dan signup_template.txt. Swift Mari kita menetapkan HTML serta versi TXT email memetikan pengguna klien email tidak mendukung HTML email.

Open up signup_template.html Note: You can read up on HTML in emails over at carsonified. Kami tidak akan dapat mengedit file ini, saya hanya akan menjelaskan whats terjadi, dan kemudian Anda dapat bermain-main dengan itu setelah tutorial lengkap. Bagian yang paling penting dari file ini adalah tag yang terlihat seperti {USERNAME} dan confirm.php?email={EMAIL}&key={KEY}. We are going to write a function that uses this template and replaces those tags with the variables from our form.

Langkah 10: Fungsi Template

Buka inc/php/functions.php dan menempatkan kode ini di dalam.

function format_email($info, $format){

	//set the root
	$root = $_SERVER['DOCUMENT_ROOT'].'/dev/tutorials/email_signup';

	//grab the template content
	$template = file_get_contents($root.'/signup_template.'.$format);
			
	//replace all the tags
	$template = ereg_replace('{USERNAME}', $info['username'], $template);
	$template = ereg_replace('{EMAIL}', $info['email'], $template);
	$template = ereg_replace('{KEY}', $info['key'], $template);
	$template = ereg_replace('{SITEPATH}','https://site-path.com', $template);
		
	//return the html of the template
	return $template;

}

format_email() is taking two variables which will be used in index.php. Yang pertama adalah kami bentuk informasi array dan yang kedua adalah format. We have a format variable so we can re-use this array for both the HTML and TXT versions of the template.

Pertama kita membuat akar. Ini menunjuk ke folder bahwa template yang di-host.

Selanjutnya kita membuka isi dari template kami dan menetapkannya ke variabel.

Now we are going to use ereg_replace() to replace our {USERNAME} tags in our template with the content from our form. Hal ini pada dasarnya hanya sebuah sistem template super sederhana.

Lastly we return the template variable which holds all the html.

Explanation: In a nutshell, format_email() opens up our template files, takes the HTML and assigns it to our variable. This is just a cleaner way then assigning all the HTML in the function itself.

Langkah 11: Mengirim Email

Kami akan menulis fungsi lain untuk berurusan dengan Swift dan mengirim email.

function send_email($info){
		
	//format each email
	$body = format_email($info,'html');
	$body_plain_txt = format_email($info,'txt');

	//setup the mailer
	$transport = Swift_MailTransport::newInstance();
	$mailer = Swift_Mailer::newInstance($transport);
	$message = Swift_Message::newInstance();
	$message ->setSubject('Welcome to Site Name');
	$message ->setFrom(array('noreply@sitename.com' => 'Site Name'));
	$message ->setTo(array($info['email'] => $info['username']));
	
	$message ->setBody($body_plain_txt);
	$message ->addPart($body, 'text/html');
			
	$result = $mailer->send($message);
	
	return $result;
	
}

Just like format_email(), send_email() takes our info array as a variable. Bagian pertama dari fungsi kami menetapkan dua variabel, $body dan $body_plain_text. Kami menggunakan format_email() untuk menetapkan nilai-nilai HTML template kami untuk setiap variabel. Sekarang datang bagian yang baik. Kami memiliki setup contoh cepat menggunakan Swift_MailTransport:newInstance() dan kemudian setup mailer menggunakan Swift_Mailer::newInstance($transport);

Kita membuat sebuah instance baru dari pesan cepat dan mulai menetapkan beberapa variabel untuk contoh ini. Kami menetapkan subjek, dari email dan untuk alamat email dan kemudian menggunakan setBody() untuk menetapkan keluar versi teks email untuk contoh mailer. To add the HTML version we use addPart(). Fungsi send() mengurus pengiriman email dan kemudian kita kembali hasilnya. Alright, we have our email create and send functions written, let's go back to index.php and start to wrap up the main signup.

Langkah 12: Apakah kita mengirim? Akan kami konfirmasikan?

Bit terakhir kami seharusnya sudah jika pernyataan memeriksa jika baris konfirmasi diciptakan.

Mari kita mengirim email dan periksa jika semuanya berjalan meskipun baik-baik saja.

...
if confirm
...

//include the swift class
include_once 'inc/php/swift/swift_required.php';
			
//put info into an array to send to the function
$info = array(
	'username' => $username,
	'email' => $email,
	'key' => $key
);
			
//send the email
if(send_email($info)){
								
	//email sent
	$action['result'] = 'success';
	array_push($text,'Thanks for signing up. Please check your email for confirmation!');
				
}else{
					
	$action['result'] = 'error';
	array_push($text,'Could not send confirm email');
				
}

Tanpa kelas Swift kami tidak mengirimkan email, jadi di baris pertama kami, kami sudah termasuk kelas cepat. Kita perlu mengirim informasi kami untuk kedua fungsi baru kami, jadi kami menciptakan array baru dan menetapkan variabel kami untuk itu. Aku tahu aku tahu, lebih jika laporan, tetapi kita perlu memeriksa kesalahan untuk membuatnya lebih mudah bagi pengguna. You always have to assume that users will make every possible mistake imaginable.

Kami membungkus fungsi send_email() kami di lain jika pernyataan serta melewati $info array. Jika email dikirim kami menetapkan nilai sukses dan terima pengguna untuk mendaftar. If there are errors we use the familiar variables. Jadi sekarang, kita hampir selesai dengan pendaftaran, hanya satu fungsi perlu dibuat. Meskipun kami menugaskan semua variabel kesalahan sukses dan teks kita belum ditampilkan informasi ini kepada pengguna.

Pindah kembali ke functions.php dan paste kode ini.

//cleanup the errors
function show_errors($action){

	$error = false;

	if(!empty($action['result'])){
	
		$error = "<ul class=\"alert $action[result]\">"."\n";

		if(is_array($action['text'])){
	
			//loop out each error
			foreach($action['text'] as $text){
			
				$error .= "<li><p>$text</p></li>"."\n";
			
			}	
		
		}else{
		
			//single error
			$error .= "<li><p>$action[text]</p></li>";
		
		}
		
		$error .= "</ul>"."\n";
		
	}

	return $error;

}

This may seem confusing but it's really just making our success/errors looks nice.

Pertama-tama memeriksa untuk melihat apakah array kosong sehingga kami tidak mengeksekusi kode yang ketika itu tidak diperlukan.

Berikut ini menciptakan sebuah tag ul dan berlaku hasil sebagai kelas. Ini akan menjadi sukses atau kesalahan dan estetika hanya.

We then check to see if the text variable is an array or simply a string. Jika sebuah string, kita bungkus di li. If it's an array we loop through each array item and wrap it in an li.

Terakhir, kita menutup ul dan kembali seluruh string.

Jika kita kembali ke index.php dan tempatkan kode tepat setelah termasuk header.php kami dapat membungkus bagian ini.

...
header include
...

<?= show_errors($action); ?>

Sedikit penjelasan singkat. Kami mengambil semua nilai array tindakan kita dan menyerahkannya ke fungsi show_errors(). Jika ada konten mengembalikan sebuah daftar unordered.

Step 13: Confirming the User

Kita harus memiliki pegangan yang baik pada bagaimana script berfungsi; Jadi script ini berikutnya aku akan memberikan seluruh potongan kode dan kemudian pergi melalui itu dengan Anda.

Buka confirm.php dan paste ini antara termasuk header dan fungsi show_errors() Anda.

//setup some variables
$action = array();
$action['result'] = null;

//quick/simple validation
if(empty($_GET['email']) || empty($_GET['key'])){
	$action['result'] = 'error';
	$action['text'] = 'We are missing variables. Please double check your email.';			
}
		
if($action['result'] != 'error'){

	//cleanup the variables
	$email = mysql_real_escape_string($_GET['email']);
	$key = mysql_real_escape_string($_GET['key']);
	
	//check if the key is in the database
	$check_key = mysql_query("SELECT * FROM `confirm` WHERE `email` = '$email' AND `key` = '$key' LIMIT 1") or die(mysql_error());
	
	if(mysql_num_rows($check_key) != 0){
				
		//get the confirm info
		$confirm_info = mysql_fetch_assoc($check_key);
		
		//confirm the email and update the users database
		$update_users = mysql_query("UPDATE `users` SET `active` = 1 WHERE `id` = '$confirm_info[userid]' LIMIT 1") or die(mysql_error());
		//delete the confirm row
		$delete = mysql_query("DELETE FROM `confirm` WHERE `id` = '$confirm_info[id]' LIMIT 1") or die(mysql_error());
		
		if($update_users){
						
			$action['result'] = 'success';
			$action['text'] = 'User has been confirmed. Thank-You!';
		
		}else{

			$action['result'] = 'error';
			$action['text'] = 'The user could not be updated Reason: '.mysql_error();;
		
		}
	
	}else{
	
		$action['result'] = 'error';
		$action['text'] = 'The key and email is not in our database.';
	
	}

}

Sebagian besar ini harus sangat akrab; Jadi aku akan melompat ke depan dan memeriksa apakah tombol di bagian database.

Sekali lagi, kita menggunakan mysql_query() untuk mendapatkan setiap baris dalam database mana email dan kunci yang sama dengan tombol yang disediakan oleh pengguna email.

We use mysql_num_rows() to check if the number of rows returned is greater than 0.

Jika email dan kunci dalam database kami ambil semua informasi dari database menggunakan mysql_fetch_assoc().

Sekarang bahwa pengguna telah dikonfirmasi account-nya, kita perlu untuk mengupdate database dan baris yang aktif untuk 1.

Kami menggunakan mysql_query() lagi, tapi bukannya INSERT kami menggunakan UPDATE untuk memperbarui baris aktif 1 mana ID pengguna adalah sama dengan ID pengguna kami saat ini

Untuk membersihkan semuanya kami menggunakan mysql_query() dan Hapus untuk menghapus baris konfirmasi dari database. This makes sure that the user can't come back to this page and reconfirm. Itu juga membuat database bagus dan bersih.

Kesimpulan

Kita telah membahas berbagai bidang dalam tutorial ini. Kita download dan termasuk script pihak ke-3 untuk berurusan dengan mengirimkan email, dilaksanakan validasi form sederhana serta menciptakan sistem template super sederhana untuk gaya email kami. If you're new to MySQL we've touched on the three most common functions in MySQL so you should have no problem completing some more advanced tutorials.

Catatan akhir

I've used Swift Mailer as our email deployment script which can be downloaded here: http://swiftmailer.org/
I've also used button styles provided by Zurb. Pastikan untuk memeriksa mereka dan memberi mereka beberapa cinta. http://www.zurb.com/blog_uploads/0000/0485/buttons-02.html

Terima kasih untuk membaca dan pastikan untuk mengunjungi saya di Twitter jika Anda memiliki pertanyaan!