|
| 1 | +# Biblioteca cliente de JavaScript de Microsoft Graph |
| 2 | + |
| 3 | +[](https://www.npmjs.com/package/@microsoft/microsoft-graph-client) [](https://travis-ci.org/microsoftgraph/msgraph-sdk-javascript) [](https://snyk.io/test/github/microsoftgraph/msgraph-sdk-javascript) [](https://github.com/microsoftgraph/msgraph-sdk-javascript) [](https://github.com/microsoftgraph/msgraph-sdk-javascript) [](https://www.npmjs.com/package/@microsoft/microsoft-graph-client) |
| 4 | + |
| 5 | +La biblioteca cliente de JavaScript de Microsoft Graph es un envase reducido en torno a la API de Microsoft Graph que puede usarse en el lado del servidor y en el explorador. |
| 6 | + |
| 7 | +**¿Busca IntelliSense en los modelos (usuarios, grupos, etc.)? Vea el repositorio de [tipos de Microsoft Graph](https://github.com/microsoftgraph/msgraph-typescript-typings).** |
| 8 | + |
| 9 | +[](https://github.com/microsoftgraph/msgraph-typescript-typings) |
| 10 | + |
| 11 | +## Instalación |
| 12 | + |
| 13 | +### Mediante npm |
| 14 | + |
| 15 | +```cmd |
| 16 | +npm install @microsoft/microsoft-graph-client |
| 17 | +``` |
| 18 | + |
| 19 | +importe `@microsoft/microsoft-graph-client` en el módulo y también necesitará polyfills para capturar como [isomorphic-fetch](https://www.npmjs.com/package/isomorphic-fetch). |
| 20 | + |
| 21 | +```typescript |
| 22 | +import "isomorphic-fetch"; |
| 23 | +import { Client } from "@microsoft/microsoft-graph-client"; |
| 24 | +``` |
| 25 | + |
| 26 | +### Mediante etiqueta de script |
| 27 | + |
| 28 | +Incluya [graph-js-sdk.js](https://cdn.jsdelivr.net/npm/@microsoft/microsoft-graph-client/lib/graph-js-sdk.js) en la página HTML. |
| 29 | + |
| 30 | +```HTML |
| 31 | +<script type="text/javascript" src="https://cdn.jsdelivr.net/npm/@microsoft/microsoft-graph-client/lib/graph-js-sdk.js"></script> |
| 32 | +``` |
| 33 | + |
| 34 | +En caso de que el explorador no sea compatible con [Fetch](https://developer.mozilla.org/en-US/docs/Web/API/Fetch_API) \[[support](https://developer.mozilla.org/en-US/docs/Web/API/Fetch_API#Browser_compatibility)] o [Promise](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Promise) \[[support](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Promise#Browser_compatibility)], deberá usar polyfills como [github/fetch](https://github.com/github/fetch) para fetch y [es6-promise](https://github.com/stefanpenner/es6-promise) para promise. |
| 35 | + |
| 36 | +```HTML |
| 37 | +<!-- polyfilling promise --> |
| 38 | +<script type="text/javascript" src="https://cdn.jsdelivr.net/npm/es6-promise/dist/es6-promise.auto.min.js"></script> |
| 39 | + |
| 40 | +<!-- polyfilling fetch --> |
| 41 | +<script type="text/javascript" src="https://cdn.jsdelivr.net/npm/whatwg-fetch/dist/fetch.umd.min.js"></script> |
| 42 | + |
| 43 | +<!-- depending on your browser you might wanna include babel polyfill --> |
| 44 | +< script type= "text/javascript" src= "https://cdn.jsdelivr.net/npm/@babel/[email protected]/dist/polyfill.min.js"></ script> |
| 45 | +``` |
| 46 | + |
| 47 | +## Introducción |
| 48 | + |
| 49 | +### 1. Registrar su aplicación |
| 50 | + |
| 51 | +Registre su aplicación para usar la API de Microsoft Graph con uno de los siguientes portales de autenticación compatibles: |
| 52 | + |
| 53 | +- [Portal de registro de aplicaciones de Microsoft](https://apps.dev.microsoft.com): Registre una nueva aplicación que funcione con cuentas de Microsoft y/o cuentas de la organización con el punto de conexión de autenticación V2 unificado. |
| 54 | +- [Microsoft Azure Active Directory](https://manage.windowsazure.com): Registre una nueva aplicación en el espacio empresarial de Active Directory para dar soporte a los usuarios de cuentas profesionales o educativas de su espacio empresarial, o a varios espacios empresariales. |
| 55 | + |
| 56 | +### 2. Autenticarse para el servicio de Microsoft Graph |
| 57 | + |
| 58 | +La biblioteca cliente de JavaScript de Microsoft Graph tiene una implementación de adaptador ([ImplicitMSALAuthenticationProvider](src/ImplicitMSALAuthenticationProvider.ts)) para [MSAL](https://github.com/AzureAD/microsoft-authentication-library-for-js/tree/dev/lib/msal-core) (biblioteca de autenticación de Microsoft) que se ocupa de recibir el `accessToken`. La biblioteca MSAL no se incluye con esta biblioteca, el usuario debe incluirla de forma externa (para incluir MSAL, consulte [esto](https://github.com/AzureAD/microsoft-authentication-library-for-js/tree/dev/lib/msal-core#installation)). |
| 59 | + |
| 60 | +> **Nota importante:** MSAL solo es compatible con las aplicaciones front-end, para la autenticación en el servidor tiene que implementar su propio AuthenticationProvider. Obtenga información acerca de cómo puede crear un [proveedor de autenticación personalizado](./docs/CustomAuthenticationProvider.md). |
| 61 | +
|
| 62 | +#### Creación de una instancia de ImplicitMSALAuthenticationProvider en un entorno de explorador |
| 63 | + |
| 64 | +Consulte devDependencies en [package.json](./package.json) para ver la versión compatible de msal y actualícela a continuación. |
| 65 | + |
| 66 | +```html |
| 67 | +<script src="https://secure.aadcdn.microsoftonline-p.com/lib/<version>/js/msal.min.js"></script> |
| 68 | +``` |
| 69 | + |
| 70 | +```typescript |
| 71 | + |
| 72 | +// Configuration options for MSAL @see https://github.com/AzureAD/microsoft-authentication-library-for-js/wiki/MSAL.js-1.0.0-api-release#configuration-options |
| 73 | +const msalConfig = { |
| 74 | + auth: { |
| 75 | + clientId: "your_client_id", // Client Id of the registered application |
| 76 | + redirectUri: "your_redirect_uri", |
| 77 | + }, |
| 78 | +}; |
| 79 | +const graphScopes = ["user.read", "mail.send"]; // An array of graph scopes |
| 80 | + |
| 81 | +// Important Note: This library implements loginPopup and acquireTokenPopup flow, remember this while initializing the msal |
| 82 | +// Initialize the MSAL @see https://github.com/AzureAD/microsoft-authentication-library-for-js#1-instantiate-the-useragentapplication |
| 83 | +const msalApplication = new Msal.UserAgentApplication(msalConfig); |
| 84 | +const options = new MicrosoftGraph.MSALAuthenticationProviderOptions(graphScopes); |
| 85 | +const authProvider = new MicrosoftGraph.ImplicitMSALAuthenticationProvider(msalApplication, options); |
| 86 | +``` |
| 87 | + |
| 88 | +#### Creación de una instancia de ImplicitMSALAuthenticationProvider en un entorno de nodo |
| 89 | + |
| 90 | +Consulte devDependencies en [package.json](./package.json) para ver la versión compatible de msal y actualícela a continuación. |
| 91 | + |
| 92 | +```cmd |
| 93 | +npm install msal@<version> |
| 94 | +``` |
| 95 | + |
| 96 | +```typescript |
| 97 | +import { UserAgentApplication } from "msal"; |
| 98 | + |
| 99 | +import { ImplicitMSALAuthenticationProvider } from "./node_modules/@microsoft/microsoft-graph-client/lib/src/ImplicitMSALAuthenticationProvider"; |
| 100 | + |
| 101 | +// An Optional options for initializing the MSAL @see https://github.com/AzureAD/microsoft-authentication-library-for-js/wiki/MSAL-basics#configuration-options |
| 102 | +const msalConfig = { |
| 103 | + auth: { |
| 104 | + clientId: "your_client_id", // Client Id of the registered application |
| 105 | + redirectUri: "your_redirect_uri", |
| 106 | + }, |
| 107 | +}; |
| 108 | +const graphScopes = ["user.read", "mail.send"]; // An array of graph scopes |
| 109 | + |
| 110 | +// Important Note: This library implements loginPopup and acquireTokenPopup flow, remember this while initializing the msal |
| 111 | +// Initialize the MSAL @see https://github.com/AzureAD/microsoft-authentication-library-for-js#1-instantiate-the-useragentapplication |
| 112 | +const msalApplication = new UserAgentApplication(msalConfig); |
| 113 | +const options = new MicrosoftGraph.MSALAuthenticationProviderOptions(graphScopes); |
| 114 | +const authProvider = new ImplicitMSALAuthenticationProvider(msalApplication, options); |
| 115 | +``` |
| 116 | + |
| 117 | +El usuario puede integrar la biblioteca de autenticación preferida mediante la implementación de `IAuthenticationProvider` interfaz. Consulte la implementación de un [proveedor de autenticación personalizada](./docs/CustomAuthenticationProvider.md). |
| 118 | + |
| 119 | +### 3. Inicializar un objeto de cliente de Microsoft Graph con un proveedor de autenticación |
| 120 | + |
| 121 | +Una instancia de la clase **cliente** controla las solicitudes a la API de Microsoft Graph y procesa las respuestas. Para crear una nueva instancia de esta clase, tiene que proporcionar una instancia de [`IAuthenticationProvider`](src/IAuthenticationProvider.ts) que necesita pasarse como un valor para la clave `authProvider` en [`ClientOptions`](src/IClientOptions.ts) a un método de inicializador estático `Client.initWithMiddleware`. |
| 122 | + |
| 123 | +#### Para entornos de navegador |
| 124 | + |
| 125 | +```typescript |
| 126 | +const options = { |
| 127 | + authProvider, // An instance created from previous step |
| 128 | +}; |
| 129 | +const Client = MicrosoftGraph.Client; |
| 130 | +const client = Client.initWithMiddleware(options); |
| 131 | +``` |
| 132 | + |
| 133 | +#### Para entornos de nodo |
| 134 | + |
| 135 | +```typescript |
| 136 | +import { Client } from "@microsoft/microsoft-graph-client"; |
| 137 | + |
| 138 | +const options = { |
| 139 | + authProvider, // An instance created from previous step |
| 140 | +}; |
| 141 | +const client = Client.initWithMiddleware(options); |
| 142 | +``` |
| 143 | + |
| 144 | +Para obtener más información sobre cómo inicializar el cliente, consulte [este documento](./docs/CreatingClientInstance.md). |
| 145 | + |
| 146 | +### 4. Realizar solicitudes a Graph |
| 147 | + |
| 148 | +Una vez que haya configurado la autenticación y una instancia del cliente, puede empezar a realizar llamadas al servicio. Todas las solicitudes deberían empezar con `client.api(path)` y terminar con una [acción](./docs/Actions.md). |
| 149 | + |
| 150 | +Obtención de detalles de usuario |
| 151 | + |
| 152 | +```typescript |
| 153 | +try { |
| 154 | + let userDetails = await client.api("/me").get(); |
| 155 | + console.log(userDetails); |
| 156 | +} catch (error) { |
| 157 | + throw error; |
| 158 | +} |
| 159 | +``` |
| 160 | + |
| 161 | +Enviar un correo electrónico a los destinatarios |
| 162 | + |
| 163 | +```typescript |
| 164 | +// Construct email object |
| 165 | +const mail = { |
| 166 | + subject: "Microsoft Graph JavaScript Sample", |
| 167 | + toRecipients: [ |
| 168 | + { |
| 169 | + emailAddress: { |
| 170 | + |
| 171 | + }, |
| 172 | + }, |
| 173 | + ], |
| 174 | + body: { |
| 175 | + content: "<h1>MicrosoftGraph JavaScript Sample</h1>Check out https://github.com/microsoftgraph/msgraph-sdk-javascript", |
| 176 | + contentType: "html", |
| 177 | + }, |
| 178 | +}; |
| 179 | +try { |
| 180 | + let response = await client.api("/me/sendMail").post({ message: mail }); |
| 181 | + console.log(response); |
| 182 | +} catch (error) { |
| 183 | + throw error; |
| 184 | +} |
| 185 | +``` |
| 186 | + |
| 187 | +Para obtener más información, consulte: [Patrón de llamada](docs/CallingPattern.md), [acciones](docs/Actions.md), [parámetros de consulta](docs/QueryParameters.md), [métodos de la API](docs/OtherAPIs.md) y [más](docs/). |
| 188 | + |
| 189 | +## Documentación |
| 190 | + |
| 191 | +- [Procesamiento por lotes](docs/content/Batching.md) |
| 192 | +- [Tarea de carga de archivos de gran tamaño](docs/tasks/LargeFileUploadTask.md) |
| 193 | +- [Iterador de páginas](docs/tasks/PageIterator.md) |
| 194 | +- [Acciones](docs/Actions.md) |
| 195 | +- [Parámetros de consulta](docs/QueryParameters.md) |
| 196 | +- [Otras API](docs/OtherAPIs.md) |
| 197 | +- [Obtener respuesta sin procesar](docs/GettingRawResponse.md) |
| 198 | + |
| 199 | +## Preguntas y comentarios |
| 200 | + |
| 201 | +Nos encantaría recibir sus comentarios sobre la biblioteca cliente de JavaScript de Microsoft Graph. Puede enviarnos sus preguntas y sugerencias a través de la sección [Problemas](https://github.com/microsoftgraph/msgraph-sdk-javascript/issues) de este repositorio. |
| 202 | + |
| 203 | +## Colaboradores |
| 204 | + |
| 205 | +Vea la [directrices de contribución](CONTRIBUTING.md). |
| 206 | + |
| 207 | +## Recursos adicionales |
| 208 | + |
| 209 | +- [Sitio web de Microsoft Graph](https://graph.microsoft.io) |
| 210 | +- [Tipos de TypeScript de Microsoft Graph](https://github.com/microsoftgraph/msgraph-typescript-typings/) |
| 211 | +- [Crear aplicaciones de página única en Angular con Microsoft Graph](https://github.com/microsoftgraph/msgraph-training-angularspa) |
| 212 | +- [Crear aplicaciones Node.js Express con Microsoft Graph](https://github.com/microsoftgraph/msgraph-training-nodeexpressapp) |
| 213 | +- [Centro para desarrolladores de Office](http://dev.office.com/) |
| 214 | + |
| 215 | +## Avisos de terceros |
| 216 | + |
| 217 | +Consulte [avisos de terceros](./THIRD%20PARTY%20NOTICES) para obtener información sobre los paquetes que se incluyen en [package.json](./package.json) |
| 218 | + |
| 219 | +## Informes de seguridad |
| 220 | + |
| 221 | +Si encuentra un problema de seguridad con nuestras bibliotecas o servicios, informe a [[email protected]](mailto:[email protected]) con todos los detalles posibles. Es posible que el envío pueda optar a una recompensa a través del programa [Microsoft Bounty ](http://aka.ms/bugbounty). No publique problemas de seguridad en problemas de GitHub ni ningún otro sitio público. Nos pondremos en contacto con usted rápidamente tras recibir la información. Le animamos a que obtenga notificaciones de los incidentes de seguridad que se produzcan; para ello, visite [esta página ](https://technet.microsoft.com/en-us/security/dd252948) y suscríbase a las alertas de avisos de seguridad. |
| 222 | + |
| 223 | +## Licencia |
| 224 | + |
| 225 | +Copyright (c) Microsoft Corporation. Todos los derechos reservados. Publicado bajo la licencia MIT (la "[Licencia](./LICENSE)"). |
| 226 | + |
| 227 | +## Valoramos y nos adherimos al Código de conducta de código abierto de Microsoft |
| 228 | + |
| 229 | +Este proyecto ha adoptado el [Código de conducta de código abierto de Microsoft ](https://opensource.microsoft.com/codeofconduct/). Para obtener más información, vea [Preguntas frecuentes sobre el código de conducta ](https://opensource.microsoft.com/codeofconduct/faq/) o póngase en contacto con [[email protected]](mailto:[email protected]) si tiene otras preguntas o comentarios. |
0 commit comments