Merge pull request #1565 from wallabag/v2-2fa-html

Use HTML email for 2FA
This commit is contained in:
Nicolas Lœuillet 2016-01-21 12:27:47 +01:00
commit 9aa66d6244
7 changed files with 179 additions and 53 deletions

View file

@ -42,6 +42,3 @@ swiftmailer:
transport: smtp
host: 'localhost'
port: 1025
username: null
password: null

View file

@ -4,7 +4,6 @@ namespace Wallabag\UserBundle\Mailer;
use Scheb\TwoFactorBundle\Model\Email\TwoFactorInterface;
use Scheb\TwoFactorBundle\Mailer\AuthCodeMailerInterface;
use Symfony\Component\Translation\TranslatorInterface;
/**
* Custom mailer for TwoFactorBundle email.
@ -20,11 +19,11 @@ class AuthCodeMailer implements AuthCodeMailerInterface
private $mailer;
/**
* Translator for email content.
* Twig to render the html's email.
*
* @var TranslatorInterface
* @var \Twig_Environment
*/
private $translator;
private $twig;
/**
* Sender email address.
@ -47,22 +46,31 @@ class AuthCodeMailer implements AuthCodeMailerInterface
*/
private $supportUrl;
/**
* Url for the wallabag instance.
*
* @var string
*/
private $wallabagUrl;
/**
* Initialize the auth code mailer with the SwiftMailer object.
*
* @param \Swift_Mailer $mailer
* @param TranslatorInterface $translator
* @param string $senderEmail
* @param string $senderName
* @param string $supportUrl
* @param \Swift_Mailer $mailer
* @param \Twig_Environment $twig
* @param string $senderEmail
* @param string $senderName
* @param string $supportUrl
* @param string $wallabagUrl
*/
public function __construct(\Swift_Mailer $mailer, TranslatorInterface $translator, $senderEmail, $senderName, $supportUrl)
public function __construct(\Swift_Mailer $mailer, \Twig_Environment $twig, $senderEmail, $senderName, $supportUrl, $wallabagUrl)
{
$this->mailer = $mailer;
$this->translator = $translator;
$this->twig = $twig;
$this->senderEmail = $senderEmail;
$this->senderName = $senderName;
$this->supportUrl = $supportUrl;
$this->wallabagUrl = $wallabagUrl;
}
/**
@ -72,20 +80,28 @@ class AuthCodeMailer implements AuthCodeMailerInterface
*/
public function sendAuthCode(TwoFactorInterface $user)
{
$template = $this->twig->loadTemplate('@WallabagUserBundle/Resources/views/TwoFactor/email_auth_code.html.twig');
$subject = $template->renderBlock('subject', array());
$bodyHtml = $template->renderBlock('body_html', [
'user' => $user->getName(),
'code' => $user->getEmailAuthCode(),
'support_url' => $this->supportUrl,
'wallabag_url' => $this->wallabagUrl,
]);
$bodyText = $template->renderBlock('body_text', [
'user' => $user->getName(),
'code' => $user->getEmailAuthCode(),
'support_url' => $this->supportUrl,
]);
$message = new \Swift_Message();
$message
->setTo($user->getEmail())
->setFrom($this->senderEmail, $this->senderName)
->setSubject($this->translator->trans('auth_code.mailer.subject', array(), 'wallabag_user'))
->setBody($this->translator->trans(
'auth_code.mailer.body',
[
'%user%' => $user->getName(),
'%code%' => $user->getEmailAuthCode(),
'%support%' => $this->supportUrl,
],
'wallabag_user'
))
->setSubject($subject)
->setBody($bodyText, 'text/plain')
->addPart($bodyHtml, 'text/html')
;
$this->mailer->send($message);

View file

@ -3,7 +3,8 @@ services:
class: Wallabag\UserBundle\Mailer\AuthCodeMailer
arguments:
- "@mailer"
- "@translator"
- "@twig"
- "%scheb_two_factor.email.sender_email%"
- "%scheb_two_factor.email.sender_name%"
- "%wallabag_support_url%"
- "%wallabag_url%"

View file

@ -1,10 +1,7 @@
# Two factor mail
auth_code.mailer.subject: 'Wallabag authentication Code'
auth_code.mailer.body: |
Hi %user%,
Since you enable two factor authentication on your wallabag account and you just logged in from a new device (computer, phone, etc.), we send you a code to validate your connection.
Here is the code: %code%
Please don't hesitate to contact us if you have any problems: %support%
The wallabag team
auth_code.mailer.body.hello: "Hi %user%,"
auth_code.mailer.body.first_para: "Since you enable two factor authentication on your wallabag account and you just logged in from a new device (computer, phone, etc.), we send you a code to validate your connection."
auth_code.mailer.body.second_para: "Here is the code:"
auth_code.mailer.body.support: "Please don't hesitate to contact us if you have any problems:"
auth_code.mailer.body.signature: "The wallabag team"

View file

@ -1,10 +1,7 @@
# Two factor mail
auth_code.mailer.subject: "Code d'authentification wallabag"
auth_code.mailer.body: |
Bonjour %user%,
Comme vous avez activé la double authentification sur votre compte wallabag et que vous venez de vous connecter depuis un nouvel appareil (ordinateur, téléphone, etc.), nous vous envoyons un code pour valider votre connexion.
Voici le code à renseigner: %code%
Si vous avez un problème de connexion, n'hésitez pas à contacter le support: %support%
L'équipe wallabag
auth_code.mailer.body.hello: "Bonjour %user%,"
auth_code.mailer.body.first_para: "Comme vous avez activé la double authentification sur votre compte wallabag et que vous venez de vous connecter depuis un nouvel appareil (ordinateur, téléphone, etc.), nous vous envoyons un code pour valider votre connexion."
auth_code.mailer.body.second_para: "Voici le code à renseigner :"
auth_code.mailer.body.support: "Si vous avez un problème de connexion, n'hésitez pas à contacter le support :"
auth_code.mailer.body.signature: "L'équipe wallabag"

View file

@ -0,0 +1,117 @@
{% block subject %}
{{ "auth_code.mailer.subject"|trans({}, 'wallabag_user') }}
{% endblock %}
{% block body_text %}
{{ "auth_code.mailer.body.hello"|trans({'%user%': user}, 'wallabag_user') }}
{{ "auth_code.mailer.body.first_para"|trans({}, 'wallabag_user') }}
{{ "auth_code.mailer.body.second_para"|trans({}, 'wallabag_user') }} {{ code }}
{{ "auth_code.mailer.body.support"|trans({}, 'wallabag_user') }} {{ support_url }}
{{ "auth_code.mailer.body.signature"|trans({}, 'wallabag_user') }}
{% endblock %}
{% block body_html %}
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0"/>
<title>{{ "auth_code.mailer.subject"|trans({}, 'wallabag_user') }}</title>
<style type="text/css">
#outlook a {padding:0;}
body{width:100% !important; -webkit-text-size-adjust:100%; -ms-text-size-adjust:100%; margin:0; padding:0; font-family: Helvetica, Arial, sans-serif; background: #c6d4e0;}
.ExternalClass {width:100%;}
.ExternalClass, .ExternalClass p, .ExternalClass span, .ExternalClass font, .ExternalClass td, .ExternalClass div {line-height: 100%;}
#backgroundTable {margin:0; padding:0; width:100% !important; line-height: 100% !important; background: #c6d4e0;}
img {outline:none; text-decoration:none; -ms-interpolation-mode: bicubic;}
a img {border:none;}
.image_fix {display:block;}
p {margin: 1em 0;}
h1, h2, h3, h4, h5, h6 {color: black !important;}
h1 a, h2 a, h3 a, h4 a, h5 a, h6 a {color: blue !important;}
h1 a:active, h2 a:active, h3 a:active, h4 a:active, h5 a:active, h6 a:active {
color: red !important;
}
h1 a:visited, h2 a:visited, h3 a:visited, h4 a:visited, h5 a:visited, h6 a:visited {
color: purple !important;
}
table td {border-collapse: collapse;}
table { border-collapse:collapse; mso-table-lspace:0pt; mso-table-rspace:0pt; }
a {color: #373737;}
#card {
background: #ffffff;
border: 1px solid #c5c5c5;
width: 89%;
margin: 5%;
}
#cell_desc h1, h5 {
display: block;
margin: 0;
}
#cell_desc h1 {
line-height: 35px;
margin-bottom: 10px;
}
#bg {background: #f2f2f2}
</style>
</head>
<body>
<!-- hidden text for preview -->
<div style="display:none;font-size:1px;color:#333333;line-height:1px;max-height:0px;max-width:0px;opacity:0;overflow:hidden;">
{{ "auth_code.mailer.body.hello"|trans({'%user%': user}, 'wallabag_user') }}
</div>
<table cellpadding="0" cellspacing="0" border="0" id="backgroundTable">
<tr>
<td>
<table cellpadding="0" cellspacing="0" border="0" align="center" id="card">
<tr>
<td style="padding: 20px;" width="96px" valign="top"><img class="image_fix" src="{{ wallabag_url }}/themes/material/img/logo-other_themes.png" alt="logo" title="{{ wallabag_url }}" style="width: 96px; height: 96px;" /></td>
<td style="padding: 20px; padding-left: 0;" valign="top" id="cell_desc">
<h1>wallabag</h1>
<h5>{% trans %}on{% endtrans %} {{ wallabag_url }}</h5>
</td>
</tr>
<tr><td colspan="2" style="padding: 0;"><div style="height: 0; border-top: 1px solid #c5c5c5;">&nbsp;</div></td></tr>
<tr id="bg">
<td style="padding: 20px;" colspan="2" valign="top">
<p><b>{{ "auth_code.mailer.body.hello"|trans({'%user%': user}, 'wallabag_user') }}</b></p>
<p>{{ "auth_code.mailer.body.first_para"|trans({}, 'wallabag_user') }}</p>
<p>{{ "auth_code.mailer.body.second_para"|trans({}, 'wallabag_user') }} <b>{{ code }}</b></p>
<p>{{ "auth_code.mailer.body.support"|trans({}, 'wallabag_user') }} <a href="{{ support_url }}">{{ support_url }}</a></p>
<p>{{ "auth_code.mailer.body.signature"|trans({}, 'wallabag_user') }}</p>
</td>
</tr>
<tr><td colspan="2" style="padding: 0;"><div style="height: 0; border-top: 1px solid #c5c5c5;">&nbsp;</div></td></tr>
<tr>
<td colspan="2">
<table cellpadding="0" cellspacing="0" border="0" width="100%">
<tr>
<td valign="top" style="padding: 20px; text-align: center"><a href="{{ wallabag_url }}">{{ wallabag_url }}</a></td>
<td valign="top" style="padding: 20px; text-align: center">Powered by <a href="https://www.wallabag.org/">wallabag</a></td>
</tr>
</table>
</td>
</tr>
</table>
</td>
</tr>
</table>
</body>
</html>
{% endblock %}

