MVC Mail ile Dosya ve Çoklu Dosya Gönderme

Eposta gönderme işlemi WEB projelerinde önemli bir yer tutar. Birçok WEB sayfası aynı zamanda eposta ile birlikte dosya gönderme işi de yapar. Peki MVC de bu işlemi nasıl yapacağız. Öncelikle eposta için bir  Model oluşturalım;

 public class mailmodel
    {
        public string To { get; set; }
        public string Subject { get; set; }
        public string Body { get; set; }
    }

Bir HomeController oluşturup şu kodlamayı yapalım;

using System.Net;
using System.Net.Mail;
using System.Web;
using webmail.Models;

namespace webmail.Controllers
{
    public class DosyaMailController : Controller
    {
        // GET: DosyaMail
        public ActionResult Index()
        {
            return View();
        }
        [HttpPost]

        public ActionResult Index(mailmodel objModelMail, HttpPostedFileBase fileUploader)
        {
            if (ModelState.IsValid)
            {
                string from = "epostanız@hotmail.com";
                using (MailMessage mail = new MailMessage(from, objModelMail.To))
                {
                    mail.Subject = objModelMail.Subject;
                    mail.Body = objModelMail.Body;                                                                                               mail.BodyEncoding = System.Text.Encoding.UTF8;//Türkçe karakterler için
                    if (fileUploader != null)
                    {
                        string fileName = Path.GetFileName(fileUploader.FileName);
                        mail.Attachments.Add(new Attachment(fileUploader.InputStream, fileName));
                    }
                    mail.IsBodyHtml = false;
                    SmtpClient smtp = new SmtpClient();
                    smtp.Host = "smtp-mail.outlook.com";
                    smtp.EnableSsl = true;
                    NetworkCredential networkCredential = new NetworkCredential(from, "epostaya ait şifreniz");
                    smtp.UseDefaultCredentials = true;
                    smtp.Credentials = networkCredential;
                    smtp.Port = 587;
                    smtp.Send(mail);
                    ViewBag.Message = "Sent";
                    return View("Index", objModelMail);
                }
            }
            else
            {
                return View();
            }
        }
    }
}

Kodlama işlemi bitti şimdi View tarafını yapalım.

@model webmail.Models.mailmodel
@{
    ViewBag.Title = "Index";
}
@{
    Layout = null;
}

<!DOCTYPE html>
<html>
<head>
    <meta name="viewport" content="width=device-width" />
    <title>Eposta ve Dosya Gönderme</title>
    <script src="~/Scripts/jquery-3.4.1.min.js"></script>
    <script>
        $(document).ready(function () {
            if ('@ViewBag.Message' == 'Sent') {
                alert('Gönderme başarılı');
            }
        });
    </script>
</head>
<body>
    <h2>Eposta ve Dosya Gönderme</h2>
    <fieldset>
        <legend>
           Eposta Gönder
        </legend>
        @using (@Html.BeginForm("Index", "DosyaMail", FormMethod.Post, new { @id = "form1", @enctype = "multipart/form-data" }))
        {
            @Html.ValidationSummary()
            <input type="submit" value="Gonder" />
            <table>
                <tr>
                    <td>Kime:</td>
                    <td>@Html.TextBoxFor(m => m.To)</td>
                </tr>
                <tr>
                    <td>Konu:</td>
                    <td>@Html.TextBoxFor(m => m.Subject)</td>
                </tr>
                <tr>
                    <td>Ek:</td>
                    <td><input type="file" name="fileUploader" /></td>
                </tr>
                <tr>
                    <td>Mesaj:</td>
                    <td>@Html.TextAreaFor(m => m.Body)</td>
                </tr>
           </table>
        }
    </fieldset>
</body>
</html>

İşte bu kadar projenizi test ediniz ve test ekranınız aşağıdaki gibidir.

