flutter api_使用Flutter使用API​​入门

flutter api

At some point in time in the lives of beginner developers, a puzzling question comes in their minds about how different applications retrieve data in real-time from the servers like the current weather data or simply the live cricket score data in just a matter of seconds. How is it done? The answer to this puzzle is by using this invisible unsung hero, the ‘API’ and it’s request/response Cycles! Excited huh? Give a go-to this 10 minutes read ahead and build your first Flutter App that retrieves live data from an API!

在 初学者开发人员的生活中的某个时刻，他们想到一个令人困惑的问题，即不同的应用程序如何在短短几秒钟内从服务器实时检索数据，例如当前的天气数据或实时的板球得分数据。 。 怎么做？ 这个难题的答案是使用这个看不见的无名英雄，即“ API”及其请求/响应周期！ 激动了吧？ 请提前阅读10分钟，然后构建您的第一个Flutter应用，该应用可以从API检索实时数据！

那么什么是API？ (So what is an API?)

Boring Definition: An application programming interface (API) is a computing interface which defines interactions between multiple software intermediaries. It defines the kinds of calls or requests that can be made, how to make them, the data formats that should be used, the conventions to follow, etc.~Wikipedia

无聊的定义： 应用程序编程接口 ( API )是一个计算接口 ，它定义了多个软件中介之间的交互。 它定义了可以进行的调用或请求的种类，如何进行调用，应使用的数据格式，要遵循的约定等〜维基百科

Still, you wouldn’t have understood what’s an ‘API’ is😝. No worries, let’s understand it with an example from our daily lives.

不过，您将不会理解什么是“ API” 。 不用担心，让我们以我们日常生活中的一个例子来理解它。

Imagine that you(the client) are in a Restaurant. You want to order your favorite food. So the first step would be calling the waiter(API Call) and place your order(Request). Then the waiter would take your request to the kitchen(The Server) where your food(the Response) would be prepared. After the food(Response) is prepared you would receive it.

假设您( 客户 )在餐厅里。 您想订购自己喜欢的食物。 因此，第一步将是调用waiter( API Call )并下订单( Request )。 然后服务员将您的请求带到准备食物( 响应 )的厨房( 服务器 )。 准备好食物( Response )后，您将收到它。

Now let’s replace these words to the domain of our discussion. You are the client in need of some data(say weather data) so you hit up the server(by making an API call) by specifying the city (Request) for which you want the weather data, then the server prepares your data and serves it to you in the form of JSON or XML format(Response). Sounds Simple now 😃? Let’s just dive in to see how to retrieve data in your Flutter App from an API.

现在，让我们将这些词替换为我们讨论的领域。 您是需要一些数据(例如天气数据)的客户端 ，因此您通过指定要获取天气数据的城市( 请求 )来启动服务器( 通过调用API )，然后服务器准备好数据并提供服务它以JSON或XML格式( Response )的形式提供给您。 听起来现在很简单😃？ 让我们深入了解如何从API检索Flutter App中的数据。

入门！ (Getting Started!)

Open up your preferred code editor for dart coding like Visual Studio Code, Android Studio, etc. Let’s get productive, in this walkthrough, we would fetch the latest Covid-19 Global Statistics Summary from this free to use API: https://api.covid19api.com/summary

打开您首选的代码编辑器以进行Visual Studio Code，Android Studio等Dart编码。让我们提高工作效率，在本演练中，我们将从此免费使用的API中获取最新的Covid-19 Global Statistics摘要： https：// api .covid19api.com / summary

This is an HTTP API that returns data in JSON format. If you don’t know what JSON is then don’t worry. Let’s Visualise how data looks like in a JSON format. I recommend you to install the following extension on your Chrome Browser for better visualization of the JSON format:

这是一个HTTP API ，以JSON格式返回数据。 如果您不知道什么是JSON，请不要担心。 让我们可视化JSON格式的数据外观。 建议您在Chrome浏览器中安装以下扩展程序，以更好地可视化JSON格式：

After installing this extension open up the API URL on the browser and see to the data returned by this API link. You would see the data l