View file

@ -4,8 +4,6 @@ namespace Wallabag\UserBundle\Tests\Mailer;
use Wallabag\UserBundle\Entity\User;
use Wallabag\UserBundle\Mailer\AuthCodeMailer;
use Symfony\Component\Translation\Translator;
use Symfony\Component\Translation\Loader\ArrayLoader;
/**
* @see https://www.pmg.com/blog/integration-testing-swift-mailer/
@ -27,7 +25,7 @@ class AuthCodeMailerTest extends \PHPUnit_Framework_TestCase
{
protected $mailer;
protected $spool;
protected $translator;
protected $twig;
protected function setUp()
{
@ -38,12 +36,13 @@ class AuthCodeMailerTest extends \PHPUnit_Framework_TestCase
);
$this->mailer = new \Swift_Mailer($transport);
$this->translator = new Translator('en');
$this->translator->addLoader('array', new ArrayLoader());
$this->translator->addResource('array', array(
'auth_code.mailer.subject' => 'auth_code subject',
'auth_code.mailer.body' => 'Hi %user%, here is the code: %code% and the support: %support%',
), 'en', 'wallabag_user');
$twigTemplate = <<<TWIG
{% block subject %}subject{% endblock %}
{% block body_html %}html body {{ code }}{% endblock %}
{% block body_text %}text body {{ support_url }}{% endblock %}
TWIG;
$this->twig = new \Twig_Environment(new \Twig_Loader_Array(array('@WallabagUserBundle/Resources/views/TwoFactor/email_auth_code.html.twig' => $twigTemplate)));
}
public function testSendEmail()
@ -56,9 +55,10 @@ class AuthCodeMailerTest extends \PHPUnit_Framework_TestCase
$authCodeMailer = new AuthCodeMailer(
$this->mailer,
$this->translator,
$this->twig,
'nobody@test.io',
'wallabag test',
'http://0.0.0.0/support',
'http://0.0.0.0'
);
@ -69,7 +69,8 @@ class AuthCodeMailerTest extends \PHPUnit_Framework_TestCase
$msg = $this->spool->getMessages()[0];
$this->assertArrayHasKey('test@wallabag.io', $msg->getTo());
$this->assertEquals(array('nobody@test.io' => 'wallabag test'), $msg->getFrom());
$this->assertEquals('auth_code subject', $msg->getSubject());
$this->assertContains('Hi Bob, here is the code: 666666 and the support: http://0.0.0.0', $msg->toString());
$this->assertEquals('subject', $msg->getSubject());
$this->assertContains('text body http://0.0.0.0/support', $msg->toString());
$this->assertContains('html body 666666', $msg->toString());
}
}