JavaScriptを使用してフォーム経由でメールを送信する方法


  1. サーバーサイドスクリプトを使用する方法: サーバーサイドで動作するスクリプト(例:PHP、Node.js)を使用してフォームデータを処理し、メールを送信します。以下はNode.jsを使用した例です。

    const nodemailer = require('nodemailer');
    const express = require('express');
    const bodyParser = require('body-parser');
    const app = express();
    app.use(bodyParser.urlencoded({ extended: false }));
    app.post('/send-email', (req, res) => {
     const { name, email, message } = req.body;
     // メールの送信ロジックを追加する
     res.send('メールが送信されました');
    });
    app.listen(3000, () => {
     console.log('サーバーが起動しました');
    });

    上記の例では、ExpressとNodemailerライブラリを使用してメールを送信しています。フォームデータはreq.bodyから取得し、メールの送信ロジックを追加してください。

  2. クライアントサイドメール送信サービスを使用する方法: クライアントサイドで動作するメール送信サービス(例:SendGrid、SMTP.js)を使用してメールを送信します。以下はSendGridを使用した例です。

    const form = document.querySelector('#email-form');
    form.addEventListener('submit', (e) => {
     e.preventDefault();
     const name = document.querySelector('#name').value;
     const email = document.querySelector('#email').value;
     const message = document.querySelector('#message').value;
     // SendGrid APIを使用してメールを送信するロジックを追加する
     form.reset();
    });

    上記の例では、フォームの送信イベントをキャプチャして、フォームデータを取得し、SendGrid APIを使用してメールを送信しています。

これらはメール送信の一般的な方法の一部です。選択した方法に応じて、詳細な手順や追加のコードが必要になる場合があります。