Cette page du tutoriel Google Cloud Search explique comment configurer de recherche à l'aide du widget Recherche intégrable. Pour commencer ce tutoriel depuis le début, Tutoriel de mise en route de Cloud Search
Installer des dépendances
Si le connecteur n'a pas fini d'indexer le référentiel, ouvrez une nouvelle interface système et continuer sur cette page.
À partir de la ligne de commande, remplacez le répertoire par
cloud-search-samples/end-to-end/search-interface
Pour télécharger les dépendances requises pour exécutez la commande suivante:
npm install
Créer les identifiants de l'application de recherche
Le connecteur requiert les identifiants du compte de service pour appeler la fonction API. Pour créer les identifiants:
Revenez à la console Google Cloud.
Dans le volet de navigation de gauche, cliquez sur Identifiants.
Dans la liste déroulante Create credentials (Créer des identifiants), sélectionnez ID client OAuth : L'option "Créer un ID client OAuth" s'affiche.
(Facultatif) Si vous n'avez pas configuré l'écran de consentement, cliquez sur CONFIGURER L'ÉCRAN D'AUTORISATION Le paramètre "Consentement OAuth" s'affiche.
Cliquez sur Interne, puis sur CRÉER. Un autre "consentement OAuth" écran s'affiche.
Renseignez les champs obligatoires. Pour plus d'instructions, adressez-vous à l'utilisateur de la section "Consentement" Configurer OAuth 2.0
Cliquez sur la liste déroulante Type d'application, puis sélectionnez Application Web.
Dans le champ Nom, saisissez "tutorial".
Dans le champ Origines JavaScript autorisées, cliquez sur Ajouter un URI. Une zone vide "URI" s'affiche.
Dans le champ URI, saisissez
http://localhost:8080
.Cliquez sur CRÉER. "Client OAuth créé" s'affiche.
Notez l'ID client. Cette valeur sert à identifier l'application lorsque demandant l'autorisation de l'utilisateur avec OAuth2. Le code secret du client n'est pas obligatoire pour cette implémentation.
Cliquez sur OK.
Créer l'application de recherche
Créez ensuite une application de recherche dans la console d'administration. L'application de recherche est une représentation virtuelle de l'interface de recherche et de son configuration.
- Revenez à la console d'administration Google.
- Cliquez sur l'icône Applications. Dans "Administration des applications", s'affiche.
- Cliquez sur Google Workspace. La section "Apps Google Workspace administration" s'affiche.
- Faites défiler la page vers le bas et cliquez sur Cloud Search. "Paramètres de Google Workspace" page s'affiche.
- Cliquez sur Applications de recherche. La page "Applications de recherche" s'affiche.
- Cliquez sur le bouton + jaune rond. La fenêtre "Créer une application de recherche" s'affiche.
- Dans le champ Nom à afficher, saisissez "tutorial".
- Cliquez sur CRÉER.
- Cliquez sur l'icône en forme de crayon à côté de l'application de recherche que vous venez de créer. ("Modifier l'application de recherche"). L'option "Rechercher les détails de l'application" s'affiche.
- Notez l'ID application.
- À droite de Sources de données, cliquez sur l'icône en forme de crayon.
- À côté de "Tutoriel", cliquez sur le bouton Activer. Ce bouton permet d'activer la source de données du tutoriel pour l'application de recherche que vous venez de créer.
- À droite du "tutoriel" source de données, cliquez sur Options d'affichage.
- Vérifiez tous les attributs.
- Cliquez sur ENREGISTRER.
- Cliquez sur OK.
Configurer l'application Web
Après avoir créé les identifiants et l'application de recherche, mettez-la à jour. pour inclure ces valeurs comme suit:
- À partir de la ligne de commande, remplacez le répertoire par `cloud-search-samples/end-to-end/search-interface/public.'
- Ouvrez le fichier
app.js
dans un éditeur de texte. - Recherchez la variable
searchConfig
en haut du fichier. - Remplacez
[client-id]
par l'ID client OAuth créé précédemment. - Remplacez
[application-id]
par l'ID de l'application de recherche noté dans le dans la section précédente. - Enregistrez le fichier.
Exécuter l'application
Démarrez l'application en exécutant la commande suivante:
npm run start
Interroger l'index
Pour interroger l'index à l'aide du widget Recherche:
- Ouvrez votre navigateur et accédez à
http://localhost:8080
. - Cliquez sur Se connecter pour autoriser l'application à interroger Cloud Search. en votre nom.
- Dans le champ de recherche, saisissez une requête, comme le mot "test". et appuyez sur Entrée. La page doit afficher les résultats de la requête, ainsi que les attributs et des commandes de pagination pour parcourir les résultats.
Examiner le code
Les autres sections examinent la construction de l'interface utilisateur.
Charger le widget
Le widget et les bibliothèques associées sont chargés en deux phases. Tout d’abord, l’amorçage est chargé:
Ensuite, le rappel onLoad
est appelé une fois le script prêt. Elle charge ensuite
le client API Google, Google Sign-In et les bibliothèques de widgets Cloud Search.
Le reste de l'initialisation de l'application est géré par initializeApp
une fois toutes les bibliothèques
requises chargées.
Gérer l'autorisation
Les utilisateurs doivent autoriser l'application à effectuer des requêtes en leur nom. Bien que le widget peut inviter les utilisateurs à donner leur autorisation, vous pouvez améliorer l'expérience utilisateur en gérant vous-même l'autorisation.
Pour l'interface de recherche, l'application propose deux affichages différents selon sur l'état de connexion de l'utilisateur.
Pendant l'initialisation, la vue appropriée est activée et les gestionnaires de les événements de connexion et de déconnexion sont configurés:
Créer l'interface de recherche
Le widget Recherche nécessite une petite quantité de balisage HTML pour la recherche et de stocker les résultats de recherche:
Le widget est initialisé et lié aux éléments d'entrée et de conteneur. pendant l'initialisation:
Félicitations, vous avez terminé le tutoriel. Continuer sur pendant les instructions de nettoyage.