web-dev-qa-db-fra.com

Envoi d'emails avec Javascript

C'est un peu déroutant à expliquer, alors supportez-moi ici ...

Je souhaite configurer un système dans lequel un utilisateur peut envoyer des courriers électroniques basés sur un modèle via mon site Web, sauf que ce n'est pas réellement envoyé via mon serveur. Il ouvre simplement son propre client de messagerie local avec un courrier électronique prêt à l'emploi. L'application remplirait le corps de l'e-mail avec des variables prédéfinies, afin d'éviter à l'utilisateur de le saisir lui-même. Ils peuvent ensuite modifier le message à leur convenance, si cela ne leur convient pas exactement.

Il y a un certain nombre de raisons pour lesquelles je souhaite qu'il passe par le client de messagerie local de l'utilisateur. Il n'est donc pas possible d'envoyer le courrier électronique au serveur: il doit être 100% côté client.

J'ai déjà une solution qui fonctionne pour la plupart, et je vais vous en donner les détails en guise de réponse. Je me demande s'il existe une meilleure solution?

javascriptemailclient-side
102
nickf

La façon dont je le fais maintenant est fondamentalement comme ceci:

Le HTML:

<textarea id="myText">
    Lorem ipsum...
</textarea>
<button onclick="sendMail(); return false">Send</button>

Le Javascript:

function sendMail() {
    var link = "mailto:[email protected]"
             + "[email protected]"
             + "&subject=" + escape("This is my subject")
             + "&body=" + escape(document.getElementById('myText').value)
    ;

    window.location.href = link;
}

Ceci, étonnamment, fonctionne plutôt bien. Le seul problème est que si le corps est particulièrement long (plus de 2000 caractères), il ouvre simplement un nouveau courrier électronique mais il ne contient aucune information. Je soupçonne que cela aurait à voir avec la longueur maximale de l'URL dépassée.

126
nickf

Voici comment faire en utilisant jQuery et un "élément" sur lequel cliquer:

$('#element').click(function(){
    $(location).attr('href', 'mailto:?subject='
                             + encodeURIComponent("This is my subject")
                             + "&body=" 
                             + encodeURIComponent("This is my body")
    );
});

Ensuite, vous pouvez obtenir votre contenu soit en l’alimentant à partir de champs de saisie (c.-à-d. En utilisant $('#input1').val(), soit en utilisant un script côté serveur avec $.get('...').

17
Reignier Julien

Vous n'avez pas besoin de javascript, vous avez juste besoin que votre href soit codé comme ceci:

<a href="mailto:[email protected]">email me here!</a>
10
Ryan Doherty

Vous pouvez utiliser ce service gratuit: https://www.smtpjs.com

  1. Inclure le script:

<script src="https://smtpjs.com/v2/smtp.js"> </script>

  1. Envoyer un email en utilisant:

    Email.send("[email protected]", "[email protected]", "This is a subject", "this is the body", "smtp.yourisp.com", "username", "password");

5
cepix

Qu'en est-il d'avoir une validation en direct sur la zone de texte, et une fois qu'elle dépasse 2000 (ou quel que soit le seuil maximal), affichez 'Ce courrier électronique est trop long pour être complété dans le navigateur, veuillez <span class="launchEmailClientLink">launch what you have in your email client</span>'

À qui j'aurais

.launchEmailClientLink {
cursor: pointer;
color: #00F;
}

et jQuery cela dans votre onDomReady

$('.launchEmailClientLink').bind('click',sendMail);
5
alex

Si cela ne fait que permettre au client de l’utilisateur d’envoyer le courrier électronique, pourquoi ne pas le laisser le composer lui aussi. Vous perdez la possibilité de suivre ce qu'ils envoient, mais si ce n'est pas important, collectez simplement les adresses et le sujet, puis affichez le client pour permettre à l'utilisateur de remplir le corps.

2
tvanfosson

Envoyer la demande à mandrillapp.com :

var xhttp = new XMLHttpRequest();
xhttp.onreadystatechange = function() {
    if (xhttp.readyState == 4 && xhttp.status == 200) {
        console.log(xhttp.responseText);
    }
}
xhttp.open('GET', 'https://mandrillapp.com/api/1.0/messages/send.json?message[from_email][email protected]&message[to][0][email][email protected]&message[subject]=Заявка%20с%207995.by&message[html]=xxxxxx&key=oxddROOvCpKCp6InvVDqiGw', true);
xhttp.send();
1
Vitaly Zdanevich

Le problème avec l'idée même est que l'utilisateur doit disposer d'un client de messagerie, ce qui n'est pas le cas s'il s'appuie sur des courriers Web, ce qui est le cas pour de nombreux utilisateurs. (au moins, il n’y avait aucun retournement à rediriger vers ce webmail lorsque j’ai enquêté sur le problème il ya une douzaine d’années).

C'est pourquoi la solution normale consiste à utiliser php mail () pour envoyer des emails (côté serveur, puis).

Mais si de nos jours "client de messagerie" est toujours défini, automatiquement, potentiellement sur un client de messagerie Web, je serai heureux de le savoir.

1
Fabrice NEYRET