Simple Dart package for creating mailto links in your Flutter apps or web pages

Overview

mailto

Simple Dart package for creating mailto links in your Flutter and Dart apps

The mailto package helps you build mailto links and provides you with an idiomatic Dart interface that:

  • supports one or many to, cc, and bcc fields
  • supports custom body and subject for the emails
  • encodes every value for your correctly
  • is blazingly fast ⚡️ 😜

smaho-engineering/mailto

Build Status Code coverage

mailto GitHub Stars Count

Important links

Usage

You may want to launch the email client on your user's phone with certain fields pre-filled. For Flutter apps, it's recommended to use the url_launcher package for launching the links you create with the mailto package.

import 'package:mailto/mailto.dart';
// For Flutter applications, you'll most likely want to use
// the url_launcher package.
import 'package:url_launcher/url_launcher.dart';

// ...somewhere in your Flutter app...
launchMailto() async {
  final mailtoLink = Mailto(
    to: ['[email protected]'],
    cc: ['[email protected]', '[email protected]'],
    subject: 'mailto example subject',
    body: 'mailto example body',
  );
  // Convert the Mailto instance into a string.
  // Use either Dart's string interpolation
  // or the toString() method.
  await launch('$mailtoLink');
}

Validation

The package provides a simple validation function. You could use this function in an assert to catch issues in development mode.

The package doesn't validate automatically, so either use the validation function or make sure that the parameters you use are correct.

Mailto.validateParameters(
  // New lines are NOT supported in subject lines
  subject: 'new lines in subject \n FTW',
  // What does this even mean?
  cc: ['\n\n\n', ''],
);

Known limitations of mailto URIs

I tested the package manually in Flutter apps on iOS and Android (Gmail, FastMail, Yahoo email client), and in the browser on macOS, and the package has an extensive test suite that incorporates many examples from the RFC 6068 - The 'mailto' URI Scheme document.

Unfortunately, each client handle mailto links differently: Gmail does not add line-breaks in the message body, FastMail skips the bcc, Yahoo is not able to handle encoded values in subject and body, and these are only the three clients I tested. The iOS email client seems to handle everything well, so 🎸 🤘 🎉 .

The package might also not work if the resulting mailto links are extremely long. I don't know the exact character count where the links fail, but I'd try to keep things under 1000 characters.

Important: Make sure you understand these limitations before you decide to incorporate mailto links in your app: letting users open their email clients with pre-filled values is a quick and easy way to let your users get in touch with you with extremely little development effort. At the same time, you need to keep in mind that it's very unlikely that these links are going to work consistently for all of your users.

If you need something bullet-proof, this package is not the right tool for solving your problem, so please consider alternative solutions (e.g. Flutter forms and a working backend).

In case you find potential improvements to the package, please create a pull request or let's discuss it in an issue. I might not merge all pull requests, especially changes that improve things for one client, but makes it worse for others. We consider the iOS mail app and Gmail on Android the two most important mail clients.

Examples

You'll find runnable, great examples on the project's GitHub repository in the /example folder.

Flutter example app

  1. Clone the repository
  2. Change directory to cd example/flutter
  3. flutter run and wait for the app to start
  4. You can fill out the forms with your own input or click the "Surprise me" button to see how your mail client handles tricky input

HTTP server serving an HTML web page with a mailto link

The mailto package works in any Dart program: be it Flutter, AngularDart, or on the server.

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();
  }
}
  1. Clone the repository
  2. Change directory to cd example/http_server
  3. Start HTTP server dart main.dart
  4. Open your browser and visit localhost:3000
  5. Click on the link
  6. If you have an email client installed on your computer, this client will be opened when you click the link on the HTML page.

Screenshots

mailto demo: Dart server HTML

mailto demo: MacOS email client

You might also like...

A flutter plugin to get facebook deep links and log app events using the latest Facebook SDK to include support for iOS 14

Facebook Sdk For Flutter LinkedIn GitHub facebook_sdk_flutter allows you to fetch deep links, deferred deep links and log facebook app events. This wa

Dec 17, 2022

Flutter plugin which helps you to find links in String using NSDataDetector and Linkify

Flutter plugin which helps you to find links in String using NSDataDetector and Linkify

Flutter's Native Linkify native_linkify is a Flutter plugin. Use it to find links in plain-text. The plugin uses NSDataDetector for iOS and macOS; Lin

Nov 29, 2022

a small app with a collection to WhatsApp group links

a small app with a collection to WhatsApp group links

linki A community based app for links to social media groups. Intro Linki is a simple app that shows an interactive list of links to social media grou

Sep 19, 2021

A responsive scaffold widget that adjusts to your device size, for your flutter mobile and web apps.

A responsive scaffold widget that adjusts to your device size, for your flutter mobile and web apps.

scaffold_responsive A responsive scaffold widget that adjusts to your device size, for your flutter mobile and web apps. Check out the Live demo here

Sep 27, 2022

