青小蛙の博客

网站联系表单的实现-写给设计师的技术文档

青小蛙 网络Mail

我们在设计企业或个人站点的过程中,有时会需要添加一个联系表单,用于用户反馈信息给网站。比如:常见的“联系我们”的板块中:

多终端示例

做为非技术出身的设计师,我们可以用 Adobe Muse 等实现静态站点的建设,但表单发送涉及到后端PHP等技术问题,这些设计软件就无能为力了。那么,这个问题我们怎么解决呢?

通过 Google 我们发现关于这方面的教程数不胜数,但没有一个是写给设计师看的;对于没有编程基础的人来说,都写的过于简略。好在他们大多都提到了 PHPMailer 的程序,毕竟找对方向是最重要的。PHPMailer 是一个功能强大的电子邮件发送库,可以跨平台在各种服务器上面部署,并且支持 LGPL 2.1 开源协议(想要了解更多可以去他们的 Github 站点)。我们要实现的功能只涉及其中很少一部分,下面我们就来讲详细的设置步骤。

首先我们需要”邮件发送服务器”

国内支持 SMTP 邮件传输协议的第三方邮箱有很多,我们首先以QQ邮箱为例:进入邮箱点击页面左上方“设置”,再点击“邮箱设置”下的“账户”选项卡,下拉选择 SMTP 设置,并开启。这时会跳出验证,并给出授权码,我们把它复制下来,后面要用到!

网易邮箱开启 SMTP 的步骤基本相似:进入邮箱点击页面上方“设置”,选择“POP3/SMTP/IMAP”选项,然后勾选“POP3/SMTP服务”。如果你设置了密保,这时会跳出验证,网易邮箱是让用户自己设置第三方客户端授权码,设置自己的授权码(要记好了)点击确定。

使用 PHPMailer 来实现表单的接收发送

因为 PHPMailer 需 PHP 的 socket 扩展支持,而国内多数服务商对虚拟主机有各种限制,所以我们首先要确认服务器是否开启了 fsockopen ,登录虚拟主机控制台查看 php.ini 参数设置,找到 PHP 函数 fsockopen ,并开启。

在这里,假如你用的是QQ邮箱,QQ邮箱用的是ssl加密方式(只允许ssl的465或587端口),那么就需要虚拟主机中的php支持openssl扩展(国内有部分虚拟主机不支持);如不支持,你就只能用支持 25 端口的邮箱了,如上面提到的网易邮箱。

去 PHPMailer 的 Github 站点 https://github.com/PHPMailer/PHPMailer/ ,选择右上角 Clone or download 点击 Download ZIP 下载压缩包。

下载完成并解压,在 examples 文件夹中找到文件 smtp.phps,修改文件名为 contact_me.php(可以自己随意命名)。然后按照下面说明编辑添加 contact_me.php 文件关键代码:

<?php
//引入PHPMailer的核心文件,使用require_once包含避免出现PHPMailer类重复定义的警告
require_once("class.phpmailer.php"); 
require_once("class.smtp.php"); 
//实例化PHPMailer核心类
$mail = new PHPMailer();

// 检查空字段,并提取表单信息
if(empty($_POST['name'])      ||
   empty($_POST['email'])     ||
   empty($_POST['message'])   ||
   !filter_var($_POST['email'],FILTER_VALIDATE_EMAIL))
   {
   echo "No arguments Provided!";
   return false;
   }
   
$name = strip_tags(htmlspecialchars($_POST['name']));
$email_address = strip_tags(htmlspecialchars($_POST['email']));
$message = strip_tags(htmlspecialchars($_POST['message']));
 
//是否启用smtp的debug进行调试,开发环境建议开启生产环境注释掉即可,默认关闭debug调试模式
//$mail->SMTPDebug = 1;
 
//使用smtp鉴权方式发送邮件,当然你可以选择pop方式 sendmail 方式等,本文不做详解
//可以参考http://phpmailer.github.io/PHPMailer/当中的详细介绍
$mail->isSMTP();
//smtp需要鉴权这个必须是true
$mail->SMTPAuth=true;
//链接qq域名邮箱的服务器地址
$mail->Host = 'smtp.qq.com';
//设置使用ssl加密方式登录鉴权,如果用非加密方式即25端口时,可把这条注释掉
$mail->SMTPSecure = 'ssl';
//设置ssl连接smtp服务器的远程服务器端口号可选465或587,非加密用25端口
$mail->Port = 465;
//设置smtp的helo消息头这个可有可无内容任意
$mail->Helo = 'Hello smtp.qq.com Server';
//设置发件人的主机域可有可无默认为localhost内容任意,建议使用你的域名
$mail->Hostname = 'your-domain.com';
//设置发送的邮件的编码建议选择国际通用的 utf-8
$mail->CharSet = 'UTF-8';
//设置发件人姓名(昵称),显示发件人邮箱地址前的姓名,在此我们提取表单中name字段
$mail->FromName = "来自: $name";
//smtp登录的账号,这里可填入qq号或其它SMTP邮箱帐号
$mail->Username ='666666';
//smtp登录的密码,这里填入第三方客户端授权码
$mail->Password = '************';
//设置发件人邮箱地址这里填入上述提到的“发件人邮箱”
$mail->From = 'from@your-domain.com';
//邮件正文是否为html编码,属性true或false
$mail->isHTML(true); 
//设置收件人邮箱地址该方法有两个参数,第一个参数为收件人邮箱地址第二参数为给该地址设置的昵称,不同的邮箱系统会自动进行处理变动这里第二个参数的意义不大
$mail->addAddress('hi@your-domain.com','name');
//添加多个收件人则多次调用即可
//$mail->addAddress('xxx@163.com','name');
//添加该邮件的主题
$mail->Subject = "站点信息来自: $name";
//添加邮件正文,上方将isHTML设置成了true,则可以是完整的html字符串。如:可以使用file_get_contents函数读取本地的html文件,在此我们只提取表单中的信息
$mail->Body = "您已收到 your-domain.com 网站的新邮件.\n\n"."邮件内容:\n\nName: $name\n\nEmail: $email_address\n\nMessage:\n$message";
//为该邮件添加附件该方法也有两个参数,第一个参数为附件存放的目录(相对目录、或绝对目录均可)第二参数为在邮件附件中该附件的名称
//$mail->addAttachment('./d.jpg','mm.jpg');
//同样该方法可以多次调用 上传多个附件
//$mail->addAttachment('./Jlib-1.1.0.js','Jlib.js');


//发送命令 返回布尔值 
//PS:经过测试,要是收件人不存在,若不出现错误依然返回true 也就是说在发送之前 自己需要些方法实现检测该邮箱是否真实有效
$status = $mail->send();
 
//简单的判断与提示信息
if($status) {
    echo '发送邮件成功';
}else{
    echo '发送邮件失败:'.$mail->ErrorInfo;
}
?>

然后把修改后的 contact_me.php 文件和解压包找到的 class.phpmailer.php 、class.smtp.php 两个文件都放到网站的目录下(如 mail 文件夹下)。

最后打开 HTML 文件,找到表单所对应的标签添加文件链接:

<form  action="mail/contact_me.php">
青小蛙
那一池,氲光拂过的荷叶