GSP249

Présentation
Les modules complémentaires Gmail automatisent les tâches au sein de Gmail, afin de faire gagner du temps aux utilisateurs et de simplifier leur travail. Ces modules complémentaires peuvent examiner les messages entrants, puis appliquer différentes actions sur ces derniers, par exemple :
- Afficher des informations supplémentaires pour l'utilisateur dans l'interface utilisateur de Gmail
- Se connecter à des services autres que Google pour récupérer des informations ou effectuer d'autres actions
- Fournir une interface interactive permettant à l'utilisateur de contrôler le module complémentaire ou d'envoyer des informations vers un autre service
Objectifs de l'atelier
Dans cet atelier pratique, vous allez créer un module complémentaire Gmail afin de modifier rapidement les libellés d'un fil de discussion.
Préparation
Avant de cliquer sur le bouton "Démarrer l'atelier"
Lisez ces instructions. Les ateliers sont minutés, et vous ne pouvez pas les mettre en pause. Le minuteur, qui démarre lorsque vous cliquez sur Démarrer l'atelier, indique combien de temps les ressources de l'atelier resteront accessibles.
Cet atelier pratique vous permet de suivre vous-même les activités dans un véritable environnement cloud, et non dans un environnement de simulation ou de démonstration. Des identifiants temporaires vous sont fournis pour vous permettre de vous connecter à Gmail le temps de l'atelier.
Ce dont vous avez besoin
Pour réaliser cet atelier, vous devez :
- avoir accès à un navigateur Internet standard (nous vous recommandons d'utiliser Chrome) ;
- disposer de suffisamment de temps pour effectuer l'atelier en une fois.
Remarque : Ouvrez une fenêtre de navigateur en mode incognito/navigation privée pour effectuer cet atelier. Vous éviterez ainsi les conflits entre votre compte personnel et le compte temporaire de participant.
Démarrer votre atelier et vous connecter à Gmail
-
Lorsque vous êtes prêt, cliquez sur Démarrer l'atelier.
Le volet "Détails concernant l'atelier" s'affiche avec les identifiants temporaires que vous devez utiliser pour vous connecter à Gmail pour cet atelier.
Si l'atelier est payant, un pop-up s'affiche pour vous permettre de sélectionner un mode de paiement.
-
Cliquez sur Ouvrir Gmail.
L'atelier lance les ressources, puis ouvre la page "Se connecter" dans un nouvel onglet.
Conseil : Réorganisez les onglets dans des fenêtres distinctes, placées côte à côte.
-
Si nécessaire, copiez le nom d'utilisateur ci-dessous et collez-le dans la boîte de dialogue Se connecter.
{{{user_0.username | "Username"}}}
-
Cliquez sur Suivant.
-
Copiez le mot de passe ci-dessous et collez-le dans la boîte de dialogue Bienvenue.
{{{user_0.password | "Password"}}}
-
Cliquez sur Suivant.
-
Si vous y êtes invité, cliquez sur J'ai compris pour accepter les conditions.
Gmail s'ouvre.
-
Cliquez sur Commencer, puis fermez toutes les fenêtres d'information qui peuvent s'ouvrir.
Vous vous trouvez maintenant dans Gmail, et vous pouvez voir votre boîte de réception.
Tâche 1 : Créer le projet de script
Lancer Apps Script
- Cliquez sur ce lien vers Apps Script pour ouvrir l'outil dans un nouvel onglet ou une nouvelle fenêtre du navigateur. Un nouveau projet s'ouvre.
Remarque : Apps Script place le fichier du projet dans le dossier racine de votre Drive.
- Cliquez sur l'icône Paramètres, puis sélectionnez l'option Afficher le fichier manifeste "appsscript.json" dans l'éditeur.

- Cliquez sur l'icône Éditeur.
Nommer le projet
- Cliquez sur Projet sans titre dans le coin supérieur gauche.
- Nommez le projet Gmail Add-on Quickstart, puis cliquez sur Renommer.
Créer le fichier de script Code.gs
- Remplacez le contenu du fichier
Code.gs
par le code suivant :
Code.gs
/**
* Copyright Google LLC
*
* Licensed under the Apache License, Version 2.0 (the "License");
* you may not use this file except in compliance with the License.
* You may obtain a copy of the License at
*
* https://www.apache.org/licenses/LICENSE-2.0
*
* Unless required by applicable law or agreed to in writing, software
* distributed under the License is distributed on an "AS IS" BASIS,
* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
* See the License for the specific language governing permissions and
* limitations under the License.
*/
/**
* Returns the array of cards that should be rendered for the current
* e-mail thread. The name of this function is specified in the
* manifest 'onTriggerFunction' field, indicating that this function
* runs every time the add-on is started.
*
* @param {Object} e The data provided by the Gmail UI.
* @return {Card[]}
*/
function buildAddOn(e) {
// Activate temporary Gmail add-on scopes.
var accessToken = e.messageMetadata.accessToken;
GmailApp.setCurrentMessageAccessToken(accessToken);
var messageId = e.messageMetadata.messageId;
var message = GmailApp.getMessageById(messageId);
// Get user and thread labels as arrays to enable quick sorting and indexing.
var threadLabels = message.getThread().getLabels();
var labels = getLabelArray(GmailApp.getUserLabels());
var labelsInUse = getLabelArray(threadLabels);
// Create a section for that contains all user Labels.
var section = CardService.newCardSection()
.setHeader("<font color=\"#1257e0\"><b>Available User Labels</b></font>");
// Create a checkbox group for user labels that are added to prior section.
var checkboxGroup = CardService.newSelectionInput()
.setType(CardService.SelectionInputType.CHECK_BOX)
.setFieldName('labels')
.setOnChangeAction(CardService.newAction().setFunctionName('toggleLabel'));
// Add checkbox with name and selected value for each User Label.
for(var i = 0; i < labels.length; i++) {
checkboxGroup.addItem(labels[i], labels[i], labelsInUse.indexOf(labels[i])!= -1);
}
// Add the checkbox group to the section.
section.addWidget(checkboxGroup);
// Build the main card after adding the section.
var card = CardService.newCardBuilder()
.setHeader(CardService.newCardHeader()
.setTitle('Quick Label')
.setImageUrl('https://www.gstatic.com/images/icons/material/system/1x/label_googblue_48dp.png'))
.addSection(section)
.build();
return [card];
}
/**
* Updates the labels on the current thread based on
* user selections. Runs via the OnChangeAction for
* each CHECK_BOX created.
*
* @param {Object} e The data provided by the Gmail UI.
*/
function toggleLabel(e){
var selected = e.formInputs.labels;
// Activate temporary Gmail add-on scopes.
var accessToken = e.messageMetadata.accessToken;
GmailApp.setCurrentMessageAccessToken(accessToken);
var messageId = e.messageMetadata.messageId;
var message = GmailApp.getMessageById(messageId);
var thread = message.getThread();
if (selected != null){
for each (var label in GmailApp.getUserLabels()) {
if(selected.indexOf(label.getName()) != -1){
thread.addLabel(label);
}
else {
thread.removeLabel(label);
}
}
}
else {
for each (var label in GmailApp.getUserLabels()) {
thread.removeLabel(label);
}
}
}
/**
* Converts an GmailLabel object to a array of strings.
* Used for easy sorting and to determine if a value exists.
*
* @param {labelsObjects} A GmailLabel object array.
* @return {lables[]} An array of labels names as strings.
*/
function getLabelArray(labelsObjects){
var labels = [];
for(var i = 0; i < labelsObjects.length; i++) {
labels[i] = labelsObjects[i].getName();
}
labels.sort();
return labels;
}
Remarque : Avant d'enregistrer, vous devez mettre à jour le fichier manifeste du script pour éviter les erreurs.
Tâche 2 : Mettre à jour le fichier manifeste du script
Mettez à jour le fichier manifeste (appsscript.json
) pour fournir au module complémentaire les informations de déploiement requises.
- Dans l'éditeur de script, sélectionnez le fichier appsscript.json depuis le menu de gauche.
- Remplacez le contenu du fichier manifeste (
appsscript.json
) par ce qui suit :
appsscript.json
{
"oauthScopes": [
"https://www.googleapis.com/auth/gmail.addons.execute",
"https://www.googleapis.com/auth/gmail.addons.current.message.metadata",
"https://www.googleapis.com/auth/gmail.modify"
],
"gmail": {
"name": "Gmail Add-on Quickstart - QuickLabels",
"logoUrl": "https://www.gstatic.com/images/icons/material/system/1x/label_googblue_24dp.png",
"contextualTriggers": [{
"unconditional": {
},
"onTriggerFunction": "buildAddOn"
}],
"openLinkUrlPrefixes": [
"https://mail.google.com/"
],
"primaryColor": "#4285F4",
"secondaryColor": "#4285F4"
}
}
- Cliquez sur l'icône Enregistrer le projet pour enregistrer les modifications apportées au fichier manifeste et à Code.gs. Cette étape permet de fournir les informations de déploiement requises au module complémentaire. Si un message d'erreur s'affiche, enregistrez le fichier
Code.gs
à nouveau.
Créer un projet Apps Script
Tâche 3 : Déployer le module complémentaire
-
Cliquez sur le bouton Déployer > Tester les déploiements en haut de l'écran.
-
Pour Application(s) : Gmail, cliquez sur Installer.
-
Cliquez sur OK.
-
Ouvrez l'onglet des paramètres du module complémentaire Gmail.
-
La boîte de dialogue Paramètre de l'onglet Modules complémentaires s'affiche.

Une fois ces étapes terminées, le module complémentaire apparaît dans la liste Modules complémentaires du développeur installés et peut être utilisé dans Gmail.
Remarque : Si vous ne voyez pas votre module complémentaire dans la liste Modules complémentaires du développeur installés, actualisez la fenêtre du navigateur. Si vous ne voyez toujours pas le module complémentaire dans la liste, retournez à l'onglet Gmail Add-on Quickstart, puis désinstallez et réinstallez le module complémentaire depuis la fenêtre Tester les déploiements.
Tâche 4 : Exécuter le module complémentaire
- Revenez à l'onglet Gmail et actualisez-le.
- Choisissez un message dans Gmail et ouvrez-le.
- Vérifiez que le menu latéral de droite est ouvert. S'il a été réduit, cliquez sur la flèche pour le développer.
Créer des libellés
- Cliquez sur le bouton Libellés (
) dans la barre de menu Gmail au-dessus de l'e-mail.
- Cliquez sur Créer.
- Saisissez "Test 1" comme nom d'étiquette et cliquez sur le bouton Create (Créer).
- Répétez ces étapes pour créer une autre étiquette nommée "Test 2".
Autoriser le module complémentaire
Les modules complémentaires que vous avez installés apparaissent dans le menu de droite du fil de discussion ouvert.
- Cliquez sur
à droite de l'écran.
Le module complémentaire place une carte contextuelle sur le côté droit de la fenêtre, avec un message demandant une autorisation.
- Cliquez sur le lien Autoriser l'accès pour ouvrir une boîte de dialogue vous permettant d'accepter le module complémentaire.
- Sélectionnez le compte étudiant qui doit autoriser le module complémentaire.
- Cliquez sur Autoriser.
- Si la boîte de dialogue suivante vous indique que l'application n'est pas vérifiée :
- Cliquez sur Paramètres avancés.
- Au bas de la boîte de dialogue, cliquez sur Accéder au Guide de démarrage rapide du module complémentaire Gmail (non sécurisé).
- Dans la nouvelle boîte de dialogue, saisissez "Continuer" dans le champ de texte, puis cliquez sur Suivant.
- Une fois autorisé, le module complémentaire devrait s'actualiser automatiquement et entrer en fonction.
Tâche 5 : Utiliser le module complémentaire
Les étiquettes Test 1 et Test 2 sont cochées dans la section Étiquettes disponibles pour l'utilisateur du module complémentaire (menu latéral de droite).
- Cochez la case Test 2 pour désélectionner le libellé. Le libellé est alors supprimé du fil de discussion dans lequel vous vous trouvez.
- Pour vérifier que les libellés appropriés ont été appliqués, revenez dans la boîte de réception et actualisez le navigateur. Seul le libellé Test 1 est toujours appliqué, Test 2 a été supprimé.
- Ouvrez un autre e-mail.
- Dans le menu des modules complémentaires, cochez les cases Test 1 et Test 2 pour activer les deux libellés.
- Revenez dans la boîte de réception et actualisez le navigateur. Les deux libellés ont été appliqués au fil de discussion.
Créer et utiliser le module complémentaire Gmail
Félicitations !
Vous avez désormais une idée des avantages qu'offrent les modules complémentaires Gmail. Vous pouvez également utiliser d'autres fonctions, par exemple afficher des fils de discussion récents que l'expéditeur a commencés ou encore traduire le texte d'un e-mail dans une autre langue sans avoir à quitter Gmail.
Atelier suivant
En savoir plus sur Workspace :
Étapes suivantes
Formations et certifications Google Cloud
Les formations et certifications Google Cloud vous aident à tirer pleinement parti des technologies Google Cloud. Nos cours portent sur les compétences techniques et les bonnes pratiques à suivre pour être rapidement opérationnel et poursuivre votre apprentissage. Nous proposons des formations pour tous les niveaux, à la demande, en salle et à distance, pour nous adapter aux emplois du temps de chacun. Les certifications vous permettent de valider et de démontrer vos compétences et votre expérience en matière de technologies Google Cloud.
Dernière mise à jour du manuel : 5 novembre 2024
Dernier test de l'atelier : 5 novembre 2024
Copyright 2025 Google LLC. Tous droits réservés. Google et le logo Google sont des marques de Google LLC. Tous les autres noms d'entreprises et de produits peuvent être des marques des entreprises auxquelles ils sont associés.