Как закодировать регистрационную форму с подтверждением электронной почты

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

В этом учебном пособии мы собираемся создать форму регистрации пользователя, которая добавляет пользователя в базу данных, а затем отправляет электронное письмо с подтверждением, которое пользователь должен щелкнуть, прежде чем их учетная запись будет активирована.

Шаг 1: Макет

Я включил базовый макет сайта, поэтому мы не теряем время, создавая форму и делая сайт красивым. Мы собираемся получить право на кодирование, которое вам нужно.

Откройте папку «Макет сайта» и скопируйте ее на локальный или веб-сервер.

Откройте index.php и быстро просмотрите. Вы увидите простую форму с тремя входами. Это поля, которые мы собираемся захватить. Нам нужны имя пользователя, пароль, а также их электронная почта. Вы можете выбрать захват других элементов, когда пользователи подписываются, но это 3 основных элемента, которые нам нужны.

Шаг 2: Настройка базы данных MySQL

Откройте PHPMyAdmin или любую другую программу, которую вы используете для управления своей базой данных MySQL и создайте новую базу данных. Вы можете назвать это как хотите. Теперь мы хотим создать строки, которые будут содержать информацию о пользователе и информацию о подтверждении. Для этого мы создаем две таблицы. Пользователи и Подтверждение.

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;

Наша первая таблица имеет 5 строк. Первая - это идентификатор, который предоставляется пользователю при регистрации. Устанавливается автоматическое увеличение, чтобы каждому пользователю был присвоен уникальный идентификатор. Далее указаны имя пользователя, пароль и идентификатор. Последняя строка позволяет нам установить активное состояние пользователей. Когда мы сначала создаем строку пользователя, активное состояние будет по умолчанию равно 0. Это означает, что учетная запись пользователей в настоящее время неактивна. Как только пользователь подтвердит свою учетную запись, мы установим ее в 1. При этом будет указано, что учетная запись активна.

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;

Наша вторая таблица - таблица подтверждения. Это содержит ID пользователя и адрес электронной почты, а также случайно сформированный ключ, который мы будем использовать для подтверждения учетной записи пользователя.

Шаг 3: Подключение к базе данных MySQL

Откройте файл inc/php/config.php.

Сначала нам нужно подключиться к базе данных.

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

В зависимости от вашей настройки нам нужно будет изменить несколько переменных. Так что продолжайте и заполните все.

Затем нам нужно указать MySQL, какую базу данных мы хотим использовать.

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

Как только все будет отредактировано в соответствии с вашей базой данных, перейдите к файлу index.php на своем сервере.

Если вы не видите ошибок наверху, мы все подключены.

Шаг 4: Отправка формы

Итак, теперь, когда все мы подключены к базе данных, нам нужно зафиксировать данные формы, чтобы мы могли зарегистрировать пользователя.

Я дам вам фрагмент кода, а затем объясню, что происходит. После этого мы собираемся внести изменения и добавить функциональность.

Вот база; поместите это право после первого включения в начало index.php

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

Это если оператор проверяет, была ли форма отправлена.

Без этого наш скрипт будет запускаться каждый раз, когда страница обновляется, а мы этого не хотим.

Примечание. В зависимости от вашего приложения или просто общего стиля кодирования этот код может быть помещен в отдельный файл, доступ к которому при отправке формы. Я поместил код в один файл, чтобы было просто и легко следовать.

Шаг 5: Очистка и проверка переменных

Мы хотим убедиться, что пользователь отправил фактический контент вместо простой формы, поэтому мы будем выполнять некоторые быстрые проверки.

Первая часть - поместить переменные $ _POST в более простые переменные и очистить их из базы данных. Поместите это внутри нашего if изложения.

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() гарантирует, что пользователь не пытается использовать апострофы для доступа к нашей базе данных с использованием MySQL. Всякий раз, когда вы хотите поместить информацию в базу данных, которую пользователь ввел, запустите ее через mysql_real_escape_string (). Для получения дополнительной информации о внедрении MySQL вы можете прочитать эту статью в Википедии

