Understanding the Uri class in Dart (from examples)

Suragch

Dec 31, 2020·3 min read

The Uri class in Dart has good documentation, but sometimes seeing examples makes it a lot easier to understand. This article will show examples for all of the main parameters to make them more clear.

Creating a Uri

You can create a Uri by parsing string like this:

Uri uri = Uri.parse('http://www.example.com');

The following examples will all reference uri but I’ll omit the line above to save space. Every example will start with the URL string to be parsed.

Properties of Uri

scheme

The scheme is something like http, https, or file. There are a lot more.

http://www.example.comString scheme = uri.scheme;
print(scheme); // http

authority

The authority in a URL is normally just the main website without the scheme or path or anything.

http://www.example.com/bananasString authority = uri.authority;
print(authority); // www.example.com

However, note that the authority can also include user info and port:

http://user:password@www.example.com:8080/bananasString authority = uri.authority;
print(authority); // user:password@www.example.com:8080

userInfo

This is the user information.

http://user:password@www.example.comString userInfo = uri.userInfo;
print(userInfo); // user:password

Don’t put passwords in plain text in the URI. This is a security risk and it’s also deprecated.

host

Whereas the authority might include the user info and port, the host does not.

http://user:password@www.example.com:8080String host = uri.host;
print(host); // www.example.com

port

This is the number that comes after a colon after the host.

http://www.example.com:8080int port = uri.port;
print(port); // 8080

path

This is the address to some resource after the authority.

http://www.example.com/fruit/bananasString path = uri.path;
print(path); //  /fruit/bananas

pathSegments

A path often has multiple segments so rather than parsing them out yourself you can get them as a list like this:

http://www.example.com/fruit/bananasList<String> pathSegments = uri.pathSegments;
print(pathSegments); // [fruit, bananas]

query

This is the part that comes after the ?.

http://www.example.com/fruit?q=yellowString query = uri.query;
print(query); // q=yellow

Note that it’s URL encoded (see the %20):

http://www.example.com/fruit?q=yellow&size=very%20bigString query = uri.query;
print(query); // q=yellow&size=very%20big

queryParameters

This decodes the query parameters and returns a map of key value pairs:

http://www.example.com/fruit?q=yellow&size=very%20bigMap<String, String> queryParameters = uri.queryParameters;
print(queryParameters); // {q: yellow, size: very big}

queryParametersAll

You can use this to collect multiple query parameters that have the same key. For example, the following URI has one user named bob and another user named mary.

http://www.example.com/fruit?user=bob&user=mary&job=doctorMap<String, List<String>> all = uri.queryParametersAll;
print(all); // {user: [bob, mary], job: [doctor]}

If you were to only use queryParameters, then it would drop the duplicate keys:

http://www.example.com/fruit?user=bob&user=mary&job=doctorMap<String, String> queryParameters = uri.queryParameters;
print(queryParameters); // {user: mary, job: doctor}

fragment

This is the part that comes after the #, also called an anchor to reference content within a page.

http://www.example.com/fruit#bananasString fragment = uri.fragment;
print(fragment); // bananas

Conclusion

Understand the components of a URI make it easier to parse. This is especially useful when building a server.

Full code

Want to play around with this yourself? Get started here:

void main() async {
  final uri = Uri.parse('http://user@www.example.com:8080/fruit/bananas?q=ripe');
  final value = uri.scheme;
  print(value);
}

See also

• RFC 3986 (technical definition of a URI)
• Building a Dart server from scratch