Keycloak JS adapter
A Flutter package that bundles the official Keycloak JavaScript adapter (keycloak.js) as an asset.
This makes it easy to integrate Keycloak into Flutter Web apps without relying on an external CDN or changing your CI pipeline.
Features
- Ships
keycloak.jsdirectly inside the package assets. - Can be loaded in your
web/index.htmlor a customscript.js. - Ensures reproducible builds: the asset is versioned together with the package.
- Works with Flutter Web out of the box.
Installation
Add the dependency to your pubspec.yaml:
dependencies:
keycloak_adapter : ^0.0.1
Run:
flutter pub get
Asset Path
After a Flutter Web build, the file is served automatically at:
/assets/packages/keycloak_adapter/assets/js/keycloak.js
Usage
1. Include in index.html
Inside your web/index.html, add:
<script src="/assets/packages/my_keycloak_pkg/assets/js/keycloak.js"></script>
This ensures the Keycloak client is available globally as Keycloak.
2. Load and configure in script.js
(async () => {
const keycloak = new Keycloak({
url: "https://auth.example.com",
realm: "my-realm",
clientId: "my-client"
});
try {
await keycloak.init({ onLoad: "login-required" });
window.keycloak = keycloak; // expose globally
console.log("Authenticated:", keycloak.token);
} catch (err) {
console.error("Keycloak init failed:", err);
}
})();
3. Consume from Flutter
In Dart you can call JS interop to access window.keycloak,
or fetch configuration values from your script via window.APP_CONFIG if you export them there.
Example Project
Check the example/ folder for a minimal Flutter Web app using this package.
Versioning
Each version of this package locks a specific release of keycloak.js.
Update the package when you need a newer Keycloak version.
License
This package only redistributes the official Keycloak JavaScript adapter.
Original license: Apache License 2.0.
See LICENSE for details.