Stratégie de développement_Côté client

Ce guide de développement convient au processus de vérification d'autorisation pour l'obtention d'un jeton d'accès à l'aide de la méthode Implicit Grant. Il convient aux méthodes qui nécessitent un accès client, telles que le code javascript via le navigateur ou l'ordinateur. /terminaux mobiles Lorsque le client y accède.

Avant de lire ce guide de développement, veuillez lire [QQ Login] Utilisation d'une subvention implicite pour obtenir un jeton d'accès pour comprendre le processus d'authentification.

1. Essayez-le

1 Visitez le navigateur : http://qzs.qq.com/qzone/openapi/client.html .
2. Cliquez sur le bouton « Connexion » sur la page :

3. Entrez le compte QQ et le mot de passe dans la boîte de connexion contextuelle :

4. Après une connexion réussie, accédez à l'adresse de rappel spécifiée, à l'URL. contient un jeton d'accès :

2. Commencez rapidement

Préparation

1. Veuillez vous assurer que votre site Web a soumis une demande d'accès à la connexion QQ et a obtenu avec succès l'appid et la clé d'application. Demandez l'accès
2. Veuillez envoyer une requête ping à openapi.qzone.qq.com sur votre serveur pour assurer une connexion fluide entre le site Web et Qzone.

Étape 1 : Placez le bouton de connexion QQ

Le site Web doit télécharger l'image du bouton « Connexion QQ » et placer le bouton à l'emplacement approprié sur la page conformément aux spécifications de l'interface utilisateur.
Spécification de l'emplacement du bouton de téléchargement de l'icône du bouton

Étape 2 : Obtenir le jeton d'accès

1 Ouvrez le navigateur et visitez l'adresse suivante (veuillez remplacer client_id, redirect_uri, scope et autres valeurs de paramètres par les vôtres) :
.

2. Si l'utilisateur est déjà connecté, une page de confirmation apparaîtra. Si vous n'êtes pas connecté, une page de connexion apparaîtra, comme le montre la figure ci-dessous :

3. Après une connexion réussie, une boîte d'autorisation apparaîtra pour guider l'utilisateur à autoriser (la page d'autorisation n'apparaîtra que lorsque accéder à une OpenAPI pour la première fois), comme le montre la figure ci-dessous :

REMARQUE :
Si l'utilisateur ne l'autorise pas, l'opération d'accès sera annulée.
Il est recommandé que les applications tierces contrôlent les éléments d'autorisation, c'est-à-dire que seul le nom OpenAPI qui doit être utilisé est transmis dans la portée de la valeur du paramètre. Car plus il y a d’éléments d’autorisation, plus l’utilisateur est susceptible de refuser l’autorisation.

4. Si l'utilisateur autorise l'autorisation, il accédera avec succès au redirect_uri spécifié, ajoutera "#" après l'URL et apportera le jeton d'accès, expires_in et d'autres paramètres. S'il y a déjà un signe "#" après l'adresse redirect_uri, ajoutez un signe "&" et apportez les paramètres de retour correspondants. Par exemple, l'adresse de rappel est : www.qq.com, elle passera à :

Conseil spécial :
1 . Le redirect_uri transmis lors de la requête doit être cohérent avec l'adresse de rappel renseignée lors de l'inscription, et est utilisé pour l'authentification des applications tierces.
2. Vous pouvez utiliser la méthode js : window.location.hash pour obtenir la valeur du paramètre après # dans l'URL. Voir l'exemple de code ci-dessous pour plus de détails.
3. Il est recommandé d'utiliser js pour définir des cookies afin de stocker les jetons.
4. Le token d'accès obtenu est valable 3 mois et sera automatiquement actualisé lorsque l'utilisateur se reconnectera.

Étape 3 : Utilisez le jeton d'accès pour obtenir l'OpenID de l'utilisateur

1 Envoyez une demande à l'adresse suivante (veuillez remplacer access_token et les autres valeurs de paramètres par les vôtres) :

2 Obtenez l'OpenID de l'utilisateur et renvoyez le package suivant :

callback( {"client_id":"YOUR_APPID","openid":"YOUR_OPENID"} );

Étape 4 : Utilisez le jeton d'accès et OpenID pour accéder et modifier les données utilisateur

1 Il est recommandé que le site Web appelle l'interface get_user_info après la connexion de l'utilisateur pour obtenir l'avatar et le pseudo de l'utilisateur et les afficher sur le site Web. pour améliorer l’expérience utilisateur unifiée.
2. Appelez un autre OpenAPI pour accéder et modifier les données utilisateur. Pour plus de détails sur toutes les OpenAPI, veuillez vous référer au document API [QQ Login].

Prenons l'exemple de l'appel de l'interface get_user_info :
(1) Envoyez une demande à l'URL de get_user_info (veuillez remplacer access_token, appid et autres valeurs de paramètres par les vôtres) :

(2) Après un retour réussi, les données utilisateur peuvent être obtenues :

   "ret":0,
   "msg":"",
   "nickname":"YOUR_NICK_NAME",
   ...

3. Exemple de code

Un exemple JavaScript est donné ci-dessous (il vous suffit de modifier une partie du code en fonction des commentaires pour exécuter)

<html>
                                                                                  

Site Web PHP chinois

MaisonCoursArticleQuestions et réponsesDictionnaireManuelTéléchargerrecherche APPTélécharger