'How to send email from a Flutter Web application?

I'm trying to send email from a Flutter Web application using mailer package but I'm getting this error:

Unsupported operation: Socket constructor

It seems like the package is dependent on dart:io which is not supported on Flutter Web. This is the the code that is meant to send email:

_sendEmail(String body) async {
print('Sending email...');
String username = 'myemail';
String password = 'mypassword';

final smtpServer = gmail(username, password);
final message = Message()
  ..from = Address(username, 'sender_name')
  ..recipients.add('reciever_email')
  ..subject = 'subject'
  ..text = body;

try {
  final sendReport = await send(message, smtpServer);
  print('message sent: ${sendReport.toString()}');
} catch (e) {
  print('message not sent: $e');
  e.problems.forEach(
    (element) => print('Problem: ${element.code}: ${element.msg}')
  );
}

I've used placeholders for credentials and I'm sure they're correct. Is there a way to send email from Flutter Web application?

emaildartflutter-web


Solution 1:[1]

SendGrid (and MailJet) was designed to work only on servers and not on clients. Register at https://app.sendgrid.com/

Create an API key Optional: check documentation (https://sendgrid.com/docs/API_Reference/Web_API_v3/index.html)

And use this code (replacing SENDGRIDAPIKEY with your API key):

import 'package:http/http.dart' as http;

class SendGridUtil {
  static sendRegistrationNotification(String email) async {
    Map<String, String> headers = new Map();
    headers["Authorization"] =
        "Bearer $$$SENDGRIDAPIKEY$$$";
    headers["Content-Type"] = "application/json";

    var url = 'https://api.sendgrid.com/v3/mail/send';
    var response = await http.post(url,
        headers: headers,
        body:
            "{\n          \"personalizations\": [\n            {\n              \"to\": [\n                {\n                  \"email\": \"[email protected]\"\n                },\n                {\n                  \"email\": \"[email protected]\"\n                }\n              ]\n            }\n          ],\n          \"from\": {\n            \"email\": \"[email protected]\"\n          },\n          \"subject\": \"New user registration\",\n          \"content\": [\n            {\n              \"type\": \"text\/plain\",\n              \"value\": \"New user register: $email\"\n            }\n          ]\n        }");
    print('Response status: ${response.statusCode}');
    print('Response body: ${response.body}');
  }
}

OR

Using packages

flutter_email_sender

Example :

final Email email = Email(
  body: 'Email body',
  subject: 'Email subject',
  recipients: ['[email protected]'],
  cc: ['[email protected]'],
  bcc: ['[email protected]'],
  attachmentPaths: ['/path/to/attachment.zip'],
  isHTML: false,
);

await FlutterEmailSender.send(email);

https://pub.dev/packages/flutter_email_sender/example

OR

Using packages

mailto 2.0.0

Example :

import 'dart:io';

import 'package:mailto/mailto.dart';

Future<void> main() async { 
  final mailto = Mailto(
    to: [
      '[email protected]',
      '[email protected]',
    ],
    cc: [
      'percentage%[email protected]',
      '[email protected]',
    ],
    bcc: [
      'Mike&[email protected]',
    ],
    subject: 'Let\'s drink a "café"! ?? 2+2=4 #coffeeAndMath',
    body:
        'Hello this if the first line!\n\nNew line with some special characters ?úóü?áéèßáñ\nEmoji: ???',
  );

  final server = await HttpServer.bind(InternetAddress.loopbackIPv4, 3000);
  String renderHtml(Mailto mailto) => '''<html><head><title>mailto example</title></head><body><a href="$mailto">Open mail client</a></body></html>''';
  await for (HttpRequest request in server) {
    request.response
      ..statusCode = HttpStatus.ok
      ..headers.contentType = ContentType.html
      ..write(renderHtml(mailto));
    await request.response.close();
  }
}

https://pub.dev/packages/mailto

https://github.com/smaho-engineering/mailto/blob/master/example/flutter/lib/main.dart

Sources

This article follows the attribution requirements of Stack Overflow and is licensed under CC BY-SA 3.0.

Source: Stack Overflow

Solution Source
Solution 1

Related Questions