Application Google Chrome. Création d'une application Chrome simple. Extensions Google Chrome

18.04.2019

Google Chrome est le navigateur Internet le plus populaire au monde, qui peut désormais être installé sur votre Android. La version mobile du programme est aussi rapide et fonctionnelle que la version de bureau.

Fonctionnalités du navigateur Google Chrome

Le navigateur possède un certain nombre de fonctionnalités clés grâce auxquelles les utilisateurs choisissent un produit de Google. Ceux-ci incluent :

Travail optimisé avec les onglets, qui permet une vitesse de chargement trois fois plus rapide.
La possibilité de synchroniser les informations personnelles (onglets, favoris et mots de passe) entre différents appareils Android en quelques clics.
Une fonction unique de compression du trafic, avec laquelle le volume des données reçues et transmises peut être réduit de 2 fois. Cette fonctionnalité sera particulièrement utile pour les personnes qui utilisent le trafic mobile pour accéder à Internet.
Recherche intelligente qui, parallèlement à la saisie de votre requête de recherche, offre des options de recherche possibles.
Fonction de traduction automatique intégrée, grâce à laquelle il n'y aura plus de barrières linguistiques.
Implémentation pratique du travail avec les onglets du navigateur Google Chrome, ce qui rend le travail avec eux un plaisir.
Disponibilité de navigation confidentielle. Lorsque vous activez cette fonction, personne ne pourra suivre vos mouvements sur Internet.

Avec la dernière mise à jour, Google Chrome est devenu encore plus stable et fiable, et son affichage visuel sur l'écran des appareils mobiles s'est également amélioré, ce qui sera sans aucun doute apprécié par tous les utilisateurs sur l'appareil sur lesquels ce programme est installé.

Il existe une boutique d'applications Google Play. Bien qu'il s'agisse d'une boutique, la plupart des applications sont distribuées gratuitement. Pour y aller, cliquez sur le bouton en haut à droite du navigateur. Ensuite, déplacez le curseur de la souris sur « Outils » et, dans le sous-menu qui apparaît, sélectionnez « Extensions ». Ou vous pouvez saisir « chrome://extensions/ » dans la barre d'adresse.

On se retrouve sur la page des applications existantes. Dans mon cas, l'extension est déjà installée - "Google documents 0.7". Sélectionnez la ligne « Plus d'extensions ».

Le côté gauche affiche un menu pour sélectionner les thèmes d'application ; la section « Extensions » est sélectionnée par défaut ; il est pratique d'utiliser la molette de la souris pour faire défiler vers le bas. Les applications elles-mêmes sont affichées à droite, en fonction de leur popularité.

Si vous passez votre souris sur une application, le logo de l'application se transformera en une brève description de l'action de l'application (ou une annonce de l'application). Un bouton d'installation bleu apparaîtra indiquant le coût.

On déplace le curseur de la souris sur l'application, le logo se transforme en une description et un bouton de téléchargement. Cliquez sur le bouton « gratuit ».

Nous confirmons l'installation de l'application et cliquons sur le bouton « Ajouter ».

Un nouveau bouton et une nouvelle fenêtre de notification d'installation apparaissent. Mais alors cette icône disparaîtra.

Allez à nouveau dans les extensions, bouton « Paramètres », « Outils » et « Extensions ».

Maintenant, dans les applications, il apparaît que « Paramètres avancés » a été installé. Pour vous familiariser avec le fonctionnement de l'application, cliquez sur le lien actif « Paramètres », qui se trouve sous l'application.

Des paramètres supplémentaires apparaissent dans une nouvelle fenêtre ; vérifions le fonctionnement du programme. Je remplace le bouton « J'aime » par autre chose, puis je clique sur le bouton « Enregistrer ».

Maintenant ouvrons

Pour tester l'application que vous développez, vous devrez l'ajouter à votre navigateur. Pour ce faire, sur la page chrome://extensions, vous devez cocher la case « Mode développeur ». Après cela, il sera possible d'ajouter votre extension ou application.

manifeste.json

Le code de toute application Chrome, comme toute extension, commence par un fichier manifest.json. Il décrit toutes les méta-informations de l'application. Voici le manifeste de l'éditeur dans son intégralité :

( "name": "Simple Text", "description": "Un éditeur de texte extrêmement simple (exemple d'application Chrome)", "version": "0.1", "icons": ( "48": "icon/48.png ", "128": "icon/128.png" ), "manifest_version": 2, "minimum_chrome_version": "31.0", "offline_enabled": true, "app": ( "background": ( "scripts": [ "js/background.js"] )), "permissions": [ ("fileSystem": ["write"]) ], "file_handlers": ( "text": ( "title": "Texte simple", "types ": ["application/javascript", "application/json", "application/xml", "text/*"], "extensions": ["c", "cc", "cpp", "css", " h", "hs", "html", "js", "json", "md", "py", "textile", "txt", "xml", "yaml"] ) ) )

