处理Angular中的多个API请求的最佳方法(无需后端)

huangapple go评论59阅读模式
英文:

Best way to handle multiple API requests in Angular (no backend)

问题

I am using GitHub pages to make a site to find TV series: the user can filter by many operators, including the number of episodes and seasons. I am using the TMDB API and the first call I make is: https://developers.themoviedb.org/3/discover/tv-discover: This does not allow me to filter by the number of eps and seasons. After this call I extract the IDs and, for each of them, call: https://developers.themoviedb.org/3/tv/get-tv-details, which allows me to filter by eps and seasons. This method has also been confirmed by the API developers if I want to filter by ep and seasons.

Example: I want to find all shows with exactly 8 episodes, so I don't add any other filter except the status (in my case: Ended)

  1. the first call (tv-discover) finds ~60k results, divided into ~3k pages (each of 20 elements - this can't be changed)

处理Angular中的多个API请求的最佳方法(无需后端)

  1. I would then have to call the tv-discover method again for each page
  2. For each element in the results array, I'd have to call tv-details, which would allow me to filter the results with exactly 8 episodes.

This is obviously unsustainable, as it would take minutes (if not hours) to complete. I thought about displaying the show info in a MatCard, possibly by using the infinite scroll technique. What is the best way to handle this situation? I am using Angular 15.

英文:

I am using GitHub pages to make a site to find TV series: the user can filter by many operators, including the number of episodes and seasons. I am using the TMDB API and the first call I make is: https://developers.themoviedb.org/3/discover/tv-discover: This does not allow me to filter by the number of eps and seasons. After this call I extract the IDs and, for each of them, call: https://developers.themoviedb.org/3/tv/get-tv-details, which allows me to filter by eps and seasons. This method has also been confirmed by the API developers if I want to filter by ep and seasons.

Example: I want to find all shows with exactly 8 episodes, so I don't add any other filter except the status (in my case: Ended)

  1. the first call (tv-discover) finds ~60k results, divided into ~3k pages (each of 20 elements - this can't be changed)

    处理Angular中的多个API请求的最佳方法(无需后端)

  2. I would then have to call the tv-discover method again for each page

  3. For each element in the results array, I'd have to call tv-details, which would allow me to filter the results with exactly 8 episodes.

This is obviously unsustainable, as it would take minutes (if not hours) to complete. I thought about displaying the show info in a MatCard, possibly by using the infinite scroll technique. What is the best way to handle this situation? I am using Angular 15.

答案1

得分: 1

我很抱歉发布这个坏消息,但如果你被迫使用的API没有提供选择/过滤功能,那就没有办法了。

我的第一建议是为API团队创建一个问题,并请求添加这个功能。

我的第二要求是对你的产品负责人/利益相关者提出异议,问问他们这个功能对他们有多重要。是值得投入10个小时吗?还是值得100个?1,000个?

最后,如果如果没有这个功能,你的世界将会崩溃,那我建议你编写一个ETL应用程序,将所有这些数据导入到你自己的数据存储中,一个提供选择/过滤功能的存储,比如某种类型的数据库。这意味着后端编程,但它会起作用。

英文:

I am sorry to be the one to post the bad news, but if the API you are forced to consume doesn't provide selection/filtering capability, you are out of luck.

My number one suggestion would be to create an issue for the API team, and ask for the feature to be added.

My number two request would be to push back on your product owner / stakeholders and ask them how important this feature is to them. Is it worth 10 hours? Is it worth 100? 1,000?

Finally, if your world will end if this feature isn't implemented, then I would suggest you write an ETL app to get all of this data into your own data store, one that provides selection/filtering capability, i.e. some type of database. It means backend programming, but it will work.

huangapple
  • 本文由 发表于 2023年5月7日 08:13:38
  • 转载请务必保留本文链接:https://go.coder-hub.com/76191724.html
匿名

发表评论

匿名网友

:?: :razz: :sad: :evil: :!: :smile: :oops: :grin: :eek: :shock: :???: :cool: :lol: :mad: :twisted: :roll: :wink: :idea: :arrow: :neutral: :cry: :mrgreen:

确定