How do I open a web browser (URL) from my Flutter code?
I am building a Flutter app, and I'd like to open a URL into a web browser or browser window (in response to a button tap). How can I do this?
TL;DR
This is now implemented as Plugin
const url = "https://flutter.io";
if (await canLaunch(url))
await launch(url);
else
// can't launch url, there is some error
throw "Could not launch $url";
Full example:
import 'package:flutter/material.dart'; import 'package:url_launcher/url_launcher.dart'; void main() { runApp(new Scaffold( body: new Center( child: new RaisedButton( onPressed: _launchURL, child: new Text('Show Flutter homepage'), ), ), )); } _launchURL() async { const url = 'https://flutter.io'; if (await canLaunch(url)) { await launch(url); } else { throw 'Could not launch $url'; } }
In pubspec.yaml
dependencies:
url_launcher: ^5.7.10
Special Characters:
If the url
value contains spaces or other values that are now allowed in URLs, use
Uri.encodeFull(urlString)
or Uri.encodeComponent(urlString)
and pass the resulting value instead.
If you target sdk 30 or above canLaunch
will return false by default due to package visibility changes: https://developer.android.com/training/basics/intents/package-visibility
in the androidManifest.xml
you'll need to add the following
<queries>
<intent>
<action android:name="android.intent.action.VIEW" />
<category android:name="android.intent.category.BROWSABLE" />
<data android:scheme="https" />
</intent>
</queries>
Then the following should word
const url = "https://flutter.io";
if (await canLaunch(url)){
await launch(url);
}
else {
// can't launch url
}
Using the URL Launcher plugin url_launcher
To launching a web page, Let’s to be an async function and do the following:
launchURL(String url) async {
if (await canLaunch(url)) {
await launch(url);
} else {
throw 'Could not launch $url';
}
}
If we wanted both iOS and Android to open the web page inside the application (as a WebView), then add forceWebView: true
we’d do something like this:
launchURL(String url) async {
if (await canLaunch(url)) {
await launch(url, forceWebView: true);
} else {
throw 'Could not launch $url';
}
}
And call it this way
onTap: () {
const url = 'https://google.com';
launchURL(url);
}
For Flutter:
As described above by Günter Zöchbauer
For Flutter Web:
import 'dart:html' as html;
Then use:
html.window.open(url, name);
Make sure that you run flutter clean
if the import
doesn't resolve.