How to Open External Link in New or Same Tab in Flutter Web

In this guide, you are going to learn to open an external or any link in a new tab, same tab, and in the new window in Flutter Web. There are plenty of packages out there to perform this, but we are going to show to open links without any package.

If you are looking for opening the app page route in a new tab then look into this: How to open Page Route in New Tab in Flutter Web

Import dart:html

import 'dart:html' as html;

Open Link in the Same Tab:

html.window.open('https://www.fluttercampus.com',"_self");
//html is from import 

Open Link in New Tab:

html.window.open('https://www.fluttercampus.com',"_blank");

Open Link in New Window:

html.window.open('https://www.fluttercampus.com',"_blank", 'location=yes');
// add more paramerter to options like 'location=yes,height=570,width=520,scrollbars=yes,status=yes'

Full Dart Code:

import 'package:flutter/material.dart';
import 'dart:html' as html;

void main() {
  runApp(MyApp()); 
}

class MyApp extends StatelessWidget{
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
        title: "Hello World",
        home: HomePage(),
    );
  }
}

class HomePage extends StatelessWidget{
  @override
  Widget build(BuildContext context) {

    return Scaffold( 
        appBar: AppBar( 
          title: Text("Open External Link"),
          backgroundColor: Colors.redAccent,
        ),
        body: Container( 
          child:Center( 
            child: ElevatedButton( 
              onPressed: (){
                  html.window.open('https://www.fluttercampus.com',"_blank");
              },
              child: Text("Open Flutter Campus"),
            ),
          )
        )
    );
  }
}

Output Screenshot:

In this way, you can open link in a new tab and new window using Flutter Web