docs: add example usage with keycloak server

appsup-dart · Dec 29, 2022 · a293941 · a293941
1 parent cbb83e4
commit a293941
Show file tree

Hide file tree

Showing 147 changed files with 6,674 additions and 0 deletions.
diff --git a/.gitignore b/.gitignore
@@ -24,3 +24,5 @@ doc/api/
 *.iws
 
 .DS_Store
+
+.vscode/
diff --git a/README.md b/README.md
@@ -22,6 +22,8 @@ for Facebook, which is predefined in the library.
 
 ## Usage
 
+Below are some examples of how to use the library. For more examples, see the [`example` folder](example/example.md). It contains full examples of how to use the library with a keycloak server in a flutter, command line and browser application.
+
 A simple usage example:
 
 ```dart

diff --git a/example/browser_example/.gitignore b/example/browser_example/.gitignore
@@ -0,0 +1,6 @@
+# Files and directories created by pub.
+.dart_tool/
+.packages
+
+# Conventional directory for build output.
+build/
diff --git a/example/browser_example/CHANGELOG.md b/example/browser_example/CHANGELOG.md
@@ -0,0 +1,3 @@
+## 1.0.0
+
+- Initial version.
diff --git a/example/browser_example/README.md b/example/browser_example/README.md
@@ -0,0 +1 @@
+An absolute bare-bones web app.
diff --git a/example/browser_example/analysis_options.yaml b/example/browser_example/analysis_options.yaml
@@ -0,0 +1,30 @@
+# This file configures the static analysis results for your project (errors,
+# warnings, and lints).
+#
+# This enables the 'recommended' set of lints from `package:lints`.
+# This set helps identify many issues that may lead to problems when running
+# or consuming Dart code, and enforces writing Dart using a single, idiomatic
+# style and format.
+#
+# If you want a smaller set of lints you can change this to specify
+# 'package:lints/core.yaml'. These are just the most critical lints
+# (the recommended set includes the core lints).
+# The core lints are also what is used by pub.dev for scoring packages.
+
+include: package:lints/recommended.yaml
+
+# Uncomment the following section to specify additional rules.
+
+# linter:
+#   rules:
+#     - camel_case_types
+
+# analyzer:
+#   exclude:
+#     - path/to/excluded/files/**
+
+# For more information about the core and recommended set of lints, see
+# https://dart.dev/go/core-lints
+
+# For additional information about configuring this file, see
+# https://dart.dev/guides/language/analysis-options
diff --git a/example/browser_example/pubspec.yaml b/example/browser_example/pubspec.yaml
@@ -0,0 +1,18 @@
+name: browser_example
+description: An absolute bare-bones web app.
+version: 1.0.0
+# homepage: https://www.example.com
+publish_to: none
+
+environment:
+  sdk: '>=2.18.5 <3.0.0'
+
+dependencies:
+  path: ^1.7.0
+  openid_client: 
+    path: ../..
+
+dev_dependencies:
+  build_runner: ^2.1.4
+  build_web_compilers: ^3.2.1
+  lints: ^2.0.0
diff --git a/example/browser_example/web/index.html b/example/browser_example/web/index.html
@@ -0,0 +1,27 @@
+<!DOCTYPE html>
+
+<html>
+<head>
+    <meta charset="utf-8">
+    <meta http-equiv="X-UA-Compatible" content="IE=edge">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <meta name="scaffolded-by" content="https://github.com/dart-lang/sdk">
+    <title>browser_example</title>
+    <link rel="stylesheet" href="styles.css">
+    <script defer src="main.dart.js"></script>
+</head>
+
+<body>
+
+  <h1>openid_client Demo Web App</h1>
+
+  <div id="when-logged-in" style="display: none;">
+      <p>Hello <span id="name"></span>!</p>
+      <p>Your email is <span id="email"></span>.</p>
+      <button id="logout">logout</button>
+  </div>
+  <div id="when-logged-out" style="display: none;">
+      <button id="login">login</button>
+  </div>
+</body>
+</html>
diff --git a/example/browser_example/web/main.dart b/example/browser_example/web/main.dart
@@ -0,0 +1,34 @@
+import 'dart:html';
+
+import 'package:openid_client/openid_client_browser.dart';
+
+const keycloakUri = 'http://localhost:8080/realms/myrealm';
+const scopes = ['profile'];
+
+Future<Authenticator> getAuthenticator() async {
+  var uri = Uri.parse(keycloakUri);
+  var clientId = 'myclient';
+
+  var issuer = await Issuer.discover(uri);
+  var client = Client(issuer, clientId);
+
+  return Authenticator(client, scopes: scopes);
+}
+
+Future<void> main() async {
+  var authenticator = await getAuthenticator();
+
+  var credential = await authenticator.credential;
+
+  if (credential != null) {
+    final userData = await credential.getUserInfo();
+    document.querySelector('#when-logged-in')!.style.display = 'block';
+    document.querySelector('#name')!.text = userData.name!;
+    document.querySelector('#email')!.text = userData.email!;
+  } else {
+    document.querySelector('#when-logged-out')!.style.display = 'block';
+    document.querySelector('#login')!.onClick.listen((_) async {
+      authenticator.authorize();
+    });
+  }
+}
diff --git a/example/browser_example/web/styles.css b/example/browser_example/web/styles.css
@@ -0,0 +1,14 @@
+@import url(https://fonts.googleapis.com/css?family=Roboto);
+
+html, body {
+  width: 100%;
+  height: 100%;
+  margin: 0;
+  padding: 0;
+  font-family: 'Roboto', sans-serif;
+}
+
+#output {
+  padding: 20px;
+  text-align: center;
+}
diff --git a/example/example.md b/example/example.md
@@ -0,0 +1,53 @@
+
+This folder contains 3 examples of using the `openid_client` package with a `keycloak` server:
+
+* `flutter_example` - a flutter example
+* `io_example` - a command line example
+* `browser_example` - a browser (non-flutter) example
+
+## The keycloak server
+
+The examples use a keycloak server running on `http://localhost:8080/auth/realms/myrealm`. 
+
+The keycloak server can be started by using the `docker-compose.yml` file in the `example/keycloak-docker` folder:
+
+```bash
+cd example/keycloak-docker
+docker-compose up
+```
+
+## flutter_example
+
+This example shows how to use the `openid_client` package with a `keycloak` server in a flutter application. It has been tested on the following platforms:
+
+* Android
+* iOS
+* Web
+* MacOS
+
+The app will show a single *login* button. Once pressed, a browser will be opened and the user will be asked to login or register. After a successful login, the user info will be shown.
+
+
+## io_example
+
+This example can be run by:
+
+```bash
+dart run example/io_example/io_example.dart
+```
+
+Once started, a browser will be opened and the user will be asked to login or register. After a successful login, the user info will be printed to the command line.
+
+## browser_example
+
+Run this example by:
+
+```bash
+cd example/browser_example
+webdev serve web:8888
+```
+
+Then open `http://localhost:8888` in a browser. Once the page is loaded, a login button will be shown. Once pressed, a browser will be opened and the user will be asked to login or register. After a successful login, the user info will be shown.
+
+
+
diff --git a/example/flutter_example/.gitignore b/example/flutter_example/.gitignore
@@ -0,0 +1,44 @@
+# Miscellaneous
+*.class
+*.log
+*.pyc
+*.swp
+.DS_Store
+.atom/
+.buildlog/
+.history
+.svn/
+migrate_working_dir/
+
+# IntelliJ related
+*.iml
+*.ipr
+*.iws
+.idea/
+
+# The .vscode folder contains launch configuration and tasks you configure in
+# VS Code which you may wish to be included in version control, so this line
+# is commented out by default.
+#.vscode/
+
+# Flutter/Dart/Pub related
+**/doc/api/
+**/ios/Flutter/.last_build_id
+.dart_tool/
+.flutter-plugins
+.flutter-plugins-dependencies
+.packages
+.pub-cache/
+.pub/
+/build/
+
+# Symbolication related
+app.*.symbols
+
+# Obfuscation related
+app.*.map.json
+
+# Android Studio will place build artifacts here
+/android/app/debug
+/android/app/profile
+/android/app/release
diff --git a/example/flutter_example/.metadata b/example/flutter_example/.metadata
@@ -0,0 +1,45 @@
+# This file tracks properties of this Flutter project.
+# Used by Flutter tool to assess capabilities and perform upgrades etc.
+#
+# This file should be version controlled.
+
+version:
+  revision: b8f7f1f9869bb2d116aa6a70dbeac61000b52849
+  channel: stable
+
+project_type: app
+
+# Tracks metadata for the flutter migrate command
+migration:
+  platforms:
+    - platform: root
+      create_revision: b8f7f1f9869bb2d116aa6a70dbeac61000b52849
+      base_revision: b8f7f1f9869bb2d116aa6a70dbeac61000b52849
+    - platform: android
+      create_revision: b8f7f1f9869bb2d116aa6a70dbeac61000b52849
+      base_revision: b8f7f1f9869bb2d116aa6a70dbeac61000b52849
+    - platform: ios
+      create_revision: b8f7f1f9869bb2d116aa6a70dbeac61000b52849
+      base_revision: b8f7f1f9869bb2d116aa6a70dbeac61000b52849
+    - platform: linux
+      create_revision: b8f7f1f9869bb2d116aa6a70dbeac61000b52849
+      base_revision: b8f7f1f9869bb2d116aa6a70dbeac61000b52849
+    - platform: macos
+      create_revision: b8f7f1f9869bb2d116aa6a70dbeac61000b52849
+      base_revision: b8f7f1f9869bb2d116aa6a70dbeac61000b52849
+    - platform: web
+      create_revision: b8f7f1f9869bb2d116aa6a70dbeac61000b52849
+      base_revision: b8f7f1f9869bb2d116aa6a70dbeac61000b52849
+    - platform: windows
+      create_revision: b8f7f1f9869bb2d116aa6a70dbeac61000b52849
+      base_revision: b8f7f1f9869bb2d116aa6a70dbeac61000b52849
+
+  # User provided section
+
+  # List of Local paths (relative to this file) that should be
+  # ignored by the migrate tool.
+  #
+  # Files that are not part of the templates will be ignored by default.
+  unmanaged_files:
+    - 'lib/main.dart'
+    - 'ios/Runner.xcodeproj/project.pbxproj'
diff --git a/example/flutter_example/README.md b/example/flutter_example/README.md
@@ -0,0 +1,16 @@
+# example
+
+A new Flutter project.
+
+## Getting Started
+
+This project is a starting point for a Flutter application.
+
+A few resources to get you started if this is your first Flutter project:
+
+- [Lab: Write your first Flutter app](https://docs.flutter.dev/get-started/codelab)
+- [Cookbook: Useful Flutter samples](https://docs.flutter.dev/cookbook)
+
+For help getting started with Flutter development, view the
+[online documentation](https://docs.flutter.dev/), which offers tutorials,
+samples, guidance on mobile development, and a full API reference.
diff --git a/example/flutter_example/analysis_options.yaml b/example/flutter_example/analysis_options.yaml
@@ -0,0 +1,29 @@
+# This file configures the analyzer, which statically analyzes Dart code to
+# check for errors, warnings, and lints.
+#
+# The issues identified by the analyzer are surfaced in the UI of Dart-enabled
+# IDEs (https://dart.dev/tools#ides-and-editors). The analyzer can also be
+# invoked from the command line by running `flutter analyze`.
+
+# The following line activates a set of recommended lints for Flutter apps,
+# packages, and plugins designed to encourage good coding practices.
+include: package:flutter_lints/flutter.yaml
+
+linter:
+  # The lint rules applied to this project can be customized in the
+  # section below to disable rules from the `package:flutter_lints/flutter.yaml`
+  # included above or to enable additional rules. A list of all available lints
+  # and their documentation is published at
+  # https://dart-lang.github.io/linter/lints/index.html.
+  #
+  # Instead of disabling a lint rule for the entire project in the
+  # section below, it can also be suppressed for a single line of code
+  # or a specific dart file by using the `// ignore: name_of_lint` and
+  # `// ignore_for_file: name_of_lint` syntax on the line or in the file
+  # producing the lint.
+  rules:
+    # avoid_print: false  # Uncomment to disable the `avoid_print` rule
+    # prefer_single_quotes: true  # Uncomment to enable the `prefer_single_quotes` rule
+
+# Additional information about this file can be found at
+# https://dart.dev/guides/language/analysis-options
diff --git a/example/flutter_example/android/.gitignore b/example/flutter_example/android/.gitignore
@@ -0,0 +1,13 @@
+gradle-wrapper.jar
+/.gradle
+/captures/
+/gradlew
+/gradlew.bat
+/local.properties
+GeneratedPluginRegistrant.java
+
+# Remember to never publicly share your keystore.
+# See https://flutter.dev/docs/deployment/android#reference-the-keystore-from-the-app
+key.properties
+**/*.keystore
+**/*.jks
-Original file line number
+Diff line change
@@ Expand Up / @@ -22,6 +22,8 @@ for Facebook, which is predefined in the library. @@
     ## Usage
+    Below are some examples of how to use the library. For more examples, see the [`example` folder](example/example.md). It contains full examples of how to use the library with a keycloak server in a flutter, command line and browser application.
     A simple usage example:
     ```dart
@@ Expand Down @@