Google Chrome Video Tutorial: Crea un’estensione | Grafikart, procedere alla connessione degli utenti da un’estensione Chrome | Piattaforma di identità della documentazione | Google Cloud
Collega gli utenti da un’estensione di Chrome
Vogliamo creare un’estensione che funzioni su un sistema pop-up. Per creare quest’ultimo, dobbiamo solo creare una classica pagina HTML. Come configurato nel file manifest.Json useremo un file popup.html
Google Chrome Tutorial: crea un’estensione
Ti invito a scoprire come creare un’estensione per il browser Web di Google Chrome. Creare un’estensione può sembrare complessa, ma non spaventare ! In effetti, le estensioni di Google Chrome possono essere create con lingue che conosciamo bene: JS, HTML e CSS.
Il piccolo prerequisito
Per prima cosa devi attivare il modalità sviluppatore nelle impostazioni di Chrome per poter caricare la tua estensione. Per fare ciò, vai alle tue impostazioni> Altre strumenti> Estensioni e controlla la casella modalità sviluppatore. Dovresti quindi vedere tre nuovi pulsanti sembrano caricare estensioni.
Configura la tua estensione
Il punto di partenza per la creazione di un’estensione è la creazione di un file manifest.JSON alla radice del tuo file. Conterrà tutte le informazioni relative alla configurazione dell’estensione come il nome, la descrizione, gli script da caricare.
< "manifest_version": 2, // Indique la version du manifest (toujours 2) "name": "Tutoriel créer une extension", // Le nom de votre extension "description": "Chaine YT Plati'Script", // La description "version": "1.0", // La version en en l'occurrence la première donc 1.0 "permissions": [ // Les permissions, on y reviendra plus bas "http://*/*", "https://*/*", ], "browser_action": < // Les paramètres "default_icon" : "img/icon.png", // L'icône qui s'affiche en haut à droite de votre navigateur "default_popup": "popup.html" // Le popup qui s'affichera quand vous cliquez sur l'îcone >, "Icone": < // L'îcone qui s'affichera lorse que vous êtes sur la page extensions des paramètre "128" : "img/icon_128.png" // 128 = 128x128 la taille de votre image >>Tutti i parametri disponibili per questo file sono descritti nella documentazione.
Autorizzazioni
Per impostazione predefinita la tua estensione sarà in una sorta di sandbox e non avrà accesso a nulla. In alcuni casi, vogliamo creare estensioni in grado di comunicare con le pagine Web o con alcune API del browser. Sarà quindi necessario specificare nella nostra configurazione quali autorizzazioni desideriamo ottenere (queste autorizzazioni saranno richieste durante l’installazione dell’estensione). Queste autorizzazioni possono assumere due forme:
- Una stringa di caratteri che rappresenta un particolare tipo di autorizzazione, ad esempio l’accesso alle schede delle schede (elenco di autorizzazioni)
- Un motivo che rappresenta un formato URL a cui accederemo (match patterns)
"Permessioni": [// Autorizzazioni, torneremo sotto "http: //*/*", "https: //*/*", "schede" // Le schede è l'autorizzazione per creare nuove schede],Per “http: ///“e” https: ///“, Gli diciamo che l’estensione può funzionare su tutte le pagine HTTP o HTTPS.
Crea un pop-up
Vogliamo creare un’estensione che funzioni su un sistema pop-up. Per creare quest’ultimo, dobbiamo solo creare una classica pagina HTML. Come configurato nel file manifest.Json useremo un file popup.html
H1, p Buongiorno
Ciao sono un semplice popup
Chi non occupa molto spazio
Questo è tutto ciò che dobbiamo fare per il momento, quando facciamo clic sul pulsante Chrome aprirà automaticamente il pop-up modificando la pagina che abbiamo appena scritto.
Metti alla prova la sua estensione
Ora vogliamo testare la nostra estensione, per questo dovremo passare attraverso il pannello di estensione e fare clic sul pulsante di carica TET, quindi selezionare la cartella contenente la tua estensione. Automaticamente, dovresti vedere apparire l’icona della tua estensione.
Sceneggiatura
Necessariamente un’estensione che mostra un pop-up, è relativamente limitato ! Fortunatamente, possiamo usare JavaScript per aggiungere comportamenti diversi alla nostra estensione. Esistono diversi modi per caricare JavaScript a seconda di ciò che vuoi realizzare.
Javascript in pop-up
È prima di tutto possibile caricare JavaScript direttamente nel pop-up. In effetti, questa è una classica pagina Web su cui possiamo caricare qualsiasi file JavaScript con il tag .
// cariciamo il nostro script nel contenuto HTML H1, P Buongiorno
Ciao sono un semplice popup
Chi non occupa molto spazio
Detto questo, il file JavaScript verrà caricato solo all’apertura del pop-up, improvvisamente se l’utente non supporta mai il pulsante, il tuo JavaScript non verrà mai eseguito
JavaScript in “Background”
È anche possibile eseguire JavaScript in background per mantenere attivo il codice anche quando il pop-up non viene distribuito. Per fare ciò, dovranno cambiare il file manifest.JSON per includere il percorso del file JavaScript che vogliamo caricare.
Gli script di contenuto
IL Script felici sono file JavaScript che verranno eseguiti nel contesto della pagina web e che possono interagire con esso usando il DOM. A differenza degli script lanciati dallo sfondo, questi script non hanno accesso alle API Chrome.*. Inoltre, operano relativamente isolati e non hanno accesso a funzioni JavaScript che sarebbero definite nella pagina Web su cui vengono iniettate.
Questo tipo di carico verrà utilizzato quando si desidera interagire direttamente con la pagina Web per modificare la dimensione del carattere o manipolare determinati elementi.
Notifiche cromate
Infine, piccolo bonus riguardante le notifiche. Su Google Chrome è possibile gestire un sistema di notifica che verrà visualizzato sul desktop dell’utente. Se si desidera utilizzare questa API, dovrai chiedere l’autorizzazione in anticipo nel file manifest.JSON .
"Autorizzazioni": [// Permessioni, torneremo sotto "http: //*/*", "https: //*/*", "schede", // Le schede è il permesso di creare nuove schede "Notificazioni" // attiva le notifiche],Una volta fatto ciò, possiamo usare la classe consentendo di gestire le notifiche.
Notifica var = new Notification ('Titolo del Notivo !', < icon: 'votreicon.jpg', body: "Votre petite description de la notification", >);Questa classe non è unica per Google Chrome, ma è una nuova API o blocca in diversi browser. Se vuoi avere maggiori informazioni su come funziona, ti invito a guardare la documentazione. Il vantaggio nel caso di un’estensione è che l’utente ha già accettato le autorizzazioni che consentono alle notifiche di iniziare direttamente.
Collega gli utenti da un’estensione di Chrome
Questo documento spiega come utilizzare la piattaforma di identità per connettere gli utenti da un’estensione di Chrome.
Importante : La piattaforma di identità è compatibile solo con le estensioni che utilizzano V2. Manifest v3 non è compatibile perché non fornisce operazioni pop-up. Importante: L’uso di un telefono o di un’autenticazione multifattore da un’estensione Chrome non è disponibile.
Prima che inizi
- Attiva la piattaforma di identità e configura un provider di identità. Per scoprire come, vedi Fast Start -Up.
- Aggiungi i seguenti URL all’elenco delle autorizzazioni di content_security_policy della tua estensione:
- https: // API.Google.com
- https: // www.gstatic.com
- https: // www.Googleapis.com
- https: // secureToken.Googleapis.com
Per ulteriori informazioni, consultare la documentazione CSP.
Salva l’ID della tua estensione
Per connettere gli utenti da un’estensione di Chrome, è necessario salvare l’ID di estensione come dominio autorizzato:
- Accedi alla pagina Impostazioni Piattaforma di identità nella console di Google Cloud. Accedi alla pagina Impostazioni
- Fai clic sulla scheda Sicurezza.
- Nella sezione Domini autorizzati (Aree autorizzate), fare clic su Aggiungi dominio (Aggiungi un dominio).
- Inserisci l’URI della tua estensione. Questa estensione normalmente ricorda questo: Chrome-Expension: // Chrome_Extension_ID .
- Clicca su Aggiungere.
Procedere alla connessione degli utenti
La connessione utente da un’estensione di Chrome è simile a un’applicazione Web, ad alcune differenze:
- L’autenticazione telefonica e multifattore non è supportata.
- Le estensioni di Chrome non possono utilizzare i reindirizzamenti HTTP. È quindi necessario utilizzare le operazioni pop-up (SignInWithPopup () e LinkWithPopup ()) per connettere gli utenti.
- La chiamata per i metodi di autenticazione da un’azione del browser annulla l’azione del browser. Quindi dovresti preferire chiamarli da uno script in background.
- I metodi pop-up possono essere utilizzati solo nelle estensioni che usano manifest v2.
Il seguente esempio illustra la connessione di un utente con Google:
JavaScript
apparire.js
// Ottieni riferimento alla pagina di sfondo. Const bgage = Chrome.estensione.GetBackGroundPage (); // Accedi al popup, in genere allegato al pulsante Click. bgpage.SignInWithPopup ();sfondo.js
Const app = Firebase.InitializeApp (config); Const auh = app.autore (); Const SignInWithPopup = () => < const provider = new firebase.auth.GoogleAuthProvider(); return auth.signInWithPopup(provider).catch((error) =>< console.log(error); >); >;Seguenti passaggi
- Connetti gli utenti con diversi provider di identità.
- Ulteriori informazioni sugli utenti della piattaforma di identità.
Commento
Se non diversamente indicato, il contenuto di questa pagina è regolato da una licenza Creative Commons Assegnazione 4.0 e i campioni di codice sono regolati da una licenza Apache 2.0. Per ulteriori informazioni, consultare le regole del sito degli sviluppatori di Google. Java è un marchio registrato di Oracle e/o delle sue società affiliate.
Ultimo aggiornamento sul 2023/06/17 (UTC).
Ringcentral per l’estensione di Google Chrome
Rimani aggiornato con le ultime funzionalità, miglioramenti e correzioni di bug da RingCentral per l’estensione di Google Chrome.
Versione 21.3.30 (RC)
Data di rilascio : 29/09/2021
- Possibilità di nascondere il profilo utente nella directory dell’azienda
Correzioni di palude
- Visualizzazione del logo RC in una finestra mobile
- Icona non disturbare
Data di rilascio : 28/07/2021
- Possibilità di aggiungere i dettagli del Video RingCentral del connettore della stanza nei tuoi inviti a una riunione
Data di rilascio : 22/01/2021
- Video Ringcentral:
- Attivazione della sala d’attesa
- Numeri di accesso globale
- Composizione automatica della password dagli inviti via e-mail
- Applicazione automatica di una password per riunioni non -PMI
- Conformità ai valori dei parametri di blocco del servizio Web
- Video Ringcentral
- Aggiornamento dell’etichetta “Unisciti prima dell’host” sostituendolo con “I partecipanti possono unirsi alla riunione solo dopo di me”
- Miglioramento della password UX
Data di rilascio : 23/09/2020
- La pagina dei dettagli di contatto ora include un campo per il sito
- Il numero di estensione viene ora visualizzato con codici del sito attivati
- Possibilità di cercare contatti con il numero di estensione breve
- Composizione di un numero di estensione breve
- Fusion of 3 Opzioni di chiamata Ringout in un’unica opzione di Ringout
Data di rilascio : 31/07/2020
- Possibilità di autorizzare solo gli utenti autenticati per unirsi alle riunioni
- Opzione di condivisione dello schermo riservata solo per host e moderatori
- Categoria di opzioni di sicurezza aggiuntive
- Ricezione delle notifiche per le modifiche all’estensione al fornitore video
- Utilizzo dell’applicazione RingCentral come terminazione delle chiamate
Correzioni di palude
- Impossibile effettuare chiamate di emergenza
Data di rilascio : 18/05/2020
- Definizione di Ringout dall’ID del Web Caller come ID predefinito
Correzioni di palude
- Display di numeri trasferiti all’elenco delle chiamate dei chiamanti
Data di rilascio : 22/04/2020
- Aggiunta di una password di incontro per le riunioni pianificate
- Disattivazione della funzionalità “Unisciti prima dell’host”
Data di rilascio : 04/09/2020
Correzioni di palude
- Risolto la doppia riunione delle opzioni nel menu a discesa della conferenza su Google Agenda.
Data di rilascio : 02/04/2020
Correzioni di palude
- Risoluzione del problema della scadenza delle riunioni dopo 24 ore.
- Correzione del numero del numero per comporre riunioni Ringcentral
Data di rilascio : 28/10/2019
- Opzione per nascondere la divulgazione della conformità per un uso limitato per aderire alla politica di Google
- Eliminazione della scheda Gmail nelle attività recenti (per controllare con successo Google, non chiamare l’API Gmail)
- Aggiunta della divulgazione della conformità per un uso limitato per aderire alla politica di Google
- Gestione della lista nera C2D/SMS
- Movimento dell’opzione Aggiungi un incontro nell’elenco drop -down “Aggiunta della conferenza”
- L’estensione dell’agenda di Google è una priorità se viene installato anche RingCentral per Google.
- L’iniezione C2D interferisce con gli editori HTML/TESTO, in particolare con radaio
- Visualizzazione errata dell’icona Click per chiamare in Google Agenda
- Modifica dell’API di contatto di Google per la nuova autorizzazione di estensione
- Miglioramento del monitor delle chiamate remote nella pagina tutte le chiamate
- Opzione per mascherare la riunione se l’utente non è connesso
- Eliminazione del numero di versione nella pagina di notizie
Correzioni di palude
- La ricerca sulla pagina dei contatti può talvolta causare l’applicazione dell’applicazione
- Impossibile abbinare il contatto di Google
- Disabilitazione del pulsante da inviare alla pagina di conversazione dopo l’invio del messaggio
- Impossibile aggiornare correttamente lo stato della presenza
- Ritarda e salta dal cursore alla fine del testo quando si inseriscono i messaggi
- Il collage dei numeri di telefono in un campo di contenuto modificabile può attivare un’iniezione C2D
- Old RingCentral Logo su nuove pagine
- Opzione di reunion RingCentral mancante nell’elenco “Aggiunta di conferenze” nella pagina dell’agenda di Google
- Display delle informazioni più recenti sulla conferenza dopo l’aggiornamento/modifica
- Aggiunta della home page per nuovi prodotti
- L’iniezione fai clic per chiamare/inviare un SMS a volte non appare nella posizione giusta.
- Opzioni Fare clic per chiamare e fare clic per inviare un SMS di base su qualsiasi pagina Web
- Tutti i controlli delle chiamate (tranne che chiedono chiamate e chiamate per le chiamate)
- Accesso all’estensione RingCentral su qualsiasi pagina Web Chrome
- Nuova interfaccia utente
- SMS professionali e SMS interni
- Sincronizzazione delle directory di Google e Ringcentral
- Accesso alla directory da SMS
- Accesso alla directory dalla numerazione
- Attivazione della funzionalità di messaggistica vocale/fax
- Attivazione della funzionalità di teleconferenza
- Biglietto da visita dettagliato
- Integrazione dell’agenda di Google
- Possibilità di inserire il prototipo funzionale sull’elenco nero/nero (per impedire a alcuni siti Web di visualizzare l’interfaccia utente RingCentral e C2D)
- Invio di un appello alla messaggistica vocale
- Trasferimento di chiamate in arrivo
- Risposta da parte di SMS a una chiamata in arrivo
- Modifica dello stato di presenza
- Ringcentral Meetings Collaboration Support
- Contattaci modulo
- Notizia
- Supporto Ringcentral a
- Google Ho per le conferenze Ringcentral
- BADGE ERRORE WEBRTC (visualizzazione di una notifica di errore in caso di un problema con la chiamata WebRTC)
- Notifica di chiamata che entra nel badge Ringcentral quando l’applicazione è ridotta (oltre alla notifica del browser)