Hoe open ik een webbrowser (URL) vanuit mijn Flutter-code?

Ik ben een Flutter-app aan het bouwen en ik wil graag een URL openen in een webbrowser of browservenster (als reactie op het tikken op een knop). Hoe kan ik dit doen?

Antwoord 1, autoriteit 100%

TL;DR

Dit is nu geïmplementeerd als 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";

Volledig voorbeeld:

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

Speciale tekens:

Als de waarde urlspaties of andere waarden bevat die nu zijn toegestaan ​​in URL’s, gebruik dan

Uri.encodeFull(urlString)of Uri.encodeComponent(urlString)en geef in plaats daarvan de resulterende waarde door.

Antwoord 2, autoriteit 8%

Als u sdk 30 of hoger target, retourneert canLaunchstandaard false vanwege wijzigingen in de zichtbaarheid van het pakket: https://developer.android.com/training/basics/intents/package-visibility

in de androidManifest.xmlmoet je het volgende toevoegen

<queries>
    <intent>
        <action android:name="android.intent.action.VIEW" />
        <category android:name="android.intent.category.BROWSABLE" />
        <data android:scheme="https" />
    </intent>
</queries>

Dan moet het volgende woord

const url = "https://flutter.io";
if (await canLaunch(url)){
  await launch(url);
}
else {
  // can't launch url
}

Antwoord 3, autoriteit 6%

De URL Launcher-plug-in gebruiken url_launcher

Om een ​​webpagina te starten, laten we een asynchrone functie zijn en het volgende doen:

launchURL(String url) async {
    if (await canLaunch(url)) {
      await launch(url);
    } else {
      throw 'Could not launch $url';
    }
  }

Als we wilden dat zowel iOS als Android de webpagina in de applicatie zouden openen (als een WebView), voeg dan forceWebView: truetoe, dan zouden we zoiets als dit doen:

launchURL(String url) async {
    if (await canLaunch(url)) {
      await launch(url, forceWebView: true);
    } else {
      throw 'Could not launch $url';
    }
 }

En noem het zo

onTap: () {
    const url = 'https://google.com';
    launchURL(url);
}

Antwoord 4, autoriteit 5%

Voor Flutter:

Zoals hierbovenbeschreven door Günter Zöchbauer

Voor Flutter Web:

import 'dart:html' as html;

Gebruik vervolgens:

html.window.open(url, name);

Zorg ervoor dat u flutter cleanuitvoert als de importniet wordt opgelost.

Antwoord 5, autoriteit 4%

Voor degenen die LAUNCH BROWSER EN EXIT APP willen implementeren door url_launcher te gebruiken. Vergeet niet om (forceSafariVC: false) te gebruiken om de url in de standaardbrowser van de telefoon te openen. Anders wordt de gelanceerde browser samen met uw APP afgesloten.

await launch(URL, forceSafariVC: false);

Antwoord 6, autoriteit 2%

De beste manier is om het url_launcher-pakket te gebruiken.

Voeg url_launchertoe als afhankelijkheid in uw pubspec.yaml-bestand.

dependencies:
  url_launcher: ^5.7.10

Een voorbeeld van hoe het te gebruiken:

import 'package:flutter/material.dart';
import 'package:url_launcher/url_launcher.dart';
void main() {
  runApp(
    MaterialApp(
        home: Scaffold(
      appBar: AppBar(title: Text('Flutter is beautiful'),),
      body: Center(
        child: RaisedButton(
          onPressed: _launchURL,
          child: Text('Show Flutter homepage'),
        ),
      ),
    )),
  );
}
_launchURL() async {
  const url = 'https://flutter.dev';
  if (await canLaunch(url)) {
    await launch(url);
  } else {
    throw 'Could not launch $url';
  }
}

Uitvoer:

De methode launchheeft een stringargument nodig dat een URL bevat.
Android opent standaard een browser bij het verwerken van URL’s. Jij kan
geef de parameter forceWebView: truedoor om de plug-in te vertellen een WebViewte openen
in plaats van. Als je dit doet voor een URL van een pagina die JavaScript bevat,
zorg ervoor dat u enableJavaScript: truedoorgeeft, of anders de startmethode
zal niet goed werken. Op iOS is het standaardgedrag om alles te openen
web-URL’s in de app. Al het andere wordt doorgestuurd naar de app
afhandelaar.

Antwoord 7, autoriteit 2%

Als je url_launcher wilt gebruiken, gebruik het dan in dit formulier

environment:
  sdk: ">=2.1.0 <3.0.0"
dependencies:
  url_launcher: ^5.0.2
  flutter:
    sdk: flutter

Dit antwoord is ook voor absolute beginners: ze denken achter de flutter-sdk.
Nee dat was een mislukking. De pakketten waren extra’s en niet in de flutter Sdk. Dit waren secundaire pakketten (enkele kleine raamwerkhelpers).

Antwoord 8

Na enig zoeken kan dit probleem worden opgelost via de instructies die hier worden vermeld: https://groups.google.com/forum/#!topic/flutter-dev/J3ujgdOuG98

De bovenstaande UrlLauncheris niet langer bruikbaar.

Antwoord 9

Gebruik url_launcher-pakket . Het zal dit voor u doen