Getting Started

The GOFA WebView SDK enables seamless integration of GOFA's web-based fitness experiences into your Flutter application. This SDK provides a secure, authenticated WebView component that allows users to access GOFA's web platform features directly within your mobile app.

Key Features

• Secure Authentication: Built-in client credential management and Firebase custom token handling
• Environment-Aware: Support for different environments (DEV, UAT, PRD)
• Ready-to-Use Widget: Pre-built GofaWebView widget that handles authentication and navigation

Installation

Add the Package

onepub pub add gofa_webview
flutter pub add get_it

OnePub Organization

You must be logged into the GOFA organization on OnePub for package resolution to succeed. If you get an error like "could not find package gofa_webview", run onepub logout and then onepub login again using the email address that received the OnePub invitation.

Alternatively, you can add the dependency manually to your pubspec.yaml:

dependencies:
  gofa_webview:
    hosted: https://onepub.dev/api/fvnuhnofly
    version: ^1.2.1

Import Required Packages

import 'package:gofa_webview/gofa_webview.dart';
import 'package:get_it/get_it.dart';

Basic Setup

1. Configure Environment Variables

Set up your credentials and environment:

# During Flutter build
flutter build apk --dart-define=GOFA_CLIENT_ID=your-client-id \
                  --dart-define=GOFA_CLIENT_SECRET=your-client-secret \
                  --dart-define=GOFA_CLIENT_USER_ID=unique-user-id \
                  --dart-define=GOFA_ENVIRONMENT=UAT

2. Initialize the SDK

import 'package:gofa_webview/gofa_webview.dart';

/// Helper to parse the GOFA_ENVIRONMENT string into the SDK enum.
Environment _parseEnvironment(String value) {
  switch (value.toUpperCase()) {
    case 'PRD': return Environment.PRD;
    case 'UAT': return Environment.UAT;
    default:   return Environment.DEV;
  }
}

Future<void> registerWebViewSdk({
  required BuildContext context,
}) async {
  const envString = String.fromEnvironment('GOFA_ENVIRONMENT', defaultValue: 'DEV');

  if (!GetIt.I.isRegistered<WebViewSdkManager>()) {
    final webViewSdkManager = WebViewSdkManager(
      environment: _parseEnvironment(envString),
    );
    GetIt.I.registerSingleton<WebViewSdkManager>(webViewSdkManager);
  }

  final webViewSdkManager = GetIt.I<WebViewSdkManager>();

  if (!webViewSdkManager.isInitialized) {
    await webViewSdkManager.init(
      clientId: const String.fromEnvironment('GOFA_CLIENT_ID', defaultValue: 'abc'),
      clientSecret: const String.fromEnvironment('GOFA_CLIENT_SECRET', defaultValue: 'abcSecret'),
      clientUserId: const String.fromEnvironment('GOFA_CLIENT_USER_ID', defaultValue: 'default_user'),
      environment: _parseEnvironment(envString),
    );
  }
}

3. Configure Routes

Add the WebView route to your app:

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      routes: {
        GofaWebView.routeName: (context) {
          final arguments = ModalRoute.of(context)?.settings.arguments;
          final argumentMap = arguments as Map;
          return GofaWebView(
            url: argumentMap['url'] as String,
            clientId: argumentMap['clientId'] as String,
            locale: argumentMap['locale'] as Locale,
          );
        },
      },
      home: const MyHomePage(),
    );
  }
}

GofaWebView Widget

Constructor Parameters

The GofaWebView widget accepts the following parameters:

Parameter	Type	Required	Description
url	String	✅	The GOFA web application URL to load
clientId	String	✅	Your application's client identifier
locale	Locale	✅	Locale for internationalization (e.g. Locale('en'))
splashIconAssetPath	String?	❌	Custom asset path for splash screen logo. Overrides the built-in logo.
splashIconAssetPackage	String?	❌	Package owning the splash asset. Defaults to 'gofa_webview'. Set to null for host-app assets.
splashWidget	Widget?	❌	Fully custom splash widget. When provided, overrides all other splash options.

