Shulou(Shulou.com)06/02 Report--

Editor to share with you the example analysis of Flutter multi-platform adaptation mechanism, I believe that most people do not know much about it, so share this article for your reference, I hope you will learn a lot after reading this article, let's learn about it!

Flutter network request

You can use the http core library when developing Flutter. You can also use other community wrapper libraries, such as dio. The underlying implementation of both is http_parser

If the developer accidentally uses the platform-related class library directly in flutter, it will lead to errors in the operation of the extended platform. For example, if you use the http under the io package to execute in the browser, you will definitely report an error.

The http core library has done platform adaptation for us. Let's take a look at how it adapts:

Import 'package:flutter/cupertino.dart';import' package:http/http.dart' as http;void hello () {print ('a.dart = > hello'); http.get (' http://127.0.0.1:8080').then((response){ debugPrint ('response = > ${response.statusCode} ${response.body}');});}

This code can be run on a mobile device or a browser device to get a consistent output.

Http core library

Now let's take a get request as an example and take a look at his internal logic:

Image

In the http interface class, _ withClient is eventually executed to select the implementation class of Client, similar to the static proxy effect.

Specifically, when compiling to web, the final boot package uses src/browser_client.dart, and its underlying implementation is HttpRequest under dart:html, and finally uses the front-end ajax technology: XMLHttpRequests.

/ / Used from conditional imports, matches the definition in `client_ room.dart`.BaseClient createClient () = > BrowserClient (); / / A `dart: html`-based HTTP client that runs in the browser and is backed by/// XMLHttpRequests./ This client inherits some of the limitations of XMLHttpRequest. It ignores/// the [BaseRequest.contentLength], [BaseRequest.persistentConnection], / [BaseRequest.followRedirects], and [BaseRequest.maxRedirects] fields. It is/// also unable to stream requests or responses; a request will only be sent and/// a response will only be returned once all the data is available.class BrowserClient extends BaseClient

Io class library, src/io_client.dart, is used for non-browsers, and its underlying implementation is HttpClient under dart:io.

/ / Used from conditional imports, matches the definition in `client_ room.dart`.BaseClient createClient () = > IOClient (); / / A `dart: IO`-based HTTP client./ This is the default client when running on the command line.class IOClient extends BaseClient conditional guide package

Here is a more interesting grammar:

How does the http core library do the platform difference?

By observing the boot package of src/client.dart, you can see the following code:

/ / ignore: uri_does_not_existimport 'client_stub.dart' / / ignore: uri_does_not_exist if (dart.library.html)' browser_client.dart' / / ignore: uri_does_not_exist if (dart.library.io) 'io_client.dart'

The special syntax in dart actually used here: the conditional guide package. For more information, please refer to the dart documentation.

To put it simply, you can use conditional import/export to differentiate the guide package during compilation, so that you can achieve platform adaptation.

The specific methods for using conditional guide packages are as follows:

First define an interface for multi-side implementation

The interface class uses import/export to import and export the corresponding implementation class library on demand.

Export 'src/hw_none.dart' / / Stub implementation if (dart.library.io)' src/hw_io.dart' / / dart:io implementation if (dart.library.html) 'src/hw_html.dart'; / / dart:html implementation application scenario

Using this mechanism, multi-platform adaptation can be carried out conveniently. A similar dio also has a guide package difference logic src/dio.dart.

Import 'entry_stub.dart'// ignore: uri_does_not_exist if (dart.library.html)' entry/dio_for_browser.dart'// ignore: uri_does_not_exist if (dart.library.io) 'entry/dio_for_native.dart'

By the way, take a look at the dependencies of dio and http. Dio is a wrapper library uploaded by http, which provides more convenient api. Of course, it also brings learning costs, depending on the actual needs of the project.

| |-- dio 3.0.7 | |-- http_parser 3.1.3 |-- charcode... |-- collection... |-- source_span... |-- string_scanner... | |'--typed_data... |'--path... |-- http 0.12.0room2 | |-- async... | |-- http_parser... | | |-- path... |'--pedantic... The above is all the contents of the article "sample Analysis of Flutter Multi-platform adaptation Mechanism". Thank you for reading! I believe we all have a certain understanding, hope to share the content to help you, if you want to learn more knowledge, welcome to follow the industry information channel!

Welcome to subscribe "Shulou Technology Information " to get latest news, interesting things and hot topics in the IT industry, and controls the hottest and latest Internet news, technology news and IT industry trends.