जावास्क्रिप्ट के साथ ईमेल भेजना


107

यह समझाने के लिए थोड़ा भ्रमित है, इसलिए मेरे साथ यहां सहन करें ...

मैं एक ऐसी प्रणाली स्थापित करना चाहता हूं, जहां कोई उपयोगकर्ता अपनी वेबसाइट के माध्यम से टेम्प्लेटेड ईमेल भेज सके, सिवाय इसके कि वास्तव में मेरे सर्वर का उपयोग करके इसे नहीं भेजा गया है - यह सिर्फ एक ईमेल के साथ अपने स्वयं के स्थानीय मेल क्लाइंट को खोलने के लिए तैयार है। एप्लिकेशन को उपयोगकर्ता द्वारा स्वयं टाइप करने के लिए सहेजने के लिए ईमेल के मुख्य भाग को पूर्वनिर्धारित चर के साथ भरना होगा। वे तब संदेश को इच्छानुसार संपादित कर सकते हैं, तो क्या यह उनके उद्देश्यों के अनुरूप नहीं होना चाहिए।

मेरे द्वारा उपयोगकर्ता के स्थानीय मेल क्लाइंट के माध्यम से जाने के लिए कई कारण हैं, इसलिए ईमेल भेजने के लिए सर्वर प्राप्त करना एक विकल्प नहीं है: इसे 100% क्लाइंट-साइड होना चाहिए।

मेरे पास पहले से ही ज्यादातर काम करने वाला समाधान चल रहा है, और मैं उस के विवरण को उत्तर के रूप में पोस्ट करूंगा, मैं सोच रहा हूं कि क्या कोई बेहतर तरीका है?


जवाबों:


137

जिस तरह से मैं अभी कर रहा हूं वह मूल रूप से इस तरह है:

HTML:

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

जावास्क्रिप्ट:

function sendMail() {
    var link = "mailto:me@example.com"
             + "?cc=myCCaddress@example.com"
             + "&subject=" + encodeURIComponent("This is my subject")
             + "&body=" + encodeURIComponent(document.getElementById('myText').value)
    ;
    
    window.location.href = link;
}

यह, आश्चर्यजनक रूप से, बल्कि अच्छी तरह से काम करता है। एकमात्र समस्या यह है कि यदि शरीर विशेष रूप से लंबा है (2000 से अधिक वर्णों में), तो यह सिर्फ एक नया ईमेल खोलता है लेकिन इसमें कोई जानकारी नहीं है। मुझे संदेह है कि यह URL की अधिकतम लंबाई को पार करने के साथ करना होगा।


1
जब आप जावास्क्रिप्ट का उपयोग करने के बजाय एक ही सामग्री के लिए href विशेषता सेट कर सकते हैं, तो ऐसा करने का यह एक सुंदर गोल चक्कर तरीका है।
रयान डोहर्टी '

1
यदि आप टेक्स्टरी की सामग्री को ईमेल में शामिल करना चाहते हैं तो राउंडअबाउट नहीं। स्पैम हार्वेस्टर से अपने ईमेल को छुपाने की एक अच्छी विधि।
गॉर्डन बेल

1
@ गॉर्डन- जो कि ईमेल हारवेस्टर माना जाता है, इनलाइन जावास्क्रिप्ट को regex नहीं करता है या <script src = "">
alex

6
URL- एन्कोडिंग से भिन्न मनमाने नियमों का पालन करने के लिए, वरीयता में एन्कोडर्कोम्पोनेंट का उपयोग करें। हालांकि यूनिकोड वर्ण अभी भी विफल होने की संभावना है ... लेकिन फिर पूरी बात वैसे भी विफल होने की संभावना है। मापदण्डों के साथ mailto लिंक अति-अविश्वसनीय हैं और इन्हें वास्तव में उपयोग नहीं किया जाना चाहिए।
14

5
bobince: हाँ मुझे लगा कि यह करने के लिए एक नीरस तरीका है, लेकिन विकल्प क्या है?
निक नेव

17

यहां क्लिक करने के लिए jQuery और एक "तत्व" का उपयोग करने का तरीका दिया गया है:

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