Usage Example

// Minimal (uses built-in GOFA logo splash)
GofaWebView(
  url: 'https://your-client.gofa.app/msk/home',
  clientId: 'your-client-id',
  locale: const Locale.fromSubtags(
    languageCode: 'zh',
    scriptCode: 'Hant',
  ),
)

// Custom splash icon from host app assets
GofaWebView(
  url: 'https://your-client.gofa.app/msk/home',
  clientId: 'your-client-id',
  locale: const Locale('en'),
  splashIconAssetPath: 'assets/my_client_logo.png',
  splashIconAssetPackage: null, // asset is in the host app
)

Locale Configuration

The locale parameter allows you to specify the language and region for the WebView content:

Common Locale Examples

// English (default)
const Locale('en')

// Traditional Chinese (Hong Kong)
const Locale.fromSubtags(
  languageCode: 'zh',
  scriptCode: 'Hant',
)

// Simplified Chinese (China)
const Locale.fromSubtags(
  languageCode: 'zh',
  scriptCode: 'Hans',
)

tip

The locale parameter is required. Use const Locale('en') for English if you don't need a specific locale.

4. Navigate to WebView

info

For the WebView URL, please contact our GOFA support team to get the correct URL for your environment.

Route Registration Required

The Navigator.pushNamed(..., GofaWebView.routeName, ...) example below requires that GofaWebView.routeName is registered in your MaterialApp.routes first (see Step 3: Configure Routes above).

ElevatedButton(
  onPressed: () async {
    await registerWebViewSdk(context: context);

    if (context.mounted) {
      await Navigator.pushNamed(
        context,
        GofaWebView.routeName,
        arguments: {
          'url': 'https://your-client.gofa.app/msk/home',
          'clientId': const String.fromEnvironment('GOFA_CLIENT_ID', defaultValue: 'abc'),
          'locale': const Locale.fromSubtags(
            languageCode: 'zh',
            scriptCode: 'Hant',
          ),
        },
      );
    }
  },
  child: const Text('Open GOFA WebView'),
),

Environment Configuration

Environment	Purpose	URL Pattern
DEV	Development (default)	*.dev.gofa.app
UAT	User Acceptance Testing	*.uat.gofa.app
PRD	Production	*.gofa.app

info

The environment parameter uses the Environment enum from the SDK (Environment.DEV, Environment.UAT, Environment.PRD), not a plain string.

Authentication

The SDK uses Firebase custom token authentication:

• clientId: Your application's unique identifier
• clientSecret: Confidential key used to generate Firebase custom tokens
• clientUserId: Unique identifier for the user

Security

Always use environment variables for credentials. Never hardcode sensitive information in your source code.

Deprecated — Basic Auth Removed (v1.1.0)

The basicAuthUser and basicAuthPass parameters are deprecated as of gofa_webview v1.1.0 (February 2026). MSK routes now use Firebase custom token authentication instead of HTTP Basic Auth. You can safely remove these parameters from your code. See the MSK Authentication guide for details.

Additional Resources

• Advanced Configuration: Environment and callback configuration
• SDK Reference: Complete API documentation
• SDK Versions: Changelog and version history

---

Change History

Date	Change
2026-02-24	Added explicit route-registration prerequisite note for Navigator.pushNamed WebView navigation example.
2026-02-13	Fixed locale parameter to required Locale (non-nullable). Fixed environment parameter to use Environment enum instead of String. Added await to init() call. Added DEV to environment table. Added OnePub organization troubleshooting note. Updated to v1.2.1.
2026-02-11	Added splashIconAssetPath, splashIconAssetPackage, and splashWidget parameters (v1.2.0). Replaced Bupa-specific example URLs with generic placeholders.
2026-02-11	Removed basic auth from key features, code examples, and authentication section. Added deprecation notice for basicAuthUser/basicAuthPass. Linked to MSK Authentication guide.