Euromind
  • Javascript
    • Javascript

      Historiske administrative geografier i Google Maps

      20. april, 2022

      Javascript

      Kierkegaard injiceret med Javascript

      15. april, 2022

      Javascript

      Dansk evighedskalender

      7. december, 2020

      Javascript

      API til Statistikbanken

      21. september, 2019

      Javascript

      IntersectionObserver

      9. august, 2019

  • CSS/SCSS
    • CSS/SCSS

      Kierkegaard injiceret med Javascript

      15. april, 2022

      CSS/SCSS

      Dansk evighedskalender

      7. december, 2020

      CSS/SCSS

      Variable fonte med dansk tegnsæt i open source

      11. august, 2019

      CSS/SCSS

      Progressbar for dokumentposition

      31. juli, 2019

      CSS/SCSS

      Media Query i 2019

      18. juli, 2019

  • C#
    • C#

      Historiske administrative geografier i Google Maps

      20. april, 2022

      C#

      Authentication for IOS og Android med Firebase i…

      4. oktober, 2019

      C#

      Andersen, Grundvig, Kierkegaard og ML.NET – del 3

      5. september, 2019

      C#

      Hurtig eksport til Excel

      4. september, 2019

      C#

      Andersen, Grundtvig, Kierkegaard og ML.NET – del 2

      2. september, 2019

  • Javascript
    • Javascript

      Historiske administrative geografier i Google Maps

      20. april, 2022

      Javascript

      Kierkegaard injiceret med Javascript

      15. april, 2022

      Javascript

      Dansk evighedskalender

      7. december, 2020

      Javascript

      API til Statistikbanken

      21. september, 2019

      Javascript

      IntersectionObserver

      9. august, 2019

  • CSS/SCSS
    • CSS/SCSS

      Kierkegaard injiceret med Javascript

      15. april, 2022

      CSS/SCSS

      Dansk evighedskalender

      7. december, 2020

      CSS/SCSS

      Variable fonte med dansk tegnsæt i open source

      11. august, 2019

      CSS/SCSS

      Progressbar for dokumentposition

      31. juli, 2019

      CSS/SCSS

      Media Query i 2019

      18. juli, 2019

  • C#
    • C#

      Historiske administrative geografier i Google Maps

      20. april, 2022

      C#

      Authentication for IOS og Android med Firebase i…

      4. oktober, 2019

      C#

      Andersen, Grundvig, Kierkegaard og ML.NET – del 3

      5. september, 2019

      C#

      Hurtig eksport til Excel

      4. september, 2019

      C#

      Andersen, Grundtvig, Kierkegaard og ML.NET – del 2

      2. september, 2019

Euromind
JavascriptWebdesign

Send email fra Javascript med Gmail API

af Per Lindsø Larsen 21. juni, 2019
skrevet af Per Lindsø Larsen 21. juni, 2019
Send email fra Javascript med Gmail API

Efter opsætning af Gmail APi kan den genererede API-nøgle og OAuth Client ID bruges til at sende mails fra den anvendte Gmail-konto i f.eks. javascript.

Ud over API-nøgle og Client-ID skal angives scope, der skal modsvare, hvad Client-ID undersætning også er blevet autoriseret til:

https://www.googleapis.com/auth/gmail.modify
https://www.googleapis.com/auth/gmail.compose
https://www.googleapis.com/auth/gmail.send

I dette tilfælde er “https://www.googleapis.com/auth/gmail.send”relevant. Endvidere Discovery_docs der er endpoint for Javascript Client-biblioteket.

       const params = {
      API_KEY: "[API_NØGLE]", //API-nøgle fra Developer Console
      CLIEN_ID: "[CLIENT_ID].apps.googleusercontent.com", //OAuth 2.0 Client ID fra Developer Console
      DISCOVERY_DOCS: ['https://www.googleapis.com/discovery/v1/apis/gmail/v1/rest'], // Array af API discovery doc URLs for APIs
      SCOPE: "https://www.googleapis.com/auth/gmail.readonly https://www.googleapis.com/auth/gmail.send"       
      // Scopes nødvendige for API; flere kan tilføjes i strengen, separeret med mellemrum.

    }

Initialiser clienten med de anførte oplysninger og forsøg at logge ind:

