Отправка писем из Javascript, и один из способов «Сообщить об опечатке на сайте»

И сегодня нам не понадобится серверная часть. Мы будем отправлять письма прямо из браузера пользователя, и основываясь на данном способе ознакомимся с небольшим (12 Кб) jQuery плагином, который получился свободным аналогом orphus-у.

Представляю вашему вниманию код по отправке email, работающий во всех современных браузерах, состоящий из нескольких строчек Javascript! Базируется он на mandrillapp.com API ^[1], используя кросдоменный ajax-запрос. ^[2] Другими словами, вы используете API для отправки писем со своей html-странички, не используя никакой код на сервере.

Вот его пример:

var xmlhttp = (window.XMLHttpRequest) ? new XMLHttpRequest() : new ActiveXObject("Microsoft.XMLHTTP");
xmlhttp.open('POST', 'https://mandrillapp.com/api/1.0/messages/send.json');
xmlhttp.setRequestHeader('Content-Type', 'application/json;charset=UTF-8');
xmlhttp.onreadystatechange = function() {
    if (xmlhttp.readyState == 4) {
        if(xmlhttp.status == 200) alert('Mail sended!')
        else if(xmlhttp.status == 500) alert('Check apikey')
        else alert('Request error');
    }
}
xmlhttp.send(JSON.stringify({'key': 'YourApiKeyIsHere',
   'message': {
       'from_email': 'mail_from@write.here',
       'to': [{'email': 'mail_to@write.her', 'type': 'to'}],
       'autotext': 'true',
       'subject': 'Yeah!',
       'html': '<h1>Its work!</h1>'
    }}));

Для того, чтоб данный пример заработал — необходимо получить свой API Key. Для этого регистрируемся ^[3] в сервисе, лезем в настройки ^[4], и жмем большую синюю кнопку "+ New API Key". Полученный ключ подставляем в пример выше, указываем адреса отправителя и получателя, и вуаля! Сервис использует только https, имеет массу настроек включая черные и белые списки.
Квота составляет 12,000 сообщений в месяц (295 в час) на один аккаут.

Плагин «Сообщить об опечатке на сайте»

Простой велосипед, который реализует возможность отправить уведомление о том, что на сайте имеет место быть очепятка и ошибка, используя как приведенный выше механизм, так и традиционный — ajax запрос к php скрипту, который отправляет сообщение. О плюсах минусах будет сказано в заключении к данному посту, а сейчас несколько слов о самом плагине:

• Используется библиотека jQuery;
• Комплектуется php-скриптом для отправки писем (если использование первого метода по каким-либо причинам невозможно или неприемлемо);
• Инициализируется единожды, и просто ждет нажатия «Ctrl» + «Enter» при выделенном тексте;
• Текст всех сообщений что видит пользователь — настраиваемый, и указывается в момент инициализации плагина. Это позволяет без каких-либо проблем встроить данный плагин на мультиязычные сайты;
• Никаких дополнительных css, js, или картинок (последние есть, но подгружаются с imgur.com) не требуется для работы;
• Имеется возможность использовать свои стили и свою верстку;
• Опциональные настройки интерфейса;
• Имеется набор callback-функций.

Картинка кликабельна и ведет на демку с описанием, с которой, при необходимости, можно скачать исходники.

Минимальный пример для запуска плагина будет:

<script type="text/javascript" src="http://code.jquery.com/jquery-1.11.0.min.js"></script>
<script type="text/javascript" src="https://cdn.rawgit.com/tarampampam/jquery.textmistake/master/src/jquery.textmistake.js"></script>
<script type="text/javascript">
(function(e){
    jQuery(document).textmistake({
        'mailTo': 'your_email(d0g)here.com'.replace(/(d0g)/, '@'),
        'mailFrom': 'textmistake(d0g)yourdomain.com'.replace(/(d0g)/, '@'),
        'mandrillKey': 'HereIsYourMandrillApiKey', // Get your - https://mandrill.com/signup/
    });
})(jQuery)
</script>

Все остальные детали, демо, и описание, как было сказано выше — вы найдете на страничке плагина ^[5]. Плагин ещё немного сырой, обкатанный только одним проектом, поэтому буду рад любой конструктивной критике, оставленной здесь ^[6].

Заключение

• Если вы открываете возможность отправки уведомлений на почтовый ящик — делайте это для ограниченной группы лиц (редактуре), и лишь на тестовый период. Давать анонимусам возможность отправки писем кому угодно, указывая произвольного отправителя, c html в сообщениях, да «подписанных» твоим ключом — крайняя глупость;
• Даже во время тестового периода не используйте адрес почты в открытом виде (роботы не спят). Как минимум заменяйте textmistake@yourdomain.com на 'textmistake(d0g)yourdomain.com'.replace(/(d0g)/, '@');
• Т.к. сообщения могут содержать html — не забывайте о вероятности xss. Используйте «правильные» почтовые хостинги. При использовании в качестве серверной части php скрипта все html-сущности вырезаются по умолчанию (return htmlspecialchars(strip_tags($text))), но защита лишь от очевидных попыток xss.

Автор: cmepthuk

Источник ^[7]