Regardons les champs que nous avons rencontrés ici. Tout est clair avec le nom et la description. La version est un champ obligatoire : le Chrome Web Store exigera qu'elle soit modifiée lorsque vous téléchargez une mise à jour de votre application.

Var entréeToLoad = null ; function init(launchData) ( var fileEntry = null if (launchData && launchData["items"] && launchData["items"].length > 0) ( EntryToLoad = launchData["items"]["entry"] ) var options = ( cadre : "chrome", minWidth : 400, minHeight : 400, largeur : 700, hauteur : 700 ); chrome.app.window.create("index.html", options);

La page d'arrière-plan s'exécute en arrière-plan, quelles que soient les fenêtres de l'application. La plupart du temps, il n’est pas chargé en mémoire. Lorsque le système démarre, son code est exécuté et peut installer des gestionnaires pour certains événements, dont le plus courant est onLaunched. Lorsque les gestionnaires sont installés, la page d'arrière-plan est généralement déchargée de la mémoire et ne s'exécute que si l'un des événements auxquels elle s'abonne s'est produit.

Lorsque l'utilisateur clique sur l'icône de l'application ou y ouvre un fichier, l'événement onLaunched est déclenché dans la page d'arrière-plan. Lui sont transmis les paramètres d'appel, notamment le(s) fichier(s) que l'application doit ouvrir. Le code EntryToLoad = launchData["items"]["entry"] enregistre le fichier transféré à l'application dans une variable locale, d'où le code de l'éditeur le récupérera ultérieurement. L'événement onLaunched peut également se produire lorsque l'application est déjà ouverte. Dans ce cas, le code de la page d'arrière-plan peut décider lui-même d'ouvrir une nouvelle fenêtre ou d'effectuer certaines actions dans une fenêtre déjà ouverte.

Pour compléter le tableau, voici le CSS :

Corps (marge : 0 ; ) en-tête (couleur d'arrière-plan : #CCC ; bordure inférieure : 1px solide #777 ; -webkit-box-align : centre ; -webkit-box-orient : horizontal ; -webkit-box-pack : gauche ; affichage : -webkit-box ; hauteur : 48 px ; remplissage : 0px 12px 0px 12px ; ; remplissage : 4px ; position : absolu ; bas : 0px ; zone de texte : focus ( contour : aucun !important; )

Code de base : travailler avec des fichiers

Puisque dans notre exemple, par souci de simplicité, nous nous limiterons à l'ensemble minimum de capacités, le code de l'éditeur principal sera consacré presque exclusivement au travail avec des fichiers. Plusieurs API sont utilisées à cet effet, dont certaines sont déjà en passe d'être standardisées par le W3C. L'API File et les interfaces associées constituent un sujet important qui mérite un article séparé. Je le recommande comme une bonne introduction.

Alors, regardons le code dans js/main.js. Je le fournirai par fragments, le code complet est sur Github.

Fonction init(entry) ( $("#open").click(open); $("#save").click(save); $("#saveas").click(saveAs); chrome.runtime.getBackgroundPage (function(bg) ( if (bg.entryToLoad) loadEntry(bg.entryToLoad); ) ) $(document).ready(init);

La tâche de la fonction d'initialisation est d'ajouter des gestionnaires aux boutons et d'obtenir un fichier de la page d'arrière-plan à ouvrir. Le contexte de la page d'arrière-plan est obtenu de la fenêtre principale de manière asynchrone à l'aide de chrome.runtime.getBackgroundPage .

Gestionnaires de clics sur les boutons :

Var entréeactuelle = null ; fonction open() ( chrome.fileSystem.chooseEntry(("type": "openWritableFile"), loadEntry); ) fonction save() ( if (currentEntry) ( saveToEntry(currentEntry); ) else ( saveAs(); ) ) fonction saveAs() ( chrome.fileSystem.chooseEntry(("type": "saveFile"), saveToEntry); )

Nous stockerons le FileEntry actuel dans la variable globale currentEntry.

La seule fonctionnalité spécifique du code ci-dessus est la méthode chrome.fileSystem.chooseEntry. En utilisant cette méthode, une fenêtre de sélection de fichier s'ouvre (la sienne sur chaque système). Comme toutes les autres fonctions permettant de travailler avec le système de fichiers, cette méthode est asynchrone et reçoit un rappel pour continuer à travailler (dans notre cas, les fonctions loadEntry et saveToEntry décrites ci-dessous).

Lecture d'un fichier :

Fonction setTitle() ( chrome.fileSystem.getDisplayPath(currentEntry, function(path) ( document.title = path + " - Simple Text"; )); ) fonction loadEntry(entry) ( currentEntry = Entry; setTitle(); Entry. fichier(readFile); ) fonction readFile(file) ( var reader = new FileReader(); reader.onloadend = function(e) ( $("textarea").val(this.result); ); reader.readAsText(file ; )

Dans la fonction setTitle(), nous modifions le titre de la fenêtre pour afficher le chemin d'accès au fichier actuel. La façon dont ce titre apparaît varie selon le système. Sur Chrome OS, cela n'apparaît pas du tout. chrome.fileSystem.getDisplayPath est le moyen le plus correct d'obtenir le chemin du fichier approprié pour l'afficher à l'utilisateur. Une autre représentation de chemin est disponible via Entry.fullPath .

L'API File possède deux objets différents qui décrivent un fichier : FileEntry et File. En gros, FileEntry représente le chemin d'accès au fichier et File représente les données qu'il contient. Ainsi, pour lire un fichier, il est nécessaire d’obtenir un objet File par Entry. Ceci est réalisé en utilisant la méthode asynchrone Entry.file().

Le code de cet exemple est aussi court que possible pour s'adapter au format de l'article. Si vous souhaitez consulter des exemples plus détaillés de la manière dont certaines fonctionnalités de l'API Chrome sont utilisées, un large éventail d'exemples d'applications Chrome ont été publiés sur GitHub. La documentation officielle de toutes les API se trouve sur Developer.chrome.com. Le principal endroit pour obtenir des réponses à des questions spécifiques sur la programmation des applications Chrome est.

Nous présentons au public notre propre vision de la liste incontournable des applications populaires pour le navigateur Chrome, basée sur les résultats de l'année 2014. Lors de la préparation du matériel, les experts se sont appuyés sur un indicateur très basique : la capacité de l'application Chrome à remplacer pleinement son homologue de bureau standard. C’est pour cette raison que les applications et outils hors ligne souvent utilisés pour résoudre les problèmes quotidiens figuraient parmi les principaux.

Bureau à distance

Le nom parle presque de lui-même. Chaque utilisateur rêve de pouvoir accéder à un autre ordinateur ou partager son propre écran d'accueil. Cette application, bien sûr, diffère de son homologue Windows ou TeamViewer, mais elle est beaucoup plus simple et pratique à utiliser.

Il est désormais devenu plus pratique de travailler avec le courrier dans le client de bureau. Toute correspondance sortante peut être préparée à l'avance sans connexion à Internet. Il est également possible de gérer tous les courriers entrants hors ligne, car la fonction de synchronisation est disponible. Cette application très pratique, dotée d'une interface Gmail traditionnelle, sera utile à tout utilisateur professionnel du navigateur Chrome.

Il est difficile de ne pas convenir que la façon la plus optimale de transformer votre travail quotidien peut être quelque chose de passionnant. En utilisant l'application Email Game, les opérations et la gestion du courrier sont transformées en un jeu informatique passionnant, qui présente les notes, le nivellement, le temps nécessaire pour terminer et les bonus. Pour les utilisateurs les plus ambitieux, un concours groupé pour le titre de gagnant inbox est proposé.

Beaucoup ont déjà apprécié tous les avantages de l'utilisation de Google Docs hors ligne. Tous ses connaisseurs doivent avoir l'application proposée. Dans les situations où la possibilité de fonctionner avec la suite bureautique Google en format autonome n'a pas encore été présentée, il n'est pas nécessaire de perdre du temps. Installez l'application, utilisez l'accès hors ligne dans les paramètres du document et commencez à effectuer les tâches assignées, quelle que soit la présence d'Internet.

Texte

Il s'agit peut-être de l'éditeur de texte le plus simple, le plus confortable et le plus rapide, doté d'une coloration syntaxique du code, ainsi que de la possibilité de travailler simultanément avec plusieurs fichiers à la fois avec l'intégration de Google Drive. C'est le meilleur éditeur de sa catégorie.

Encore une fois, le nom de l’application dit déjà tout. Essentiellement, il ajoute des options de client de messagerie de bureau au réseau social russe le plus populaire, où vous pouvez accéder à des contacts et effectuer une correspondance en ligne sans la présence d'Internet.

Depuis longtemps, Telegram est considéré comme un messager d'entreprise à part entière. Il s'agit de l'une des applications les plus rapides, les plus sûres et les plus pratiques, dotée de toutes les fonctionnalités nécessaires pour résoudre rapidement de nombreux problèmes de travail. Dans ce contexte, Telegram est idéal pour les options lorsque le client mobile n'est pas aussi à l'aise.

Il s’agit d’un service de lecture différée très populaire et pratique. Il existe un bouton spécial distinct pour Pocket, qui vous aide à réserver un article pour qu'il soit lu instantanément en un seul clic. Avec une excellente application, vous pouvez lire les articles en attente même sans accès à Internet.

Écouter

Un lecteur cloud incomparable qui a pour fonction d'écouter et de rechercher de la musique depuis VK, d'écoute hors ligne et d'intégration avec Google Drive. Vous pouvez désormais rechercher de nouvelles chansons à l'aide des bases de données Yandex.Music et Last.FM. Pour les mélomanes, il n’existe tout simplement pas d’autre alternative valable.

Éditeur Pixlr

N'oubliez pas et faites-le à temps

Vous pouvez citer toute une liste d'outils, de nombreuses personnes aujourd'hui ne peuvent tout simplement pas imaginer leurs activités quotidiennes sans eux. Il s'agit de toutes sortes d'extensions de mémoire, de listes de courses, de notes, de blocs-notes, de gestionnaires de tâches, de rappels. Nous pouvons absolument dire qu'individuellement, chaque service a une finalité totalement individuelle, mais ils ont tous la même signification : il ne faut pas l'oublier et avoir le temps de le faire. Il est assez difficile de choisir une application comme préférée. Ils sont tous uniques et résolvent des problèmes légèrement différents, bien qu'ils aient beaucoup en commun. Certaines personnes préfèrent tout ce qui est simple, d’autres préfèrent les produits complexes et sophistiqués. Certains apprécient le respect de la méthodologie GTD, tandis que d'autres privilégient souvent exclusivement l'intuitivité et la commodité.

Si vous suivez les technologies populaires telles que les blogs ou Techcrunch Download Squad, vous avez peut-être remarqué des messages teaser sur les applications Web Google Chrome, nouvelle fonctionnalité Chrome que les développeurs Google Chromeélaborent depuis un certain temps un plan d’entreprise. Google fournit applications Web dans la nouvelle version Chrome Web Store. Il existe des applications gratuites et payantes que les utilisateurs Chrome peut être installé dans un navigateur Web.

Applications Web Chrome répertorié dans le gestionnaire d'extensions du navigateur, il n'y a que quelques différences entre les extensions et Applications Web Chrome. Applications Web Chrome sont installés par défaut et apparaissent sur le nouvel onglet de la page où ils sont facilement accessibles, à condition qu'ils soient installés sur l'ordinateur.

Applications Web Google Chrome.

Cliquez sur application Web et il s'ouvre à gauche du TabBar. Les icônes d'onglets ressemblent à première vue aux onglets épinglés, à l'exception du fait qu'elles sont en haute résolution car elles n'utilisent pas d'icônes mais ont plutôt des icônes locales.

Applications Web Chrome.
La capture d'écran ci-dessus montre deux Applications Web Chrome et un dans l'onglet. Gmail et Google Agenda sont des applications Web. En cliquant dessus, vous ouvrez la page Web du service dans le navigateur. Honnêtement, je ne suis pas en mesure de comprendre les différences existantes entre les applications Web et les onglets à ce stade, à part de meilleures icônes d'onglets et le fait que les applications Web sont répertoriées sous de nouveaux signets. Je pense que c'est un exemple du concept. Par exemple, les articles Techcrunch montrent une capture d'écran d'un jeu qui s'exécute probablement localement plutôt que sur un site Web.

Jeux d'applications Web Chrome
Comme vous pouvez le voir sur la capture d'écran ci-dessus, il n'y a pas d'URL dans l'adresse ligne, en supposant qu'il s'exécute localement (ou que l'URL a été supprimée de l'écran).
Comment activer les applications Web Chrome dans Google Chrome Dev.
Applications Web Chrome peut être inclus dans G oogle Chrome - Chrome. Download Squad a des instructions :
Google Chrome est livré avec trois applications Web à tester. Ils fournissent les fonctionnalités de Google Docs, Gmail et Google Calendar.
Les applications se trouvent dans C:\Users\username\AppData\Local\Google\Chrome\Application\6.0.453.1\Resources\ sous Windows. Veuillez noter que la version change à chaque nouvelle version Chrome.
Vous devez ajouter le paramètre launch-enable-applications dans le navigateur. Le moyen le plus simple de procéder est de créer un raccourci, de cliquer avec le bouton droit sur le raccourci et de sélectionner les propriétés. La cible devrait ressembler à ceci à la fin C:\Users\username\AppData\Local\Google\Chrome\Application\chrome.exe activer les applications
Ouvrez maintenant le menu des extensions en cliquant sur l'icône de clé dans la barre d'outils Chrome, vous y verrez des outils et des extensions.
Sélectionnez décompresser les extensions et accédez au dossier des ressources. Chaque Application Web Chrome doivent être installés séparément.
Applications Web apparaissent immédiatement sur la page Nouvel onglet, où ils peuvent être lancés. Qu'en pensez-vous ? Faites-le-moi savoir dans les commentaires.