उसके बाद, आप अपनी सामग्री या तो इनपुट फ़ील्ड्स से फीड करके प्राप्त कर सकते हैं (यानी उपयोग कर रहे हैं $('#input1').val()या सर्वर साइड स्क्रिप्ट के साथ $.get('...')। मज़े करें


यह अभी भी URL आकार सीमाओं के अधीन है, जैसा कि ओपी ने उल्लेख किया है।
सनकैट २२

10

आपको किसी भी जावास्क्रिप्ट की आवश्यकता नहीं है, आपको इस तरह कोडित करने के लिए बस अपने href की आवश्यकता है:

<a href="mailto:me@me.com">email me here!</a>

मुझे लगता है कि मैं उम्मीद कर रहा था कि असली कोड गतिशील रूप से भरे।
टवनफॉसन

@tvanfosson यदि एंकर तत्व को क्लिक किए जाने के समय ईमेल पते को पृष्ठ पर जाना जाता है, तो आप एंकर को एक आईडी देने की कोशिश कर सकते हैं और hrefजब पते चुने जाते हैं तो उसका मूल्य निर्धारित कर सकते हैं। यदि क्लिक होने के समय ईमेल पते प्राप्त करने के लिए किसी पोस्ट की आवश्यकता होती है, तो यह संभवतः काम नहीं करेगा।
मित्सुइ जूल 27'15

5

टेक्स्टबॉक्स पर लाइव सत्यापन होने के बारे में, और एक बार यह 2000 से अधिक हो जाता है (या जो भी अधिकतम सीमा होती है) उसके बाद 'यह ईमेल ब्राउज़र में पूरा होने के लिए बहुत लंबा है, कृपया प्रदर्शित करें <span class="launchEmailClientLink">launch what you have in your email client</span>'

जिसके पास मैं होता

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

और अपने onDomReady में इसे jQuery करें

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

5

आप इस मुफ्त सेवा का उपयोग कर सकते हैं: https://www.smtpjs.com

  1. स्क्रिप्ट शामिल करें:

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

  1. एक ईमेल भेजें:
Email.send(
  "from@you.com",
  "to@them.com",
  "This is a subject",
  "this is the body",
  "smtp.yourisp.com",
  "username",
  "password"
);

2
इसके साथ आप अपने SMTP सर्वर के डेटा को उजागर करते हैं, यह सर्वर साइड पर Node या PHP के साथ करना सबसे अच्छा है, धन्यवाद समान रूप से
jcarlosweb

क्या आपने बटन "यहाँ एक SMTP सर्वर सेटअप" की कोशिश की है? आप उत्तर में साझा किए गए लिंक में पा सकते हैं।
जम्मोजिको

2

यदि यह केवल ईमेल भेजने के लिए उपयोगकर्ता के ग्राहक को खोलने जा रहा है, तो उसे वहां भी क्यों न लिखें। आप जो कुछ भी भेज रहे हैं उसे ट्रैक करने की क्षमता खो देते हैं, लेकिन अगर यह महत्वपूर्ण नहीं है, तो बस पते और विषय को इकट्ठा करें और उपयोगकर्ता को शरीर में भरने के लिए क्लाइंट को पॉप अप करें।


1
यह विचार था कि मेरा आवेदन उनके लिए शरीर भरता है। मैं इस प्रश्न को स्पष्ट करने के लिए संपादन करूँगा ...
निक

1
लेकिन एक ईमेल क्लाइंट क्यों लिखें जब आप मेल भेजने के लिए सिर्फ एक खोलने जा रहे हों?
tvanfosson

यह एक ईमेल क्लाइंट नहीं है, यह मेरी वेबसाइट पर सिर्फ एक पेज है जो ईमेल संदेश देता है।
निक

2

बहुत ही विचार के साथ समस्या यह है कि उपयोगकर्ता के पास एक ईमेल क्लाइंट होना चाहिए, जो कि अगर वह वेबमेल पर भरोसा नहीं करता है, जो कि कई उपयोगकर्ताओं के लिए मामला है। (कम से कम इस वेबमेल को पुनर्निर्देशित करने की कोई बारी नहीं थी जब मैंने एक दर्जन साल पहले इस मुद्दे की जांच की थी)।

यही कारण है कि सामान्य समाधान ईमेल भेजने के लिए php मेल () पर भरोसा करना है (सर्वर-साइड, फिर)।

लेकिन अगर आजकल "ईमेल क्लाइंट" हमेशा सेट किया जाता है, तो स्वचालित रूप से, वेबमेल क्लाइंट के लिए संभावित रूप से, मुझे यह जानकर खुशी होगी।


> "लेकिन अगर आजकल" ईमेल क्लाइंट "हमेशा सेट किया जाता है, स्वचालित रूप से, संभावित रूप से वेबमेल क्लाइंट के लिए, मुझे यह जानकर खुशी होगी।" ... यह आधुनिक ब्राउज़रों द्वारा समर्थित है, उदाहरण के लिए: support.google.com/a/users/answer/9308783?hl=en
nickf

1

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]=mail@7995.by&message[to][0][email]=zdanevich.vitaly@yaa.ru&message[subject]=Заявка%20с%207995.by&message[html]=xxxxxx&key=oxddROOvCpKCp6InvVDqiGw', true);
xhttp.send();

GST और POST क्यों नहीं? यदि संदेश काफी बड़ा है तो इसे किसी बिंदु पर काट दिया जाएगा।
अलेक्सई श्वेलेव
हमारी साइट का प्रयोग करके, आप स्वीकार करते हैं कि आपने हमारी Cookie Policy और निजता नीति को पढ़ और समझा लिया है।
Licensed under cc by-sa 3.0 with attribution required.