Итак, мы очистили наши переменные, теперь давайте проверим, не забыл ли пользователь заполнить какие-либо поля.

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 }

Теперь у нас есть три оператора if, которые проверяют, пусто ли каждое поле. Если поле пусто, мы будем назначать некоторые переменные.

Чтобы сделать вещи чистыми, мы собираемся создать таблицу, которая будет содержать статус процесса регистрации, а также любой текст, который нам нужно показать пользователю.

Прямо над этой частью кода, давайте создадим массив и несколько переменных.

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

Сначала мы создаем пустой бланк, называемый действием, а затем устанавливаем значение результата бланка. Результат будет содержать значение либо успеха, либо ошибки. Затем мы создаем еще один пустой бланк, называемый текстом. В нем будет содержаться любой текст, который мы хотим показать пользователю во время регистрации.

Прямо сейчас наши формулировки if, которые проверяют наши переменные, не выполняют какой-либо код, так что давайте продолжим и поместим некоторый код в первый оператор if.

Поместите этот код внутри имя пользователя if оператора.

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

Допустим, пользователь отправляет форму без имени пользователя. В нашем заявлении будет приведен код выше. Сначала это приведет к ошибке поля результатов наших действий.

Затем мы будем использовать array_push (), чтобы поместить некоторый текст в нашу текстовую таблицу. Мы собираемся использовать этот же фрагмент кода для последних двух операторов if, чтобы скопировать и вставить этот код в последние два оператора if. Вероятно, вы захотите изменить текст в соответствии с текущим оператором if.

Примечание. Мы используем array_push (), если у нас есть несколько ошибок в представлении формы. Если выполняются все операторы if, текстовая таблица будет выглядеть так:

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

Теперь нам нужно проверить, есть ли у нас какие-либо ошибки, чтобы мы могли продолжить процесс регистрации.

Шаг 6: Нет ошибок, тогда регистрируем пользователя

Мы попытаемся проверить, установлено ли значение результата таблицы действий для ошибки.

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

Мы также запускаем наш пароль через функцию md5(). Это берет пароль и возвращает строку с 32 символами, которая выглядит примерно так: a3470ce826283eca7ce3360d0f26b230. Хорошей практикой является запуск пароля с помощью какой-либо функции запутывания перед тем, как поместить его в базу данных. Это предотвращает просмотр пользователями паролей пользователей, если ваша база данных взломана.

Быстрая проверка значения результата действия, и мы можем продолжить регистрацию. Если наш результат является ошибкой, мы пропустим весь этот код и выведем ошибки нашему пользователю, чтобы они могли внести необходимые изменения.

В последнем фрагменте этого кода мы помещаем значения вашего текстового бланка в нашу таблицу действий.

Шаг 7: Добавление пользователя в базу данных

Поместите этот код в наш последний оператор if.

...
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());
	=
}

Мы используем mysql_query() и INSERT для вставки информации о пользователях в базу данных. Затем мы создаем другую инструкцию if, чтобы проверить, был ли пользователь добавлен в базу данных. Мы делаем это, проверяя, является ли переменная $add истинной или ложной.

Если пользователь добавлен, мы можем продолжить регистрацию; если нет, мы устанавливаем некоторые знакомые переменные и останавливаем регистрацию.

При работе с MySQL-запросами мы используем функцию mysql_error(), если они являются ошибками, потому что они помогают отлаживать ошибки в ваших запросах. Он выдает текстовые ошибки, когда что-то не так. Это хорошо!

Шаг 8: требуется подтверждение

Пользователь отправил форму, все проверяется, и теперь они находятся в базе данных. Мы хотим, чтобы пользователь мог использовать свою учетную запись, поэтому давайте настроим подтверждение.

...
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());
				
}

Чтобы упростить задачу, давайте присвоем новый идентификатор пользователя переменной, чтобы мы могли использовать его позже. Мы делаем это с помощью mysql_insert_id(). Это установит $userid на любой идентификатор нового пользователя.

