JavaScript Avanzado: Solicitudes Async y Ajax

Bienvenido a nuestro JavaScript avanzado capítulo aquí sobre funcionalidad asíncrona y multiproceso. Y lo primero que queremos hacer para configurar si desea seguir los ejercicios en este capítulo, ciertamente hay una variedad de formas para conseguir un servicio web o algo que pasa por un servicio web porque vamos a hacer llamadas a Ajax y promesas y Async y queremos poder tener algo que podamos llamar para conseguirnos algo de información. Entonces, lo que uso es Visual Studio. Esta es la comunidad de Visual Studio, disponible gratuitamente, descarga gratuita en la web. Y lo que voy a hacer es en solo un par de minutos aquí, voy a crear un proyecto que tenga un servicio al que podamos llamar. Así que lo crearemos primero, y luego le agregaremos algo de estructura para que podamos hacer algunas cosas con él más tarde. Así que voy a crear un proyecto completamente nuevo. Y en el mundo de Microsoft, hay una aplicación web a la que agregamos funcionalidad. Así que solo elegiré la aplicación web principal de asp.net. Esa es la versión actual de.net y llamarlo como queramos llamarlo allí. Y cuando llegue a este lugar aquí es donde voy a elegir qué tipo de la aplicación web para hacerlo. ¿Qué voy a poner en ese caparazón vacío? Entonces aquí voy a elegir la API. Esto es algo que podríamos utilizar para crear una web. API que pondría los datos a disposición de otros desarrolladores dentro o fuera de nuestra organización, no importa. Simplemente elija API allí. Y voy a desmarcar para configurar eso para HTTPS porque eso no es parte de esta demostración. Aunque probablemente, ciertamente algo que quieras hacer en la vida real cuando crea una API web. Todo lo que necesito hacer desde aquí es presionar crear y esto va a crear el caparazón de este proyecto para mí. Ni siquiera el caparazón lo que terminamos obteniendo es un servicio. Así que esto está bajo los controladores y en el núcleo, la forma en que se manifiesta la API web en el lado del servidor es esta clase de controlador. Así que nos devolverá un pronóstico del tiempo. y de hecho ya tenemos un código ahí y podemos probar haciendo un get. Ahora, no voy a entrar mucho en el código de Do sostenido. Ciertamente tampoco tienes que hacerlo pero esto nos permitirá hacer una solicitud de obtención de JavaScript. Ahora, hay un par de cosas más que debemos hacer. si vamos a utilizar este proyecto. Y vamos a decir agregue paquetes, digamos como jQuery, por ejemplo. Y lo que tenemos que hacer es ingresar a nuestro archivo de inicio aquí. Lo que quiero poder hacer es servir archivos estáticos que sean en una variedad de directorios. Así que voy a entrar aquí a mi método de configuración. Usar archivos estáticos me permite servir archivos que son en una carpeta raíz de tres w, y ese nombre es importante porque eso es lo que buscará el tiempo de ejecución. Así que voy a seguir adelante y agregar eso allí. aunque todavía no hay nada en él. Y este, si usa NPM, entonces queremos poder usar los paquetes que instalamos en el proyecto usando el administrador de paquetes de nodos y este pequeño código permitirá que eso suceda para nosotros. Y aquí mismo con los menús desplegables, solo estoy agregando los espacios de nombres que necesitamos para que eso suceda. Así que puedes copiar eso literalmente. Y luego, en la parte superior de su archivo, se asegurará que tienes todo de los que usan declaraciones que solo traen el código en el alcance, para que podamos usarlo aquí. Eso debería funcionar para nuestra configuración por ahora. Lo que probablemente también queremos hacer es agregar nuestros paquetes NPM. Así que voy a subir para acá y tengo mi pequeño y ordenado comando de apertura de utilidad línea instalada, y solo voy a seguir adelante- Y sé que voy a usar la consulta J aquí, Así que voy a instalar eso. Eso agrega una carpeta de módulos de nodo aquí. Voy a presionar el botón mostrar todos los archivos en el Explorador de soluciones, y voy a hacer clic derecho en la carpeta y diga incluir en el proyecto. Así que ahora estará disponible para use cualquier otro paquete con el que terminemos allí. Entonces, lo que tenemos es este controlador de pronóstico, como mencioné, y tiene un buen camino y solo devolverá algo al azar generó algo que parece como un pronóstico del tiempo. Entonces, veamos. Demos una pagina y voy a servir esto desde dentro de tres w root. Así que es agradable y fácil ir y llegar y agregaremos una página HTML. Aquí vamos. Y podemos dejarlo llamado predeterminado, incluso. Y lo que necesito es mi enlace de script para jQuery que tengo en los módulos de nodo. Agrega eso allí y solo haremos una clasificación rápida de hola mundo aquí con nuestra función de preparación de documentos. Y de nuevo, tienes la capacidad de hacer llamadas Ajax. y todo tipo de las cosas que vamos a hacer, utilizando JavaScript normal pero probablemente querrá usar jQuery. Así que lo pondremos ahí. Y lo que tenemos que hacer es mostrar esto aquí. Esta será una solicitud de obtención de jQuery, Ajax. Irá a esa ubicación. Entonces la pregunta mientras estás conectando todo esto es '¿Cómo ¿Sé que ese es el lugar al que quiero ir? ' Voy a entrar aquí a las propiedades de mi proyecto, vas a ir a la página de depuración aquí, y esto me dice exactamente dónde está esta aplicación. Así que es el puerto de host local cinco, dos, cero, seis, uno. Entonces voy a querer volver y asegúrese de que sea correcto. Y como nuestro controlador se llama controlador de pronóstico del tiempo, podemos llamar a eso sin la palabra controlador al final. Así que voy a hacer esta llamada. Los datos que regresan Lo voy a registrar en la consola. Y también lo voy a agregar a una sección de resultados en la página. Y haremos esto muy rápido y sucio, solo para que podamos verificar que tenemos un servicio y que el servicio está funcionando. Entonces, probemos este. Solo voy a hacer una vista en el navegador de esta cosa. Aquí vamos. Están todos nuestros datos. No hay gran CSS allí, solo queríamos demostrar que funcionaba. Por lo tanto, puede usar Visual Studio con bastante facilidad para crear un servicio web, y podríamos usarlo para probar para todas nuestras llamadas Ajax y llamadas Async que probablemente vamos a querer hacer con cualquier tipo de servicio web. Así que gracias por vernos. En nuestra próxima lección, echaremos un vistazo al emitir solicitudes básicas de Ajax, con un script Java normal.