電子メールを送る方法


JavaScriptは、フロントエンドとバックエンドの両方の開発に使用できるプログラミング言語です.サーバーソケットのサポートが不足しているため、JavaScriptコードを単独で使用してメールを送信することはできません.このためには、SMTPサーバと対話するサーバー側の言語が必要です.あなたのリクエストに基づいてブラウザからメールを送信するサーバースクリプトと一緒にJSを使用することができます.これは以下で紹介する値です.
だから、バックエンドがないアプリからメールを送信するためにJSを使用する方法を把握しましょう.
あなたが完全な記事を読みたいならば、Mailtrapのブログでそれをチェックしてください

電子メールの送信 smtpjsからの送信メール


SMTPJsはJavaScriptからメールを送信するために使用できる無料のライブラリです.すべての必要なSMTPサーバーといくつかの操作を行うに行われます.メールのテストのための操作可能な解決策であるので、mailtrapをサーバとして使用します.以下の通りです.
  • HTMLファイル(たとえばtest . html )を作成します.<script src="https://smtpjs.com/v3/smtp.js">
    </script>
  • JavaScript関数をトリガするボタンを作成します<input type="button" value="Send Email" onclick="sendEmail()">
  • は、SMTPJSを通してメールを送るJS機能を書きます.COM .
  • function sendEmail() {
    Email.send({
    Host : "smtp.mailtrap.io",
    Username : "<Mailtrap username>",
    Password : "<Mailtrap password>",
    To : '[email protected]',
    From : "[email protected]",
    Subject : "Test email",
    Body : "<html><h2>Header</h2><strong>Bold text</strong><br></br><em>Italic</em></html>"
    }).then(
    message => alert(message)
    );
    }
    複数の受信者を持っている場合は、TO :プロパティのメールアドレスの配列を指定できます.
  • 走行テスト.ブラウザのHTMLとEメール
  • を送る

    上記のコードサンプルの欠点は、クライアント側スクリプトでユーザー名とパスワードが表示されることです.SMTPJSによって提供される暗号化オプションを利用するならば、これは固定されることができます.SMTP資格情報ボタンを暗号化し、必要なフィールドに入力します.

    その後、次のようなSMTPサーバー設定ではなく、次のようにしてJS機能を使用します.SecureToken : "<your generated token>"

    電子メール


    あなたのメールサービスを接続し、電子メールテンプレートを構築し、JavaScriptから任意のサーバーコードを送信することができます.スコープをチェックしましょう.
  • アカウントを作成し、接続するメールサービスを選択します.GmailやOutlookのような個人的なサービスと同様に、Amazon SEsやMailgunなどの人気のあるトランザクションサービスオプションがあります.また、カスタムのSMTPサーバーを追加することができます.それは私たちがMailtrapを使用しているので、我々がするつもりです.
  • EmailJS.com
  • 内蔵エディタを使用して電子メールテンプレートを作成します.エディターは、コンテンツの構築およびその他の有用な機能のためのオプションの多くを提供し、自動返信、recaptchaの検証などなど.また、独自のHTMLメールテンプレートのコーディングの基本を理解する必要があります.このために、我々はを読みます.これが完了すると、[保存]をクリックします.
  • 電子メールの主な利点の一つ.COMは、典型的なメール属性が隠されているということです.テンプレートは受信者フィールドを含んでいます、そして、それはJSから上書きできないので、あなたは以前に設定したテンプレートを送ります.
  • 今すぐメールアドレスSDKをインストールする必要があります.これはNPMで行うことができます.npm install emailjs-com --saveまたは弓bower install emailjs-com --save
  • あなたのウェブサイトに電子メールを使用する必要がある場合は、次のコードを閉じる前に貼り付けます.
    <script type="text/javascript"
       src="https://cdn.jsdelivr.net/npm/[email protected]/dist/email.min.js">
    </script>
    <script type="text/javascript">
       (function(){
          emailjs.init("YOUR_USER_ID"); //use your USER ID
       })();
    </script>
    
    
  • 実際のメール送信は、2つの方法で行うことができる.両方のコード例を次に示します.
    電子メール.送付する
    var templateParams = {
        name: 'James',
        notes: 'Check this out!'
    };
    
    emailjs.send('YOUR_SERVICE_ID', 'YOUR_TEMPLATE_ID', templateParams) //use your Service ID and Template ID
        .then(function(response) {
           console.log('SUCCESS!', response.status, response.text);
        }, function(error) {
           console.log('FAILED...', error);
        });
    
    電子メール.センドフォーム
    var templateParams = {
        name: 'James',
        notes: 'Check this out!'
    };
    
    emailjs.sendForm('YOUR_SERVICE_ID', 'YOUR_TEMPLATE_ID', templateParams) //use your Service ID and Template ID
        .then(function(response) {
           console.log('SUCCESS!', response.status, response.text);
        }, function(error) {
           console.log('FAILED...', error);
        });
    
    送信メールはサーバー側のものですが、サーバー側のコーディングを扱うことを控えることができます.SMTPJsと電子メールは、フロントエンドを合理化し、それが電子メールを送信できるようにする2つのactionableソリューションです.それは一般的な電子メールの属性を非表示にするので、あなたが前に設定したテンプレートを送信することができますので、電子メールはより良いです.mailtoメソッドを使用することもできます.どのようなより良い作品をテストするMailTripをお試しください!
    mailtoについて詳しく知ると、完全な記事を読んでください:Guide on How to Build HTML Email
    Sending Emails with JavaScript でアカウントを作成し、自分で説明フローを試してみてください!