Затем мы создаем случайный ключ для этого конкретного пользователя. Мы создаем переменную с именем key и заполняем ее значением имени пользователя, электронной почты и даты. Строка будет выглядеть как mattmatt@email.com012009. После этого мы используем функцию md5(), чтобы преобразовать ее в случайную строку, уникальную для этого пользователя.

С помощью mysql_query() и INSERT мы добавим новый идентификатор пользователя, ключ и адрес электронной почты пользователей в базу данных.

Шаг 9: Настройка шаблонов электронной почты

Мы собираемся сделать перерыв в PHP-кодировании и создать два новых файла. Чтобы все было быстро и легко, мы фактически будем использовать два шаблона, которые я включил в это учебное пособие. Два файла, которые мы будем смотреть, - signup_template.html и signup_template.txt. Swift позволяет нам назначать HTML, а также версию TXT электронной почты, если клиент электронной почты не поддерживает HTML-письма.

Откройте signup_template.html Примечание. Вы можете читать HTML в письмах по адресу carsonified. Мы не собираемся редактировать этот файл, я просто собираюсь объяснить, что происходит, а затем вы можете поиграть с ним после завершения учебника. Наиболее важной частью этого файла являются теги, которые выглядят как {USERNAME} и confirm.php? Email = {EMAIL} & key = {KEY}. Мы собираемся создать функцию, которая использует этот шаблон, и заменяет эти теги на переменные из нашей формы.

Шаг 10: Функция шаблона

Откройте inc / php / functions.php и поместите этот код внутрь.

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}','http://site-path.com', $template);
		
	//return the html of the template
	return $template;

}

format_email() принимает две переменные, которые будут использоваться в index.php. Первый - это наша таблица формы информации, а второй - формат. У нас есть переменная формата, поэтому мы можем повторно использовать этот бланк для HTML и TXT-версий шаблона.

Сначала мы установим источник. Это указывает на папку, в которой размещаются шаблоны.

Затем мы открываем содержимое нашего шаблона и присваиваем его к переменной.

Теперь мы будем использовать ereg_replace(), чтобы заменить наши теги {USERNAME} в нашем шаблоне содержимым из нашей формы. Это просто супер простая система шаблонов.

Наконец, мы возвращаем шаблонную переменную, которая содержит все html.

Объяснение: В двух словах format_email() открывает наши файлы шаблонов, берет HTML и присваивает его нашей переменной. Это просто более чистый способ, чем присвоение всего HTML в самой функции.

Шаг 11: Отправка электронной почты

Мы собираемся создать еще одну функцию для работы с Swift и отправки электронных писем.

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;
	
}

Подобно format_email(), send_email() принимает наш информационный бланк как переменную. В первой части функции мы назначаем две переменные: $ body и $body_plain_text. Мы используем format_email() для назначения значений HTML нашего шаблона для каждой переменной. Сейчас начинается хорошая часть. Мы установили быстрый экземпляр с помощью Swift_MailTransport: newInstance(), а затем настроили почтовую программу с помощью Swift_Mailer :: newInstance ($transport);

Мы создаем новый экземпляр сообщения Swift и начинаем назначать некоторые переменные этому экземпляру. Мы задаем тему, начиная с электронной почты и по электронной почте, а затем с помощью setBody() назначаем текстовую версию письма экземпляру почтовой программы. Чтобы добавить HTML-версию, мы используем addPart(). Функция send() выполняет посылку сообщения электронной почты, а затем возвращает результат. Хорошо, у нас есть электронная почта для создания и отправки написанных функций, вернемся к index.php и начнем завершать основную регистрацию.

Шаг 12: Мы отправили? Должны ли мы подтверждать?

Наш последний бит должен был быть оператором if, проверяющим, была ли создана строка подтверждения.

Давайте отправим электронное письмо и проверьте, все ли в порядке.

...
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');
				
}

