C’est une technique très courante dans l’emailing : placer une image reliée à un code de tracking pour savoir si une personne a lu ou non un email. Découvrez comment implémenter simplement la technique du pixel transparent avec Symfony2.

Le principe de l’image de tracking

L’appellation peut varier : tracking pixel, pixel transparent, 1×1 pixel, image de suivi… le principe est toujours le même, à savoir demander à un utilisateur d’afficher une image avec une url unique qui nous permettra de savoir avec certitude que celle-ci a bien été vue. Si on essaye de résumer ceci avec quelques images font-awesome, on obtient le schéma suivant :

1. L’utilisateur ouvre un email contenant l’image img.gif avec comme paramètre l’id 1981
2. Le client de messagerie demande au serveur correspondant de lui envoyer l’image
3. Le serveur récupère ou fabrique l’image et en profite pour enregistrer la demande : la visualisation de l’email est trackée
4. Le serveur renvoie l’image au client de messagerie qui peut l’afficher à l’utilisateur

Le concept est assez simple, vous allez voir que la mise en œuvre n’est pas plus compliquée.

Créer un pixel transparent avec Symfony2

Paramétrer la route

Comme n’importe quelle page d’un projet Symfony2 notre image de tracking sera accessible via une url et donc liée à une route, que nous allons déclarer maintenant. Ouvrez le fichier routing.yml du Bundle dans lequel vous travaillez (ici MailBundle) et ajoutez cette route :

opening_tracking:
    path:   /email.gif
    defaults: { _controller: MailBundle:Opening:trackOpening }

Créer une réponse à afficher

Avant de coder l’action dans le contrôleur, nous allons créer une classe hérité de Response pour renvoyer une image de 1×1 pixel transparent, au format gif. Dans l’exemple ci-dessous, cette classe s’appelle TrackingPixelResponse, dans le namespace Component.

namespace MailBundle\Component;

use Symfony\Component\HttpFoundation\Response; 

class TrackingPixelResponse extends Response  
{
    /**
     * Contenu pour une image de 1x1px encodé en base 64
     * @var string
     */
    const IMAGE_CONTENT = 'R0lGODlhAQABAIAAAAAAAP///yH5BAEAAAAALAAAAAABAAEAAAIBRAA7';

    
  
    /**
     * Type MIME de la réponse
     * @var string
     */
    const CONTENT_TYPE = 'image/gif';

    /**
     * Constructeur de la classe
     */
    public function __construct()
    {
        // Définit le contenu de la réponse
        $content = base64_decode(self::IMAGE_CONTENT);
        // Appelle de constructeur de Response en lui passant le contenu
        parent::__construct($content);
        // Définit les headers de la réponse
        $this->headers->set('Content-Type', self::CONTENT_TYPE);
        $this->setPrivate();
        $this->headers->addCacheControlDirective('no-cache', true);
        $this->headers->addCacheControlDirective('must-revalidate', true);
    }
}

Vous trouverez facilement d’autres valeurs à donner à la constante IMAGE_CONTENT, par exemple cette discussion sur StackOverflow nous propose la valeur suivante :

const IMAGE_CONTENT = 'R0lGODlhAQABAJAAAP8AAAAAACH5BAUQAAAALAAAAAABAAEAAAICBAEAOw==';

Définir l’action de contrôleur

Maintenant que tout est prêt, il ne nous reste plus qu’à implémenter l’action dans le contrôleur, pour l’exemple nous allons enregistrer la date d’ouverture dans l’email dont l’id est passé en paramètre.

public function trackOpeningAction(Request $request)
{
    // Récupère l'id de l'image depuis son url : picture.gif?id=1981
    $id = $request->query->get('id');
    // Si l'id est bien passée en paramètre
    if (null !== $id) {
        // Recherche l'email dont l'id est passé en paramètre
        $emailRepository = $this->getDoctrine()->getRepository('MailBundle:Email');
        $email = $emailRepository->findOneById($id);
        // Si l'email existe    
        if (null != $email) {
	    // Enregistre la date/heure d'ouverture de l'email
            $email->setOpeningDate(new \DateTime());
            // Persiste l'enregistrement en base de données
            $em = $this->getDoctrine()->getManager();
            $em->persist($opening);
            $em->flush();
        }
    }
    // Renvoie le pixel transparent à afficher
    return new TransparentPixelResponse();
}

Et ensuite ?

Vous n’avez plus qu’à tester !

Cette fonctionnalité est intégrée à tous les outils d’emailing, gratuits ou non, et le suivi du taux d’ouverture des emails est indispensable pour mesurer l’efficacité de vos communications. C’est pourquoi vous ne pouvez pas ne pas intégrer ces quelques lignes si vous vous lancez dans l’écriture d’un outil capable d’envoyer des emails commerciaux.

Comme toujours, vos commentaires et vos questions sont les bienvenus, n’hésitez pas à vous exprimer !