A routing package that lets you navigate through guarded page stacks and URLs using the Router and Navigator's Pages API, aka "Navigator 2.0".

A routing package that lets you navigate through guarded page stacks and URLs using the Router and Navigator's Pages API, aka

A Flutter package to help you handle your application routing and synchronize it with browser URL. Beamer uses the power of Router and implements all

Jan 7, 2023

Simple UI design implementation of two pages.

dating_app_clone A new Flutter project. Getting Started This project is a starting point for a Flutter application. A few resources to get you started

Sep 22, 2021

A WebLN interface for creating Bitcoin Lightning powered web applications.

A WebLN interface for creating Bitcoin Lightning powered web applications.

A package that helps you to interact with WebLN providers by providing a FlutterWebln interface for creating Bitcoin Lightning powered web application

Sep 19, 2022

Excersises-app - Flutter excersises app design with 2 design pages

Excersises-app - Flutter excersises app design with 2 design pages

About The Project Flutter excersises app design with 2 design pages only Design

Jan 2, 2022

This is the flutter code for One health app admin and doctor pages.

one_health_doctor_and_admin A new Flutter project. Getting Started This project is a starting point for a Flutter application. A few resources to get

Aug 7, 2022
Comments
  • To field is required

    To field is required

    to != null && to.isNotEmpty && to.every((t) => t.isNotEmpty) "Destination email address "to" is a required parameter and all addresses must not be empty."

    opened by Bilonik 4
  • Mail doesn't open on Flutter Web when body content is too long

    Mail doesn't open on Flutter Web when body content is too long

    When the body of the mail is too long the Mail app doesn't open on Flutter web. Not sure about the behavior on mobile (haven't tested).

    Link to the gist.

    opened by melwinlobo18 2
  • Gmail: Handle newlines

    Gmail: Handle newlines

    Android phones that open the link with Gmail don't handle \n characters well.

    Figure out whether the issue is on our package's side or it was some decision that Gmail developers made and cannot be fixed from our side.

    Gmail simply skips the newlines in email body.

    opened by vincevargadev 0
  • Gmail: Handle = characters

    Gmail: Handle = characters

    Android phones that open the link with Gmail don't handle = characters well.

    Figure out whether the issue is on our package's side or it was some decision that Gmail developers made and cannot be fixed from our side.

    Anything after the = character is dropped (email body).

    opened by vincevargadev 0
Owner
SMAHO Engineering OSS
simply. smart. home.
SMAHO Engineering OSS
Trying out Flutter for desktop Web app development as an alternative to SPA frameworks (such as React and Angular) by recreating one of the pages of an existing CV Management web app

HTML Renderer Demo CanvasKit Renderer Demo Reddit discussion This repo contains a PoC of using Flutter as a traditional SPA framework for creating a d

Maxim Saplin 20 Oct 11, 2022
Easily build and deploy your Dart web app to GitHub pages

Run flutter build web or dart pub run build_runner build and put the output in another branch. An easy way to update gh-pages. Install $ dart pub glob

Kevin Moore 183 Dec 20, 2022
A simple dart library for extracting the Open Graph protocol on a web pages

ogp_data_extract A simple dart library for extracting the Open Graph protocol on

KINTO 0 Jan 12, 2022
Easy to use text widget for Flutter apps, which converts inlined urls into working, clickable links

LinkText Easy to use text widget for Flutter apps, which converts inlined URLs into clickable links. Allows custom styling. Usage LinkText widget does

Aleksander Woźniak 20 Nov 4, 2022
A cross-platform flutter package to convert your links into rich beautiful previews.

Link Preview Generator A cross-platform flutter package to convert your links into rich beautiful previews. This package is inspired from Any Link Pre

Pranav Bedre 12 Oct 21, 2022
Generate responsive pages and apps on HTML, Tailwind, Flutter and SwiftUI.

Figma to Code Most design to code plugins are bad, some are even paid. This project aims to raise the bar by generating responsive layouts in Tailwind

Bernardo Ferrari 2.8k Jan 4, 2023
A Flutter widget to dynamically add links to your text.

linkable A Flutter widget to add links to your text. By default, the Text or RichText widgets render the URLs in them as simple text which are not cli

Anup Kumar Panwar 18 Dec 15, 2021
Access links between your devices in real time!

Lineker Description Lineker allows you to manage links between your desktop and smartphone in real time, saving and deleting at any time. Create filte

Blackoutseeker 2 Aug 5, 2022
Package provides light widgets [for Linkify, Clean] and extensions for strings that contain bad words/URLs/links/emails/phone numbers

Package provides light widgets [for Linkify, Clean] and extensions for strings that contain bad words/URLs/links/emails/phone numbers

BetterX.io 4 Oct 2, 2022
A zero-dependency web framework for writing web apps in plain Dart.

Rad Rad is a frontend framework for creating fast and interactive web apps using Dart. It's inspired from Flutter and shares same programming paradigm

null 70 Dec 13, 2022