Без класса Swift мы не можем отправлять какие-либо письма, поэтому в нашей первой строке мы включаем быстрый класс. Нам нужно отправить нашу информацию в обе наши новые функции, поэтому мы создаем новую таблицу и вписываем свои переменные. Я знаю, знаю, хотя больше утверждаю, но нам нужно проверить ошибки, чтобы было легче пользователям. Вы всегда должны предполагать, что пользователи сделают все возможное, чтобы вообразить.

Мы завершаем нашу функцию send_email() в другом операторе if, а также передаем массив $info. Если письмо отправлено, мы присваиваем значение успеха и благодарим пользователя за регистрацию. Если есть ошибки, мы используем знакомые переменные. Итак, теперь мы почти закончили регистрацию, нужно создать только одну последнюю функцию. Несмотря на то, что мы назначаем все эти переменные и текст ошибки / успех, мы не отображали эту информацию для пользователя.

Вернитесь к functions.php и вставьте этот код.

//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;

}

Это может показаться запутанным, но на самом деле это просто наши успехи / ошибки более лучше выглядят.

Сначала он проверяет, свободен ли бланк, поэтому мы не выполняем код, когда он не нужен.

Затем он создает тег ul и применяет результат как класс. Это будет либо успешным, либо ошибочным и только эстетическим.

Затем мы проверяем, является ли текстовая переменная таблицей или просто строкой. Если это строка, мы завершаем ее в li. Если это таблица, мы прокручиваем каждый элемент таблицы и завершаем ее в li.

Наконец, мы закрываем ul и возвращаем всю строку.

Если мы вернемся к index.php и поместим этот код сразу после включения header.php, мы можем завершить этот раздел.

...
header include
...

<?= show_errors($action); ?>

Быстрое маленькое объяснение. Мы берем все значения нашей таблицы действий и передаем его функции show_errors(). Если есть какой-либо контент, он возвращает хороший неупорядоченный список.

Шаг 13: Подтверждение пользователя

Мы должны хорошо контролировать работу скрипта; поэтому для этого следующего сценария я собираюсь дать вам весь фрагмент кода, а затем перейду через него с вами.

Откройте файл confirm.php и вставьте это между заголовком include и вашей функцией show_errors().

//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.';
	
	}

}

Большая часть этого должна показаться очень знакомой; поэтому я собираюсь пропустить вперед и проверить, находится ли ключ в разделе базы данных.

Опять же, мы используем mysql_query() для получения любых строк в базе данных, где электронная почта и ключ равны ключам, предоставленным электронной почтой пользователей.

Мы используем mysql_num_rows(), чтобы проверить, сколько возвращаемых строк больше 0.

Если электронная почта и ключ находятся в базе данных, мы извлекаем всю информацию из базы данных с помощью mysql_fetch_assoc().

Теперь, когда пользователь подтвердил свою учетную запись, нам нужно обновить базу данных и установить активную строку в 1.

Мы снова используем mysql_query(), но вместо INSERT мы используем UPDATE для обновления активной строки до 1, где идентификатор пользователя совпадает с нашим текущим идентификатором пользователя.

Чтобы очистить все, мы используем mysql_query() и DELETE, чтобы удалить строку подтверждения из базы данных. Это гарантирует, что пользователь не сможет вернуться на эту страницу и подтвердить. Он также сохраняет базу данных красивой и чистой.

Заключение

В этом уроке мы рассмотрели множество разных областей. Мы загрузили и включили сторонний скрипт для обработки электронной почты, внедрения простой проверки формы, а также создали супер простую систему шаблонов для стилей наших писем. Если вы новичок в MySQL, мы затронули три наиболее распространенные функции в MySQL, поэтому у вас не должно возникнуть проблемы с выполнением некоторых более сложных обучающих программ.

Итоговые заметки

Я использовал Swift Mailer в качестве нашего сценария развертывания электронной почты, который можно скачать здесь: http://swiftmailer.org/
Я также использовал стили кнопок, предоставленные Zurb. Обязательно проверьте их и дайте им немного любви. http://www.zurb.com/blog_uploads/0000/0485/buttons-02.html

Спасибо за чтение и обязательно посетите меня в Twitter, если у вас есть вопросы!