Ecrans et affichage Players

Dans cet exemple, vous entrez le nom d'utilisateur, l'ID et le mot de passe de votre compte. En cliquant sur le bouton, une liste HTML non ordonnée affichera le compte players. Pour chaque player le player L'ID, le nom et la date de création seront affichés.

Vue d'ensemble

Pour en savoir plus sur l'approche générale concernant l'architecture de cet exemple d'application, en particulier l'authentification et les implémentations AJAX, voir exemples qui utilisent HTTPRequest.

Architecture d'application

La logique d'application de haut niveau pour cette application est la suivante:

Recueillir les données utilisateur nécessaires pour accéder au compte
Au clic sur le bouton, effectuez un appel AJAX pour récupérer tous player info
Sur le succès d'appel AJAX, effectuez les opérations suivantes:
- Injecter des données de réponse JSON dans la page HTML
- Créez dynamiquement du HTML qui affiche player informations dans une liste ordonnée et injectez-les dans la page HTML

Exemple d'application

Retrouvez tout le code associé à cet exemple dans ce dépôt GitHub.

Voir le stylo Ecrans et affichage Players par Brightcove Learning Services (@rcrooks1969) Sur CodePen.

Utilisation du CodePen

Voici quelques conseils pour utiliser efficacement le CodePen ci-dessus:

Basculer l'affichage réel du player en cliquant sur le Le résultat .
Cliquez HTML / CSS / JS boutons pour afficher l'un des types de code.
Cliquez Modifier sur CodePen dans le coin supérieur droit pour bifurquer ce CodePen dans votre propre compte.
Trouver tout le code associé à cet exemple dans cette GitHub référentiel.

Code de proxy

Pour créer votre propre version de l'exemple d'application sur cette page, vous devez créer et héberger votre propre proxy. (Les proxys utilisés par Brightcove Learning Services acceptent uniquement les demandes des domaines Brightcove.) Un exemple de proxy, très similaire à celui que nous utilisons, mais sans les vérifications qui bloquent les demandes des domaines non Brightcove, se trouve dans ce dépôt GitHub. Vous y trouverez également des instructions de base pour l’utiliser, ainsi qu’un guide plus élaboré sur la création d’applications autour du proxy dans Utilisation des API REST.