Busque y filtre programas y películas en Netflix usando la API ReelGood
Elaborado con:
Esta aplicación actualmente no funciona: ReelGood migró para usar la API V3 en su sitio y la API V2 ya no funciona. Si desea descubrir cómo se pueden utilizar los nuevos puntos finales de API y contribuir con un PR, hágalo.
Consulte el número 5.
Hasta ahora, este proyecto solo representa una única página de resultados de API como texto e imágenes, utilizando plantillas.
No hay informes ni filtros sofisticados.
También podría reconstruir esto en Vue, en lugar de Moustache.
ReelGood es un servicio que ofrece listas de programas de televisión y películas en muchos servicios en línea, incluido Netflix.
ReelGood tiene una excelente GUI en su sitio web que es fácil de navegar para buscar y filtrar. También utilizan una API como parte de esto. Quería crear mi propia lista de recomendaciones e informes de guía de espectáculos, así que extraigo datos de su API con JS del lado del cliente y los presento en un sitio web.
Ver el sitio:
Si es nuevo en las funciones Netlify/Lambda, consulte mi libro de recetas.
Pruebe el punto final de la API JSON directamente:
Clonar el repositorio:
$ git clone [email protected]:MichaelCurrin/netflix-assistant.git
$ cd netflix-assistant
¡No hay pasos de compilación o instalación!
Continúe a continuación.
Uso de Serverless para solicitudes de API
Esta aplicación no puede realizar solicitudes del navegador directamente a la API ReelGood (localmente esto está bien, pero en el sitio implementado aparece un error). La API cambia por lo que hay errores CORS.
Por eso, esta aplicación se rediseñó para utilizar la función Funciones gratuitas de Netlify (creada en AWS Lambda).
Una función se define mediante un breve script JS y está alojado en Netlify. Cuando se realiza una solicitud al punto final de esta función, se realiza una solicitud a la API ReelGood y el resultado se devuelve como una respuesta JSON almacenada en caché.
Esto es mucho más simple que decir construir una API de Python o Node, ya que necesita mucho más código y no se puede alojar en Netlify.
La desventaja es que la función sólo funciona en la nube y no en un servidor local.
Hay algunas formas de evitar esto:
http
tal vez y simplemente agregar una línea adicional para llamar al script JS en un punto final determinado; esto significa que solo necesita un servidor y un puerto.Tenga en cuenta que el uso local es limitado; consulte la sección anterior.
Inicie un servidor web en el directorio raíz.
Vea los enfoques en esta esencia o utilice un enfoque a continuación.
$ python3 -m http.server
Abrir en el navegador. p.ej
Hay un script de shell básico en este proyecto que utiliza Bash y cURL para obtener datos de la API ReelGood.
En lugar de utilizar una función bajo demanda como se explicó anteriormente, este enfoque consiste en extraer datos de la API y almacenarlos como datos JSON, que podrían dejarse en la aplicación implementada o comprometerse con el control de versiones si eso le interesa. Luego, la interfaz puede usar esos datos, lo que será mucho más rápido porque toda la paginación ya está manejada. A costa de datos ligeramente obsoletos y de consultar un archivo JSON estático de gran tamaño. Se podría realizar cierta limpieza para que el archivo JSON solo contenga campos de interés.
Este script obtiene las dos primeras páginas de programas de la API, donde las puntuaciones de IMDB y ReelGood están por encima del 50%. Se recomienda un manejo más avanzado con Python o similar si desea paginar de manera inteligente, es decir, sustituirlo por un valor skip
más alto, hasta que no queden más páginas.
Ejecutar como:
$ cd scrape
$ ./get_shows.sh
Luego vea los archivos JSON creados en el subdirectorio out
Configuración remota
Este repositorio se puede implementar en Netlify de forma gratuita, como un sitio web estático más funciones de Netlify para las llamadas backend sin servidor a la API externa.
El encabezado CORS debe configurarse para solicitudes de API y esto no es posible configurarlo en las páginas de Github. Además, esto utiliza la función en Netlify, que GitHub Pages no admite.
En el sitio web de ReelGood hay una vista de programas de televisión y películas disponibles para transmitir en Netflix.
La página admite parámetros de filtro, opciones de pedido y opciones de formato de visualización.
Los datos del programa se recuperan de la API ReelGood.
Esto se hace al cargar la página inicial, cuando aplica filtrado/clasificación y también cuando hace clic en Cargar más en la parte inferior de la página.
La API es de uso gratuito y en su página de preguntas frecuentes proporcionan detalles para solicitar acceso a la API. Descubrí que sin tener que enviarles un correo electrónico, es fácil acceder a la API. Todavía no he encontrado documentación al respecto, así que comparo la elección de GUI que hago con las solicitudes de API que se realizan e infiero cómo funcionan los campos en las solicitudes de API y qué significan los campos de respuesta.
$.getJSON
(frontend) y axios
(Función) para simplificar el proyecto.Para evitar errores de CORS, este proyecto utiliza una función también conocida como Lambda en Netlify para solicitar datos en el lado del servidor y luego hacer que los datos estén disponibles en el mismo dominio que la solicitud del navegador.
Consulte Función Netlify.
Véase también la entrada del blog.
Una configuración local podría usar una biblioteca de Netlify o simplemente una alternativa al uso de la URL original (que afortunadamente no genera errores de CORS en localhost aunque sí en Netlify) en función de un indicador como ENV=dev
o local/remoto.
Publicado bajo el MIT por @MichaelCurrin.