Følgende updateSigninStatus holder os opdateret med login-status, og så snart det er lykkes at logge ind, skal mailen konverteres til Base64 og kan herefter sendes:

   //Logget ind og klar til send
   // Send e-mail i en RFC 2822 formateret og base64url kodet streng.
    function updateSigninStatus(isSignedIn) {
      if (isSignedIn) {
        console.log("Logget ind... Sender email...")
        const headers = {
          'To': to,
          'Subject': subject,
          'Content-Type': 'text/html; charset="UTF-8"'
        }
        let email = '';
        for (const key in headers) {
          email += `${key}: ${headers[key]}` + '\r\n'
        }
        email += '\r\n' + body
        const b64Encoded = btoa(encodeURIComponent(email).replace(/%([0-9A-F]{2})/g,
        function toSolidBytes(match, p1) {
          return String.fromCharCode('0x' + p1)
        }))
        const base64EncodedEmail = b64Encoded.replace(/\+/g, '-').replace(/\//g, '_')

        gapi.client.gmail.users.messages.send({
          // Afsenders email-adresse, 'me' kan bruges til at angive den autentificerede bruger.
          userId: 'me',
          resource: {
            //RFC 2822 formateret og base64url kodet streng. 
            //Returneres i messages.get og drafts.get svar, når format = RAW parameter leveres.
            raw: base64EncodedEmail
          }
        }).then(function () {
          // Success: Log ud
          gapi.auth2.getAuthInstance().signOut();
          console.log("Email er blevet sendt!")
        });
      }
    }

Første gang – og kun første gang – popper nogle beskeder frem, hvor applikationens adgang til Gmail-kontoen bekræftes.



Vælg den aktuelle gmail-konto og fortsæt:

Klik på avancerede instillinger og gå videre. Giv de nødvendige tilladelser til applikationen:

Email’en er nu blevet sendt. Tjek postkassen. Man skal selvfølgelig huske, at script skal afvikles på et domæne, der under opsætning af API-en blev White-listet. I denne demo har jeg, for lokal test, white-listet localhost (hvilket nok er noget af det dummeste man i almindelighed kan gøre). Hvis jeg i stedet for http://localhost forsøger http://127.0.0.1 vil jeg ikke få lov til at sende:

Ændrer jeg url til http://localhost, så lykkes det:

Den samlede javascript-kode kan se således ud, og afprøves med den efterfølgende HTML-stump

function Gmail(to, subject, body) {
    const params = {
      API_KEY: "[API_NØGLE]", //API-nøgle fra Developer Console
      CLIEN_ID: "[CLIENT_ID].apps.googleusercontent.com", //OAuth 2.0 Client ID fra Developer Console
      DISCOVERY_DOCS: ['https://www.googleapis.com/discovery/v1/apis/gmail/v1/rest'], // Array af API discovery doc URLs for APIs
      SCOPE: "https://www.googleapis.com/auth/gmail.readonly https://www.googleapis.com/auth/gmail.send"       
      // Scopes nødvendige for API; flere kan tilføjes i strengen, separeret med mellemrum.

    }

    gapi.load('client', function initClient() {
    //Initialiser javascript client library
    console.log("Initialiserer mail...")
    gapi.client.init({
        apiKey: params.API_KEY,
        discoveryDocs: params.DISCOVERY_DOCS,
        clientId: params.CLIEN_ID,
        scope: params.SCOPE
      }).then(function () {
       //Login   
       console.log("Logger ind...")
       gapi.auth2.getAuthInstance()
          .isSignedIn
          .listen(updateSigninStatus);
        updateSigninStatus(gapi.auth2.getAuthInstance().isSignedIn.get());
        gapi.auth2.getAuthInstance().signIn();
      });
    });

   //Logget ind og klar til send
   // Send e-mail i en RFC 2822 formateret og base64url kodet streng.
    function updateSigninStatus(isSignedIn) {
      if (isSignedIn) {
        console.log("Logget ind... Sender email...")
        const headers = {
          'To': to,
          'Subject': subject,
          'Content-Type': 'text/html; charset="UTF-8"'
        }
        let email = '';
        for (const key in headers) {
          email += `${key}: ${headers[key]}` + '\r\n'
        }
        email += '\r\n' + body
        const b64Encoded = btoa(encodeURIComponent(email).replace(/%([0-9A-F]{2})/g,
        function toSolidBytes(match, p1) {
          return String.fromCharCode('0x' + p1)
        }))
        const base64EncodedEmail = b64Encoded.replace(/\+/g, '-').replace(/\//g, '_')

        gapi.client.gmail.users.messages.send({
          // Afsenders email-adresse, 'me' kan bruges til at angive den autentificerede bruger.
          userId: 'me',
          resource: {
            //RFC 2822 formateret og base64url kodet streng. 
            //Returneres i messages.get og drafts.get svar, når format = RAW parameter leveres.
            raw: base64EncodedEmail
          }
        }).then(function () {
          // Success: Log ud
          gapi.auth2.getAuthInstance().signOut();
          console.log("Email er blevet sendt!")
        });
      }
    }
}
html>
  <head>
    <script src="https://apis.google.com/js/api.js"></script>
    <script src="gmail.js"></script>
  </head>
  <body>
    <button id="button" onclick="Gmail('modtager@whatever.com', 'Emne for mailen', 'indhold i mailen')">Send Email</button>
  </body>
</html>
GmailMailSMTP
0 Kommentarer
16
FacebookTwitterPinterestEmail
forrige post
WEBP billedformatet
næste post
Registrer Gmail API til brug i javascript

Relaterede indlæg

Historiske administrative geografier i Google Maps

20. april, 2022

Kierkegaard injiceret med Javascript

15. april, 2022

Dansk evighedskalender

7. december, 2020

Headless browser på 10 minutter

25. juli, 2020

API til Statistikbanken

21. september, 2019

Variable fonte med dansk tegnsæt i open source

11. august, 2019

IntersectionObserver

9. august, 2019

Navngivne RegEx-grupper i ECMAScript 2018

29. juli, 2019

RegEx: Unicode og Look Backward i ECMAScript 2018

24. juli, 2019

Media Query i 2019

18. juli, 2019

Efterlad en kommentar Afbryd svar

Gem mit navn, email, og website i denne browser til senere kommentarer.

Seneste indlæg

  • Historiske administrative geografier i Google Maps

    20. april, 2022
  • Kierkegaard injiceret med Javascript

    15. april, 2022
  • Dansk evighedskalender

    7. december, 2020

Kategorier

  • C#
  • CSS/SCSS
  • Excel
  • HTML
  • Javascript
  • Mobile
  • Webdesign
  • Xamarin

Om mig

Om mig

Per Lindsø Larsen

Freelance fullstack developer bosat i Aarhus.

Du kan hyre mig til korterevarende projekter eller konkrete opgaveløsninger.

Pæn rabat til non-profit organisationer og foreninger.

Når jeg ikke koder, deltager jeg løbende i diverse spændende forskningsprojekter om alt andet end kodning.

Keep in touch

Facebook Twitter Email Github

Tags

Adresser AMP AMP Story Android API Billedformater Billedoptimering Brand C# Codepen Cordova CPR Crome DevTools CSS Debug Ecmascript Excel Fonte Gmail Gulp HTML Ikoner IOS Javascript JsFiddle Machine Learning Mail Mediaquery ML.NET Mobile RegEx SCSS SMTP Stylometri Visual Studio Webdesign Xamarin

Nyhedsbrev

Timeld nyhedsbrev for info om nye blog-indlæg, tips m.v.

  • Facebook
  • Twitter
  • Email
  • Github

@2019 - Euromind.com - Code-To-Go. All Right Reserved.
lindsoe@gmail.com - mobil: 42797273


Tilbage til top
Euromind
  • Javascript
    • Javascript

      Historiske administrative geografier i Google Maps

      20. april, 2022

      Javascript

      Kierkegaard injiceret med Javascript

      15. april, 2022

      Javascript

      Dansk evighedskalender

      7. december, 2020

      Javascript

      API til Statistikbanken

      21. september, 2019

      Javascript

      IntersectionObserver

      9. august, 2019

  • CSS/SCSS
    • CSS/SCSS

      Kierkegaard injiceret med Javascript

      15. april, 2022

      CSS/SCSS

      Dansk evighedskalender

      7. december, 2020

      CSS/SCSS

      Variable fonte med dansk tegnsæt i open source

      11. august, 2019

      CSS/SCSS

      Progressbar for dokumentposition

      31. juli, 2019

      CSS/SCSS

      Media Query i 2019

      18. juli, 2019

  • C#
    • C#

      Historiske administrative geografier i Google Maps

      20. april, 2022

      C#

      Authentication for IOS og Android med Firebase i…

      4. oktober, 2019

      C#

      Andersen, Grundvig, Kierkegaard og ML.NET – del 3

      5. september, 2019

      C#

      Hurtig eksport til Excel

      4. september, 2019

      C#

      Andersen, Grundtvig, Kierkegaard og ML.NET – del 2

      2. september, 2019

Populære indlæg

  • 1

    Stylometri i C# – del 2

    7. juni, 2019
  • 2

    Andersen, Grundvig, Kierkegaard og ML.NET – del 1

    11. august, 2019
  • 3

    Send email fra Javascript med Gmail API

    21. juni, 2019
  • 4

    Gmail, Yahoo og Outlook som SMTP-server

    18. april, 2019
  • 5

    API til Statistikbanken

    21. september, 2019
@2019 - Euromind.com - Code-To-Go. All Right Reserved.
lindsoe@gmail.com - mobil: 42797273

Læs ogsåx

Historiske administrative geografier i Google Maps

20. april, 2022

MutationObserver

9. juli, 2019

Registrer Gmail API til brug i javascript

27. juni, 2019