Adds alternative for legacy OIDC client (#3734)

.github/workflows/auth-oidc-pkce-plugin-release.yml

@@ -0,0 +1,32 @@
+on: workflow_dispatch
+name: Publish Auth OIDC PKCE Plugin Release
+env:
+  NPM_LUI_AUTH_TOKEN: ${{ secrets.NPM_LUI_AUTH_TOKEN }}
+
+jobs:
+  prepare:
+    uses: ./.github/workflows/prepare.yml
+    secrets: inherit
+    with:
+      buildcache_key: buildcache-auth-oidc-pkce-plugin-release-${{ github.ref }}
+
+  publish:
+    runs-on: ubuntu-latest
+    needs: prepare
+    if: github.repository == 'SAP/luigi'
+    steps:
+      - uses: actions/checkout@v4
+      - uses: actions/setup-node@v4
+        with:
+          node-version: '18.15.0'
+      - uses: actions/cache@v4
+        with:
+          path: |
+            ~/tmp_build
+            ~/cypress-binary-cache
+          key: buildcache-auth-oidc-pkce-plugin-release-${{ github.ref }}
+      - run: cp -r ~/tmp_build/* .
+      - run: echo "//registry.npmjs.org/:_authToken=$NPM_LUI_AUTH_TOKEN" > ~/.npmrc
+      - run: ls ./plugins/auth/public/auth-oidc-pkce
+      - run: bash ./scripts/npmPublish.sh auth-oidc-pkce-plugin-release
+      - run: echo "" > ~/.npmrc

docs/authorization-configuration.md

@@ -292,7 +292,7 @@ Luigi.setConfig({
 ​
 After authorization is successful on the authorization provider's side, it redirects back to `Luigi callback.html` **redirect_uri**. The provider verifies the authorization data, saves it in  **localStorage** for Luigi, and redirects to the Luigi main page.
 
-You can use the Luigi implementations of [OAuth2](https://github.com/SAP/luigi/blob/main/plugins/auth/src/auth-oauth2/index.js) and [OpenID Connect](https://github.com/SAP/luigi/blob/main/plugins/auth/src/auth-oidc/index.js) as examples when creating your own authorization provider.
+You can use the Luigi implementations of [OAuth2](https://github.com/SAP/luigi/blob/main/plugins/auth/src/auth-oauth2/index.js) and [OpenID Connect](https://github.com/SAP/luigi/blob/main/plugins/auth/src/auth-oidc-pkce/index.js) (or older [OIDC plugin](https://github.com/SAP/luigi/blob/main/plugins/auth/src/auth-oidc/index.js) for implict flow) as examples when creating your own authorization provider.
 
 <!-- add-attribute:class:warning -->
 >**NOTE:** Read more about authorization helpers in the [Core API: AuthorizationStore](luigi-core-api.md#AuthorizationStore) section.

docs/versions.md

@@ -49,6 +49,7 @@ To install the plugins, follow these installation guides:
 
 - [OAuth2 Implicit Grant](https://github.com/SAP/luigi/tree/main/plugins/auth/public/auth-oauth2)
 - [OpenID Connect (OIDC)](https://github.com/SAP/luigi/tree/main/plugins/auth/public/auth-oidc)
+- [OpenID Connect (OIDC) with PKCE](https://github.com/SAP/luigi/tree/main/plugins/auth/public/auth-oidc-pkce)
 
 <!-- add-attribute:class:warning -->
 > **NOTE:** If you already had a custom provider defined, you only need to rename the provider key to `idpProvider`.
@@ -72,15 +73,15 @@ In order to use TNT icons or businessSuiteInAppSymbols icons suite, it is recomm
 
 ## Luigi 2.x upgrades
 
-Luigi v2.0 introduced two new important changes in regards to previous versions. 
+Luigi v2.0 introduced two new important changes in regards to previous versions.
 
 <!-- accordion:start -->
 
 ### Internet Explorer 11 (IE11)
 
-As of Luigi v2.0, **Internet Explorer 11 is no longer supported**. Luigi is compatible with all other modern browsers. We recommend that you switch to another web browser such as Chrome or Edge. If you still need to use IE11, you can use Luigi versions lower than 2.0, all of which can be found on our [GitHub repository](https://github.com/SAP/luigi/releases). 
+As of Luigi v2.0, **Internet Explorer 11 is no longer supported**. Luigi is compatible with all other modern browsers. We recommend that you switch to another web browser such as Chrome or Edge. If you still need to use IE11, you can use Luigi versions lower than 2.0, all of which can be found on our [GitHub repository](https://github.com/SAP/luigi/releases).
 
-### Update to Angular 14 and 15 
+### Update to Angular 14 and 15
 
 With Luigi 2.0, we are updating to a newer version of Angular. This means that **Angular v.13 and below are no longer supported**. The [Luigi Angular support library](https://docs.luigi-project.io/docs/framework-support-libraries) can now be used with Angular 14 or 15 instead. You can read about how to update your Angular version [here](https://angular.io/guide/updating).
 

plugins/.gitignore

@@ -1,5 +1,6 @@
 public/*/plugin.js
 
 # Ignore files generated by build
+auth/public/auth-oidc-pkce/*.LICENSE.txt
 auth/public/auth-oidc/*.LICENSE.txt
 auth/public/auth-oidc/oidc-client.min.js.LICENSE.txt

plugins/auth/public/auth-oidc-pkce/.gitignore

@@ -0,0 +1,2 @@
+# vendor
+oidc-client-ts.min.js

plugins/auth/public/auth-oidc-pkce/README.md

@@ -0,0 +1,120 @@
+<!-- meta
+{
+  "node": {
+    "label": "OpenID Connect PKCE Plugin",
+    "category": {
+      "label": "Authorization",
+      "collapsible": true
+    },
+    "metaData": {
+      "categoryPosition": 4,
+      "position": 4
+    }
+  }
+}
+meta -->
+
+# OpenID Connect with PKCE - Authorization Plugin for Luigi Core
+
+## Overview
+
+This [authorization plugin](https://github.com/SAP/luigi/tree/main/plugins/auth/public/auth-oidc-pkce) contains a library that allows your application to extend the [Luigi framework](https://github.com/SAP/luigi/tree/main/core) with an OpenID Connect authorization provider.
+Further configuration details can be found in the [main documentation](https://docs.luigi-project.io/docs/authorization-configuration#openid-connect-configuration). The plugin supports only Authorization Code flow with PKCE - for Implict flow please check [older OIDC plugin](https://github.com/SAP/luigi/tree/main/plugins/auth/public/auth-oidc).
+
+## Installation
+
+Install the plugin in your project using npm:
+```bash
+npm install @luigi-project/plugin-auth-oidc-pkce
+```
+
+Import the plugin in places where you want to use it, depending on the environment of your choice:
+```javascript
+var OpenIdConnect = require('@luigi-project/plugin-auth-oidc-pkce');
+```
+or
+```javascript
+import OpenIdConnect from '@luigi-project/plugin-auth-oidc-pkce';
+```
+
+Then, integrate it as an authorization provider in your Luigi configuration file:
+```javascript
+Luigi.setConfig({
+  auth: {
+    use: 'myProviderConfig',
+    myProviderConfig: {
+      idpProvider: OpenIdConnect,
+      authority: 'http://authority.server',
+      post_logout_redirect_uri: 'http://authority.server/connect/endsession',
+      scope: 'openid profile email',
+
+      // for PKCE flow
+      client_id: 'authorisation-code-pkce-mock-client', // example oidc-mockserver client id
+      response_type: "code", // for PKCE
+      response_mode: "fragment", // change between `query` and `fragment`
+
+      // ... further configuration data comes here
+    }
+  }
+})
+```
+
+If you want to use the silent token renewal feature, the `silent-callback.html` needs to be copied to a folder in your Luigi Core installation,
+which is the return path for the IdP provider, configured through the `redirect_uri` setting. The default location of `redirect_uri` is `/assets/auth-oidc-pkce/silent-callback.html`.
+
+Next, you must install `oidc-client-ts` in your project as a dev dependency:
+
+```javascript
+npm i -save-dev oidc-client-ts
+```
+
+Then, you need to copy certain auxiliary plugin files and the callback file, as they are needed for the initial setup.
+
+Respectively from `oidc-client-ts` library you need:
+- `oidc-client-ts.min.js` which normally resides in `node_modules/oidc-client-ts/dist/browser`
+
+and from our library `@luigi-project/plugin-auth-oidc-pkce` you need:
+- `plugin.js`
+- `silent-callback.html`
+which all reside under `node_modules/@luigi-project/plugin-auth-oidc-pkce/plugin.js`.
+
+The above mentioned files should be copied to `assets/auth-oidc-pkce` as the default location.
+
+Below we give some alternatives on how to easily copy these files in your project. However, you may choose your own way of copying these files depending on your environment.
+
+For applications involving a webpack configuration, one way to copy files is using packages such as [copy-webpack-plugin](https://www.npmjs.com/package/copy-webpack-plugin) and then including the following in your webpack configuration file:
+
+
+
+```javascript
+const CopyWebpackPlugin = require('copy-webpack-plugin');
+
+{
+  plugins: [
+    new CopyWebpackPlugin([
+     {
+         from: 'node_modules/@luigi-project/plugin-auth-oidc-pkce/plugin.js',
+         to: 'assets/auth-oidc-pkce'
+     },
+     {
+         from: 'node_modules/@luigi-project/plugin-auth-oidc-pkce/silent-callback.html',
+         to: 'assets/auth-oidc-pkce'
+     },
+     {
+         from: 'node_modules/oidc-client-ts/dist/browser/oidc-client-ts.min.js',
+         to: 'assets/auth-oidc-pkce'
+     }
+    ])
+  ]
+}
+```
+
+If your application does not use webpack or you installed Luigi without a framework, you can use an alternative way of copying the `silent-callback.html` file. You can use any copy plugin to copy the file and then modify the `package.json` script to copy the file when building. One package that could be helpful is [copyfiles](https://www.npmjs.com/package/copyfiles). Below is an example:
+
+```javascript
+"buildConfig": "webpack --entry ./src/luigi-config/luigi-config.es6.js --output-path ./public/assets --output-filename luigi-config.js --mode production",
+"build": "npm run buildConfig && npm run copyCallbackOIdc",
+"copyCallbackOidc": "copyfiles -f node_modules/@luigi-project/plugin-auth-oidc-pkce/silent-callback.html node_modules/@luigi-project/plugin-auth-oidc-pkce/plugin.js node_modules/oidc-client-ts/dist/browser/oidc-client-ts.min.js public/assets/auth-oidc-pkce"
+```
+
+Running `npm run build` should then suffice to bundle the config and also copy the callback file.

plugins/auth/public/auth-oidc-pkce/package.json

@@ -0,0 +1,21 @@
+{
+  "name": "@luigi-project/plugin-auth-oidc-pkce",
+  "description": "OpenID Connect provider plugin for @luigi-project/core",
+  "license": "Apache-2.0",
+  "main": "plugin.js",
+  "repository": {
+    "type": "git",
+    "url": "ssh://github.com/SAP/luigi.git"
+  },
+  "publishConfig": {
+    "tag": "luigi-plugin-auth-oidc-pkce"
+  },
+  "keywords": [
+    "luigi",
+    "core",
+    "oidc",
+    "openid connect",
+    "provider"
+  ],
+  "version": "1.0.0"
+}

plugins/auth/public/auth-oidc-pkce/silent-callback.html

@@ -0,0 +1,7 @@
+<script src="/assets/auth-oidc-pkce/oidc-client-ts.min.js"></script>
+<script>
+  var mgr = new Oidc.UserManager();
+  mgr.signinSilentCallback().catch(error => {
+    console.error(error);
+  });
+</script>

plugins/auth/public/auth-oidc/README.md

@@ -19,7 +19,7 @@ meta -->
 ## Overview
 
 This [authorization plugin](https://github.com/SAP/luigi/tree/main/plugins/auth/public/auth-oidc) contains a library that allows your application to extend the [Luigi framework](https://github.com/SAP/luigi/tree/main/core) with an OpenID Connect authorization provider.
-Further configuration details can be found in the [main documentation](https://docs.luigi-project.io/docs/authorization-configuration#openid-connect-configuration). We support Authorization Code with PKCE and Implicit Grant flow.
+Further configuration details can be found in the [main documentation](https://docs.luigi-project.io/docs/authorization-configuration#openid-connect-configuration). We support Authorization Code with PKCE and Implicit Grant flow. If you don't need Implict flow please use [OIDC plugin with PKCE](https://github.com/SAP/luigi/tree/main/plugins/auth/public/auth-oidc-pkce) instead of this one.
 
 ## Installation