Tek dosya için kodlama bu ama çoklu dosya için ne yapabilirim derseniz çözüm şöyle; Controller da şu değişikliği yapalım.

        [HttpPost]
        public ActionResult Index(mailmodel objModelMail, IEnumerable<HttpPostedFileBase> fileUploader)
        {
            if (ModelState.IsValid)
            {
                string from = "epostanız@hotmail.com";
                using (MailMessage mail = new MailMessage(from, objModelMail.To))
                {
                    mail.Subject = objModelMail.Subject;
                    mail.Body = objModelMail.Body;                                                                       mail.BodyEncoding = System.Text.Encoding.UTF8; 
                    if (fileUploader.Count() > 0)
                    {
                        foreach (var Dosya in fileUploader)
                        {
                            Attachment a = new Attachment(Dosya.InputStream, Dosya.FileName);
                            mail.Attachments.Add(a);
                        }
                    }
                    mail.IsBodyHtml = false;
                    SmtpClient smtp = new SmtpClient();
                    smtp.Host = "smtp-mail.outlook.com";
                    smtp.EnableSsl = true;
                    NetworkCredential networkCredential = new NetworkCredential(from, "epostaya ait şifreniz");
                    smtp.UseDefaultCredentials = true;
                    smtp.Credentials = networkCredential;
                    smtp.Port = 587;
                    smtp.Send(mail);
                    ViewBag.Message = "Sent";
                    return View("Index", objModelMail);
                }
            }
            else
            {
                return View();
            }
        }

Farklı renkte işaretli yerler değişiklik yaptığım yerler. Çoklu dosya için Jquery kullanacağız. Buradan ilgili dosyaları indirin ve Content isimli bir klasör oluşturup içine kopyalayın.

Şimdi View bölümünde şu değişikleri yapınız.

@model webmail.Models.mailmodel
@{
    ViewBag.Title = "Index";
}
@{
    Layout = null;
}

<!DOCTYPE html>

<html>
<head>
    <meta name="viewport" content="width=device-width" />
    <title>Eposta ve Dosya Gönderme</title>
    <script src="~/Content/jquery.blockUI.js"></script>
    <script src="~/Content/jquery.form.js"></script>
    <script src="~/Content/jquery.js"></script>
    <script src="~/Content/jquery.MetaData.js"></script>
    <script src="~/Content/jquery.MultiFile.js"></script>
    <script src="~/Content/jquery.MultiFile.pack.js"></script>
    <script src="~/Content/jquery.validate.js"></script>
    <script src="~/Scripts/jquery-3.4.1.min.js"></script>
    <script>
        $(document).ready(function () {
            if ('@ViewBag.Message' == 'Sent') {
                alert('Gönderme başarılı');
            }
        });
    </script>
</head>
<body>
    <h2>Eposta ve Dosya Gönderme</h2>
    <fieldset>
        <legend>
            Eposta Gönder
        </legend>
        @using (@Html.BeginForm("Index", "MultiFile", FormMethod.Post, new { @id = "form1", @enctype = "multipart/form-data" }))
        {
            @Html.ValidationSummary()
            <input type="submit" value="Gonder" />
            <table>
                <tr>
                    <td>Kime:</td>
                    <td>@Html.TextBoxFor(m => m.To)</td>
                </tr>
                <tr>
                    <td>Konu:</td>
                    <td>@Html.TextBoxFor(m => m.Subject)</td>
                </tr>
                <tr>
                    <td>Ek:</td>
                    <td><input type="file" class="multi" name="fileUploader"/><br /></td>
                </tr>
                <tr>
                    <td>Mesaj:</td>
                    <td>@Html.TextAreaFor(m => m.Body)</td>
                </tr>
            </table>
        }
    </fieldset>
</body>
</html>

Jquery dosyalarını ekledik ve input etiketine class="multi" tanımladık. Projeyi çalıştırın ve sonuç;

İnput etiketi için ayrıca şu ifadeleri de kullanabilirsiniz

    // 1. Özellik : İstediğiniz kadardosya seçilebiliyor.
    <input type="file" class="multi" name="fileUploader" /><br />
// 2. Özellik : MaxLenghe verilen değer kadar dosya seçilebiliyor. <input type="file" class="multi" maxlength="2" name="fileUploader" /><br />
// 3. Özellik : Accept özelliğine verilen uzantılara göre seçim sağlanıyor <input type="file" class="multi" accept="gif|jpg" name="fileUploader" /><br />

Faydalı olması dileğiyle .Kolay gelsin.



Etiketler
Mail Eposta Email Send Net MailAddress Attachment
Mesaj Yaz