diff --git a/src/portal/e2e/app.e2e-spec.ts b/src/portal/e2e/app.e2e-spec.ts
index 02388c458..a924625cb 100644
--- a/src/portal/e2e/app.e2e-spec.ts
+++ b/src/portal/e2e/app.e2e-spec.ts
@@ -25,6 +25,8 @@ fdescribe('harbor-portal app', function () {
 
   it('should display: ' + expectedMsg, () => {
     page.navigateTo();
-    expect(page.getParagraphText()).toEqual(expectedMsg)
+    page.getParagraphText().then(res => {
+      expect(res).toEqual(expectedMsg);
+    });
   });
 });
diff --git a/src/portal/lib/src/config/config.ts b/src/portal/lib/src/config/config.ts
index 2872e1084..0c5c78463 100644
--- a/src/portal/lib/src/config/config.ts
+++ b/src/portal/lib/src/config/config.ts
@@ -91,7 +91,12 @@ export class Configuration {
     http_authproxy_endpoint?: StringValueItem;
     http_authproxy_skip_cert_verify?: BoolValueItem;
     http_authproxy_always_onboard?: BoolValueItem;
-
+    oidc_name?: StringValueItem;
+    oidc_endpoint?: StringValueItem;
+    oidc_client_id?: StringValueItem;
+    oidc_client_secret?: StringValueItem;
+    oidc_skip_cert_verify?: BoolValueItem;
+    oidc_scope?: StringValueItem;
     public constructor() {
         this.auth_mode = new StringValueItem("db_auth", true);
         this.project_creation_restriction = new StringValueItem("everyone", true);
@@ -136,5 +141,11 @@ export class Configuration {
         this.http_authproxy_endpoint = new StringValueItem("", true);
         this.http_authproxy_skip_cert_verify = new BoolValueItem(false, true);
         this.http_authproxy_always_onboard = new BoolValueItem(false, true);
+        this.oidc_name = new StringValueItem('', true);
+        this.oidc_endpoint = new StringValueItem('', true);
+        this.oidc_client_id = new StringValueItem('', true);
+        this.oidc_client_secret = new StringValueItem('', true);
+        this.oidc_skip_cert_verify = new BoolValueItem(false, true);
+        this.oidc_scope = new StringValueItem('', true);
     }
 }
diff --git a/src/portal/src/app/config/auth/config-auth.component.html b/src/portal/src/app/config/auth/config-auth.component.html
index 17492c2f8..665e1d5e7 100644
--- a/src/portal/src/app/config/auth/config-auth.component.html
+++ b/src/portal/src/app/config/auth/config-auth.component.html
@@ -9,10 +9,12 @@
                     <option value="ldap_auth">{{'CONFIG.AUTH_MODE_LDAP' | translate }}</option>
                     <option value="uaa_auth">{{'CONFIG.AUTH_MODE_UAA' | translate }}</option>
                     <option *ngIf="showHttpAuth" value="http_auth">{{'CONFIG.AUTH_MODE_HTTP' | translate }}</option>
+                    <option value="oidc_auth">{{'CONFIG.AUTH_MODE_OIDC' | translate }}</option>
                 </select>
             </div>
-            <a href="javascript:void(0)" role="tooltip" aria-haspopup="true"
-                class="tooltip tooltip-lg tooltip-top-right top-1">
+            <a href="{{currentConfig?.auth_mode?.value==='oidc_auth'?'https://openid.net/connect/':'javascript:void(0)'}}"
+                target="{{currentConfig?.auth_mode?.value==='oidc_auth'?'_blank':''}}" role="tooltip"
+                aria-haspopup="true" class="tooltip tooltip-lg tooltip-top-right top-1">
                 <clr-icon shape="info-circle" size="24" class="info-tips-icon"></clr-icon>
                 <span class="tooltip-content">{{'CONFIG.TOOLTIP.AUTH_MODE' | translate}}</span>
             </a>
@@ -201,7 +203,8 @@
         <div class="form-group">
             <label>{{'CONFIG.LDAP.LDAP_GROUP_MEMBERSHIP' | translate}}</label>
             <input name="ldapGroupMembership" class="padding-right-28" type="text" #ldapGroupFilterInput="ngModel"
-                [(ngModel)]="currentConfig.ldap_group_membership_attribute.value" id="ldapGroupMembership" size="40" [disabled]="disabled(currentConfig.ldap_group_membership_attribute)">
+                [(ngModel)]="currentConfig.ldap_group_membership_attribute.value" id="ldapGroupMembership" size="40"
+                [disabled]="disabled(currentConfig.ldap_group_membership_attribute)">
             <clr-tooltip>
                 <clr-icon clrTooltipTrigger shape="info-circle" size="24"></clr-icon>
                 <clr-tooltip-content clrPosition="top-right" clrSize="lg" *clrIfOpen>
@@ -227,8 +230,8 @@
                 </clr-tooltip-content>
             </clr-tooltip>
         </div>
-        
     </section>
+
     <section class="form-block">
         <div class="form-group" *ngIf="showSelfReg">
             <label for="selfReg">{{'CONFIG.SELF_REGISTRATION' | translate}}</label>
@@ -238,7 +241,7 @@
                     [disabled]="disabled(currentConfig.self_registration)" />
                 <label>
                     <a href="javascript:void(0)" role="tooltip" aria-haspopup="true"
-                        class="tooltip tooltip-top-right top-7">
+                        class="tooltip tooltip-top-right top-5">
                         <clr-icon shape="info-circle" class="info-tips-icon" size="24"></clr-icon>
                         <span *ngIf="checkable; else elseBlock" class="tooltip-content">{{'CONFIG.TOOLTIP.SELF_REGISTRATION_ENABLE'
                             | translate}}</span>
@@ -260,7 +263,7 @@
                     (ngModelChange)="setVerifyCertValue($event)" />
                 <label>
                     <a href="javascript:void(0)" role="tooltip" aria-haspopup="true"
-                        class="tooltip tooltip-top-right top-7">
+                        class="tooltip tooltip-top-right top-5">
                         <clr-icon shape="info-circle" class="info-tips-icon" size="24"></clr-icon>
                         <span class="tooltip-content">{{'CONFIG.TOOLTIP.VERIFY_CERT' | translate}}</span>
                     </a>
@@ -271,21 +274,26 @@
     <section class="form-block" *ngIf="showHttpAuth">
         <div class="form-group">
             <label for="http_authproxy_endpoint" class="required">{{'CONFIG.HTTP_AUTH.ENDPOINT' | translate}}</label>
-            <label for="http_authproxy_endpoint" aria-haspopup="true" role="tooltip" class="tooltip tooltip-validation tooltip-md tooltip-top-right"
-            [class.invalid]="httpAuthproxyEndpointInput.invalid && (httpAuthproxyEndpointInput.dirty || httpAuthproxyEndpointInput.touched)">
-            <input type="text" pattern="^([hH][tT]{2}[pP]:\/\/|[hH][tT]{2}[pP][sS]:\/\/)(.*?)*$"  #httpAuthproxyEndpointInput="ngModel" required id="http_authproxy_endpoint" name="http_authproxy_endpoint" size="35"
-                [(ngModel)]="currentConfig.http_authproxy_endpoint.value" [disabled]="!currentConfig.http_authproxy_endpoint.editable" >
+            <label for="http_authproxy_endpoint" aria-haspopup="true" role="tooltip"
+                class="tooltip tooltip-validation tooltip-md tooltip-top-right"
+                [class.invalid]="httpAuthproxyEndpointInput.invalid && (httpAuthproxyEndpointInput.dirty || httpAuthproxyEndpointInput.touched)">
+                <input type="text" pattern="^([hH][tT]{2}[pP]:\/\/|[hH][tT]{2}[pP][sS]:\/\/)(.*?)*$"
+                    #httpAuthproxyEndpointInput="ngModel" required id="http_authproxy_endpoint"
+                    name="http_authproxy_endpoint" size="35" [(ngModel)]="currentConfig.http_authproxy_endpoint.value"
+                    [disabled]="!currentConfig.http_authproxy_endpoint.editable">
                 <span class="tooltip-content">
-                        {{'TOOLTIP.ENDPOINT_FORMAT' | translate}}
-                    </span>
+                    {{'TOOLTIP.ENDPOINT_FORMAT' | translate}}
+                </span>
             </label>
         </div>
         <div class="form-group">
             <label for="http_authproxy_skip_cert_verify"
                 class="required">{{'CONFIG.HTTP_AUTH.VERIFY_CERT' | translate}}</label>
             <clr-checkbox-wrapper>
-                <input type="checkbox" clrCheckbox name="http_authproxy_skip_cert_verify" id="http_authproxy_skip_cert_verify"
-                 [(ngModel)]="currentConfig.http_authproxy_skip_cert_verify.value"  [disabled]="!currentConfig.http_authproxy_skip_cert_verify.editable" />
+                <input type="checkbox" clrCheckbox name="http_authproxy_skip_cert_verify"
+                    id="http_authproxy_skip_cert_verify"
+                    [(ngModel)]="currentConfig.http_authproxy_skip_cert_verify.value"
+                    [disabled]="!currentConfig.http_authproxy_skip_cert_verify.editable" />
             </clr-checkbox-wrapper>
         </div>
         <div class="form-group">
@@ -293,11 +301,108 @@
                 class="required">{{'CONFIG.HTTP_AUTH.ALWAYS_ONBOARD' | translate}}</label>
             <clr-checkbox-wrapper>
                 <input type="checkbox" clrCheckbox name="http_authproxy_always_onboard"
-                    id="http_authproxy_always_onboard" [disabled]="!currentConfig.http_authproxy_always_onboard.editable"
+                    id="http_authproxy_always_onboard"
+                    [disabled]="!currentConfig.http_authproxy_always_onboard.editable"
                     [(ngModel)]="currentConfig.http_authproxy_always_onboard.value" />
             </clr-checkbox-wrapper>
         </div>
     </section>
+
+    <section class="form-block" *ngIf="showOIDC">
+        <div class="form-group">
+            <label for="oidcName" class="required">{{'CONFIG.OIDC.OIDC_PROVIDER' | translate}}</label>
+            <label for="oidcName" aria-haspopup="true" role="tooltip"
+                class="tooltip tooltip-validation tooltip-lg tooltip-top-right"
+                [class.invalid]="oidcNameInput.invalid && (oidcNameInput.dirty || oidcNameInput.touched)">
+                <input name="oidcName" required type="text" #oidcNameInput="ngModel"
+                    [(ngModel)]="currentConfig.oidc_name.value" required id="oidcName" size="40"
+                    [disabled]="disabled(currentConfig.oidc_name)">
+                <span class="tooltip-content">
+                    {{'TOOLTIP.ITEM_REQUIRED' | translate}}
+                </span>
+            </label>
+            <a href="javascript:void(0)" role="tooltip" aria-haspopup="true"
+                class="tooltip tooltip-lg tooltip-top-right top-1">
+                <clr-icon shape="info-circle" class="info-tips-icon" size="24"></clr-icon>
+                <span class="tooltip-content">{{'TOOLTIP.OIDC_NAME' | translate}}</span>
+            </a>
+        </div>
+        <div class="form-group">
+            <label for="oidcEndpoint" class="required">{{'CONFIG.OIDC.ENDPOINT' | translate}}</label>
+            <label for="oidcEndpoint" aria-haspopup="true" role="tooltip"
+                [class.invalid]="oidcEndpointInput.invalid && (oidcEndpointInput.dirty || oidcEndpointInput.touched)"
+                class="tooltip tooltip-validation tooltip-lg tooltip-top-right">
+                <input name="oidcEndpoint" type="text" #oidcEndpointInput="ngModel" required
+                    [(ngModel)]="currentConfig.oidc_endpoint.value" id="oidcEndpoint" size="40"
+                    [disabled]="disabled(currentConfig.oidc_endpoint)" pattern="^([hH][tT]{2}[pP][sS])(.*?)*$">
+                <span class="tooltip-content">
+                    {{'TOOLTIP.OIDC_ENDPOIT_FORMAT' | translate}}
+                </span>
+            </label>
+            <a href="javascript:void(0)" role="tooltip" aria-haspopup="true"
+                class="tooltip tooltip-lg tooltip-top-right top-1">
+                <clr-icon shape="info-circle" class="info-tips-icon" size="24"></clr-icon>
+                <span class="tooltip-content">{{'TOOLTIP.OIDC_ENDPOINT' | translate}}</span>
+            </a>
+        </div>
+        <div class="form-group">
+            <label for="oidcClientId" class="required">{{'CONFIG.OIDC.CLIENT_ID' | translate}}</label>
+            <label for="oidcClientId" aria-haspopup="true" role="tooltip"
+                [class.invalid]="oidcClientIdInput.invalid && (oidcClientIdInput.dirty || oidcClientIdInput.touched)"
+                class="tooltip tooltip-validation tooltip-lg tooltip-top-right">
+                <input name="oidcClientId" type="text" #oidcClientIdInput="ngModel" required
+                    [(ngModel)]="currentConfig.oidc_client_id.value" id="oidcClientId" size="40"
+                    [disabled]="disabled(currentConfig.oidc_client_id)">
+                <span class="tooltip-content">
+                    {{'TOOLTIP.ITEM_REQUIRED' | translate}}
+                </span>
+            </label>
+        </div>
+        <div class="form-group">
+            <label for="oidcClientSecret" class="required">{{'CONFIG.OIDC.CLIENTSECRET' | translate}}</label>
+            <label for="oidcClientSecret" aria-haspopup="true" role="tooltip"
+                [class.invalid]="oidcClientSecretInput.invalid && (oidcClientSecretInput.dirty || oidcClientSecretInput.touched)"
+                class="tooltip tooltip-validation tooltip-lg tooltip-top-right">
+                <input name="oidcClientSecret" type="password" #oidcClientSecretInput="ngModel" required
+                    [(ngModel)]="currentConfig.oidc_client_secret.value" id="oidcClientSecret" size="40"
+                    [disabled]="disabled(currentConfig.oidc_client_secret)">
+                <span class="tooltip-content">
+                    {{'TOOLTIP.ITEM_REQUIRED' | translate}}
+                </span>
+            </label>
+        </div>
+        <div class="form-group">
+            <label for="oidcScope" class="required">{{'CONFIG.OIDC.SCOPE' | translate}}</label>
+            <label for="oidcScope" aria-haspopup="true" role="tooltip"
+                [class.invalid]="oidcScopeInput.invalid && (oidcScopeInput.dirty || oidcScopeInput.touched)"
+                class="tooltip tooltip-validation tooltip-lg tooltip-top-right">
+                <input name="oidcScope" type="text" #oidcScopeInput="ngModel"
+                    [(ngModel)]="currentConfig.oidc_scope.value" id="oidcScope" size="40" required
+                    [disabled]="disabled(currentConfig.oidc_scope)" pattern="^(\w+,){0,}openid(,\w+){0,}$">
+                <span class="tooltip-content">
+                    {{'TOOLTIP.ITEM_REQUIRED' | translate}}
+                </span>
+            </label>
+            <a href="javascript:void(0)" role="tooltip" aria-haspopup="true"
+                class="tooltip tooltip-lg tooltip-top-right top-1">
+                <clr-icon shape="info-circle" class="info-tips-icon" size="24"></clr-icon>
+                <span class="tooltip-content">{{'TOOLTIP.OIDC_SCOPE' | translate}}</span>
+            </a>
+        </div>
+        <div class="form-group">
+            <label for="oidc_skip_cert_verify">{{'CONFIG.OIDC.OIDCSKIPCERTVERIFY' | translate}}</label>
+            <clr-checkbox-wrapper>
+                <input type="checkbox" clrCheckbox name="oidc_skip_cert_verify" id="oidc_skip_cert_verify"
+                    [disabled]="disabled(currentConfig.oidc_skip_cert_verify)"
+                    [(ngModel)]="currentConfig.oidc_skip_cert_verify.value" />
+            </clr-checkbox-wrapper>
+            <a href="javascript:void(0)" role="tooltip" aria-haspopup="true"
+                class="tooltip tooltip-lg tooltip-top-right top-1px">
+                <clr-icon shape="info-circle" class="info-tips-icon" size="24"></clr-icon>
+                <span class="tooltip-content">{{'TOOLTIP.OIDC_SKIPCERTVERIFY' | translate}}</span>
+            </a>
+        </div>
+    </section>
 </form>
 <div>
     <button type="button" id="config_auth_save" class="btn btn-primary" (click)="save()"
diff --git a/src/portal/src/app/config/auth/config-auth.component.scss b/src/portal/src/app/config/auth/config-auth.component.scss
index c763962b3..658502f66 100644
--- a/src/portal/src/app/config/auth/config-auth.component.scss
+++ b/src/portal/src/app/config/auth/config-auth.component.scss
@@ -9,7 +9,9 @@ clr-tooltip {
 .top-1 {
     top: -1px;
 }
-
-.top-7 {
-    top: -7px;
+.top-1px {
+    top: 1px;
+}
+.top-5 {
+    top: -5px;
 }
\ No newline at end of file
diff --git a/src/portal/src/app/config/auth/config-auth.component.ts b/src/portal/src/app/config/auth/config-auth.component.ts
index 18f6f598b..92c23ecb3 100644
--- a/src/portal/src/app/config/auth/config-auth.component.ts
+++ b/src/portal/src/app/config/auth/config-auth.component.ts
@@ -11,11 +11,11 @@
 // WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
 // See the License for the specific language governing permissions and
 // limitations under the License.
-import { Component, Input, ViewChild, SimpleChanges, OnChanges} from '@angular/core';
+import { Component, Input, ViewChild, SimpleChanges, OnChanges } from '@angular/core';
 import { NgForm } from '@angular/forms';
 import { Subscription } from "rxjs";
 
-import { Configuration, clone, isEmpty, getChanges, StringValueItem} from '@harbor/ui';
+import { Configuration, clone, isEmpty, getChanges, StringValueItem, BoolValueItem } from '@harbor/ui';
 import { MessageHandlerService } from '../../shared/message-handler/message-handler.service';
 import { ConfirmMessageHandler } from '../config.msg.utils';
 import { AppConfigService } from '../../app-config.service';
@@ -42,7 +42,7 @@ export class ConfigurationAuthComponent implements OnChanges {
         private configService: ConfigurationService,
         private appConfigService: AppConfigService,
         private confirmMessageHandler: ConfirmMessageHandler
-        ) {
+    ) {
     }
 
     get checkable() {
@@ -53,7 +53,9 @@ export class ConfigurationAuthComponent implements OnChanges {
 
     ngOnChanges(changes: SimpleChanges): void {
         if (changes && changes["currentConfig"]) {
+
             this.originalConfig = clone(this.currentConfig);
+
         }
     }
 
@@ -66,6 +68,9 @@ export class ConfigurationAuthComponent implements OnChanges {
     public get showUAA(): boolean {
         return this.currentConfig && this.currentConfig.auth_mode && this.currentConfig.auth_mode.value === 'uaa_auth';
     }
+    public get showOIDC(): boolean {
+        return this.currentConfig && this.currentConfig.auth_mode && this.currentConfig.auth_mode.value === 'oidc_auth';
+    }
     public get showHttpAuth(): boolean {
         return this.currentConfig && this.currentConfig.auth_mode && this.currentConfig.auth_mode.value === 'http_auth';
     }
@@ -74,7 +79,7 @@ export class ConfigurationAuthComponent implements OnChanges {
             return true;
         } else {
             return this.currentConfig.auth_mode.value !== 'ldap_auth' && this.currentConfig.auth_mode.value !== 'uaa_auth'
-            && this.currentConfig.auth_mode.value !== 'http_auth' ;
+                && this.currentConfig.auth_mode.value !== 'http_auth' && this.currentConfig.auth_mode.value !== 'oidc_auth';
         }
     }
 
@@ -143,13 +148,13 @@ export class ConfigurationAuthComponent implements OnChanges {
         let changes = {};
         for (let prop in allChanges) {
             if (prop.startsWith('ldap_')
-            || prop.startsWith('uaa_')
-            || prop === 'auth_mode'
-            || prop === 'project_creattion_restriction'
-            || prop === 'self_registration'
-            || prop === 'http_authproxy_endpoint'
-            || prop === 'http_authproxy_skip_cert_verify'
-            || prop === 'http_authproxy_always_onboard'
+                || prop.startsWith('uaa_')
+                || prop === 'auth_mode'
+                || prop === 'project_creattion_restriction'
+                || prop === 'self_registration'
+                || prop === 'http_authproxy_endpoint'
+                || prop === 'http_authproxy_skip_cert_verify'
+                || prop === 'http_authproxy_always_onboard'
             ) {
                 changes[prop] = allChanges[prop];
             }
@@ -168,7 +173,7 @@ export class ConfigurationAuthComponent implements OnChanges {
     handleOnChange($event: any): void {
         if ($event && $event.target && $event.target["value"]) {
             let authMode = $event.target["value"];
-            if (authMode === 'ldap_auth' || authMode === 'uaa_auth' || authMode === 'http_auth') {
+            if (authMode === 'ldap_auth' || authMode === 'uaa_auth' || authMode === 'http_auth' || authMode === 'oidc_auth') {
                 if (this.currentConfig.self_registration.value) {
                     this.currentConfig.self_registration.value = false; // unselect
                 }
@@ -176,12 +181,12 @@ export class ConfigurationAuthComponent implements OnChanges {
         }
     }
 
-     /**
-     *
-     * Save the changed values
-     *
-     * @memberOf ConfigurationComponent
-     */
+    /**
+    *
+    * Save the changed values
+    *
+    * @memberOf ConfigurationComponent
+    */
     public save(): void {
         let changes = this.getChanges();
         if (!isEmpty(changes)) {
@@ -191,8 +196,8 @@ export class ConfigurationAuthComponent implements OnChanges {
                     this.onGoing = false;
                     this.retrieveConfig();
                     // Reload bootstrap option
-                    this.appConfigService.load().subscribe(() => {}
-                    , error => console.error('Failed to reload bootstrap option with error: ', error));
+                    this.appConfigService.load().subscribe(() => { }
+                        , error => console.error('Failed to reload bootstrap option with error: ', error));
                     this.msgHandler.showSuccess('CONFIG.SAVE_SUCCESS');
                 }, error => {
                     this.onGoing = false;
@@ -213,6 +218,7 @@ export class ConfigurationAuthComponent implements OnChanges {
                 // Add two password fields
                 configurations.ldap_search_password = new StringValueItem(fakePass, true);
                 configurations.uaa_client_secret = new StringValueItem(fakePass, true);
+                configurations.oidc_client_secret = new StringValueItem(fakePass, true);
                 this.currentConfig = configurations;
                 // Keep the original copy of the data
                 this.originalConfig = clone(configurations);
diff --git a/src/portal/src/app/config/config.component.ts b/src/portal/src/app/config/config.component.ts
index 9b3421370..5937bd123 100644
--- a/src/portal/src/app/config/config.component.ts
+++ b/src/portal/src/app/config/config.component.ts
@@ -147,6 +147,7 @@ export class ConfigurationComponent implements OnInit, OnDestroy {
                 configurations.email_password = new StringValueItem(fakePass, true);
                 configurations.ldap_search_password = new StringValueItem(fakePass, true);
                 configurations.uaa_client_secret = new StringValueItem(fakePass, true);
+                configurations.oidc_client_secret = new StringValueItem(fakePass, true);
                 this.allConfig = configurations;
                 // Keep the original copy of the data
                 this.originalCopy = clone(configurations);
diff --git a/src/portal/src/i18n/lang/en-us-lang.json b/src/portal/src/i18n/lang/en-us-lang.json
index cdab9197c..ad5b69ca3 100644
--- a/src/portal/src/i18n/lang/en-us-lang.json
+++ b/src/portal/src/i18n/lang/en-us-lang.json
@@ -72,7 +72,12 @@
         "EMPTY": "Name is required",
         "NONEMPTY": "Can't be empty",
         "REPO_TOOLTIP": "Users can not do any operations to the images in this mode.",
-        "ENDPOINT_FORMAT": "Endpoint must start with HTTP or HTTPS."
+        "ENDPOINT_FORMAT": "Endpoint must start with HTTP or HTTPS.",
+        "OIDC_ENDPOIT_FORMAT": "Endpoint must start with HTTPS.",
+        "OIDC_NAME": "The name of the OIDC provider.",
+        "OIDC_ENDPOINT": "The URL of an OIDC-complaint server.",
+        "OIDC_SCOPE": "The scope sent to OIDC server during authentication.  It has to contain “openid”, and “offline_access”.  If you are using google, please remove “offline_access” from this field.",
+        "OIDC_SKIPCERTVERIFY": "Check this box if your OIDC server is hosted via self-signed certificate."
     },
     "PLACEHOLDER": {
         "CURRENT_PWD": "Enter current password",
@@ -621,6 +626,7 @@
         "AUTH_MODE_LDAP": "LDAP",
         "AUTH_MODE_UAA": "UAA",
         "AUTH_MODE_HTTP": "http_auth",
+        "AUTH_MODE_OIDC": "OIDC",
         "SCOPE_BASE": "Base",
         "SCOPE_ONE_LEVEL": "OneLevel",
         "SCOPE_SUBTREE": "Subtree",
@@ -684,6 +690,14 @@
             "ALWAYS_ONBOARD": "Always Onboard",
             "VERIFY_CERT": "Authentication Verify Cert"
         },
+        "OIDC": {
+            "OIDC_PROVIDER": "OIDC provider",
+            "ENDPOINT": "OIDC Endpoint",
+            "CLIENT_ID": "OIDC Client ID",
+            "CLIENTSECRET": "OIDC Client Secret",
+            "SCOPE": "OIDC Scope",
+            "OIDCSKIPCERTVERIFY": "OIDC Verify Cert"
+        },
         "SCANNING": {
             "TRIGGER_SCAN_ALL_SUCCESS": "Trigger scan all successfully!",
             "TRIGGER_SCAN_ALL_FAIL": "Failed to trigger scan all with error: {{error}",
diff --git a/src/portal/src/i18n/lang/es-es-lang.json b/src/portal/src/i18n/lang/es-es-lang.json
index d8aadd0b3..fa508e16b 100644
--- a/src/portal/src/i18n/lang/es-es-lang.json
+++ b/src/portal/src/i18n/lang/es-es-lang.json
@@ -65,14 +65,19 @@
         "ITEM_REQUIRED": "Campo obligatorio.",
         "NUMBER_REQUIRED": "El campo es obligatorio y debería ser un número.",
         "PORT_REQUIRED": "El campo es obligatorio y debería ser un número de puerto válido.",
-        "CRON_REQUIRED": "El campo es obligatorio y debe estar en formato cron.",        
+        "CRON_REQUIRED": "El campo es obligatorio y debe estar en formato cron.",
         "EMAIL_EXISTING": "Esa dirección de email ya existe.",
         "USER_EXISTING": "Ese nombre de usuario ya existe.",
         "RULE_USER_EXISTING": "Name is already in use.",
         "EMPTY": "Name is required",
         "NONEMPTY": "Can't be empty",
         "REPO_TOOLTIP": "Users can not do any operations to the images in this mode.",
-        "ENDPOINT_FORMAT": "Endpoint must start with HTTP or HTTPS."
+        "ENDPOINT_FORMAT": "Endpoint must start with HTTP or HTTPS.",
+        "OIDC_ENDPOIT_FORMAT": "Endpoint must start with HTTPS.",
+        "OIDC_NAME": "El nombre de la OIDC proveedor.",
+        "OIDC_ENDPOINT": "La dirección URL de un servidor OIDC denuncia.",
+        "OIDC_SCOPE": "El ámbito de aplicación enviada a OIDC Server durante la autenticación.Tiene que contener 'Openid', y 'offline_access'.Si usted esta usando Google, por favor quitar 'offline_access' de este campo",
+        "OIDC_SKIPCERTVERIFY": "Marque esta casilla si tu OIDC servidor está alojado a través de certificado autofirmado."
     },
     "PLACEHOLDER": {
         "CURRENT_PWD": "Introduzca la contraseña actual",
@@ -620,6 +625,7 @@
         "AUTH_MODE_LDAP": "LDAP",
         "AUTH_MODE_UAA": "UAA",
         "AUTH_MODE_HTTP": "http_auth",
+        "AUTH_MODE_OIDC": "OIDC",
         "SCOPE_BASE": "Base",
         "SCOPE_ONE_LEVEL": "UnNivel",
         "SCOPE_SUBTREE": "Subárbol",
@@ -683,6 +689,14 @@
             "ALWAYS_ONBOARD": "Always Onboard",
             "VERIFY_CERT": "Authentication Verify Cert"
         },
+        "OIDC": {
+            "OIDC_PROVIDER": "OIDC Proveedor",
+            "ENDPOINT": "OIDC Endpoint",
+            "CLIENT_ID": "ID de cliente OIDC",
+            "CLIENTSECRET": "OIDC Client Secret",
+            "SCOPE": "OIDC Ámbito",
+            "OIDCSKIPCERTVERIFY": "OIDC Verify Cert"
+        },
         "SCANNING": {
             "TRIGGER_SCAN_ALL_SUCCESS": "Trigger scan all successfully!",
             "TRIGGER_SCAN_ALL_FAIL": "Failed to trigger scan all with error: {{error}",
diff --git a/src/portal/src/i18n/lang/fr-fr-lang.json b/src/portal/src/i18n/lang/fr-fr-lang.json
index 44928ee39..fe962848d 100644
--- a/src/portal/src/i18n/lang/fr-fr-lang.json
+++ b/src/portal/src/i18n/lang/fr-fr-lang.json
@@ -54,12 +54,17 @@
         "ITEM_REQUIRED": "Le champ est obligatoire.",
         "NUMBER_REQUIRED": "Le champ est obligatoire et doit être numérique.",
         "PORT_REQUIRED": "Le champ est obligatoire et doit être un numéro de port valide.",
-        "CRON_REQUIRED": "Le champ est obligatoire et doit être au format cron.",        
+        "CRON_REQUIRED": "Le champ est obligatoire et doit être au format cron.",
         "EMAIL_EXISTING": "L'adresse e-mail existe déjà.",
         "USER_EXISTING": "Le nom d'utilisateur est déjà utilisé.",
         "NONEMPTY": "Can't be empty",
         "REPO_TOOLTIP": "Users can not do any operations to the images in this mode.",
-        "ENDPOINT_FORMAT": "Endpoint must start with HTTP or HTTPS."
+        "ENDPOINT_FORMAT": "Endpoint must start with HTTP or HTTPS.",
+        "OIDC_ENDPOIT_FORMAT": "Endpoint must start with HTTPS.",
+        "OIDC_NAME": "le nom du fournisseur de oidc.",
+        "OIDC_ENDPOINT": "l'url d'un serveur oidc plainte.",
+        "OIDC_SCOPE": "le champ envoyés au serveur au cours oidc l'authentification.il doit contenir 'openid', et 'offline_access'.si vous utilisez google, veuillez supprimer 'offline_access' dans ce domaine",
+        "OIDC_SKIPCERTVERIFY": "cocher cette case si votre oidc serveur est accueilli par auto - certificat signé."
     },
     "PLACEHOLDER": {
         "CURRENT_PWD": "Entrez le mot de passe actuel",
@@ -592,6 +597,7 @@
         "AUTH_MODE_DB": "Base de données",
         "AUTH_MODE_LDAP": "LDAP",
         "AUTH_MODE_HTTP": "http_auth",
+        "AUTH_MODE_OIDC": "OIDC",
         "SCOPE_BASE": "Base",
         "SCOPE_ONE_LEVEL": "Premier Niveau",
         "SCOPE_SUBTREE": "Sous-arbre",
@@ -648,6 +654,14 @@
             "ALWAYS_ONBOARD": "Always Onboard",
             "VERIFY_CERT": "authentification vérifier cert"
         },
+        "OIDC": {
+            "OIDC_PROVIDER": "OIDC fournisseur",
+            "ENDPOINT": "OIDC paramètre",
+            "CLIENT_ID": "no d'identification du client OIDC",
+            "CLIENTSECRET": "OIDC Client Secret",
+            "SCOPE": "OIDC Scope",
+            "OIDCSKIPCERTVERIFY": "OIDC vérifier cert"
+        },
         "SCANNING": {
             "TRIGGER_SCAN_ALL_SUCCESS": "Déclenchement d'analyse globale avec succès !",
             "TRIGGER_SCAN_ALL_FAIL": "Echec du déclenchement d'analyse globale avec des erreurs : {{error}",
diff --git a/src/portal/src/i18n/lang/pt-br-lang.json b/src/portal/src/i18n/lang/pt-br-lang.json
index d6a35fd9c..f58fdb8bb 100644
--- a/src/portal/src/i18n/lang/pt-br-lang.json
+++ b/src/portal/src/i18n/lang/pt-br-lang.json
@@ -65,12 +65,17 @@
         "ITEM_REQUIRED": "Campo é obrigatório.",
         "NUMBER_REQUIRED": "Campo é obrigatório e deve ser numerico.",
         "PORT_REQUIRED": "Campo é obrigatório e deve ser um número de porta válido.",
-        "CRON_REQUIRED": "O campo é obrigatório e deve estar no formato cron.",        
+        "CRON_REQUIRED": "O campo é obrigatório e deve estar no formato cron.",
         "EMAIL_EXISTING": "Email já existe.",
         "USER_EXISTING": "Nome de usuário já está em uso.",
         "RULE_USER_EXISTING": "Nome já em uso.",
         "EMPTY": "Nome é obrigatório",
-        "ENDPOINT_FORMAT": "Avaliação deve começar por HTTP Ou HTTPS."
+        "ENDPOINT_FORMAT": "Avaliação deve começar por HTTP Ou HTTPS.",
+        "OIDC_ENDPOIT_FORMAT": "Avaliação deve começar por HTTPS.",
+        "OIDC_NAME": "O Nome do prestador de oidc.",
+        "OIDC_ENDPOINT": "A URL de um servidor oidc denúncia.",
+        "OIDC_SCOPE": "O âmbito de aplicação enviada Ao servidor oidc Durante a autenticação.TEM que conter 'openid' e 'offline_access'.Se você está usando o Google, por favor remova 'offline_access' desse Campo.",
+        "OIDC_SKIPCERTVERIFY": "Assinale esta opção se o SEU servidor está hospedado oidc via self - signed certificate."
     },
     "PLACEHOLDER": {
         "CURRENT_PWD": "Insira a senha atual",
@@ -615,6 +620,7 @@
         "AUTH_MODE_LDAP": "LDAP",
         "AUTH_MODE_UAA": "UAA",
         "AUTH_MODE_HTTP": "http_auth",
+        "AUTH_MODE_OIDC": "OIDC",
         "SCOPE_BASE": "Base",
         "SCOPE_ONE_LEVEL": "OneLevel",
         "SCOPE_SUBTREE": "Subtree",
@@ -677,6 +683,14 @@
             "ALWAYS_ONBOARD": "Sempre Onboard",
             "VERIFY_CERT": "Verificar certificado de Authentication"
         },
+        "OIDC": {
+            "OIDC_PROVIDER": "OIDC Fornecedor",
+            "ENDPOINT": "OIDC Endpoint",
+            "CLIENT_ID": "ID de cliente OIDC",
+            "CLIENTSECRET": "OIDC Client Secret",
+            "SCOPE": "Escopo OIDC",
+            "OIDCSKIPCERTVERIFY": "Verificar certificado OIDC"
+        },
         "SCANNING": {
             "TRIGGER_SCAN_ALL_SUCCESS": "Disparo de análise geral efetuado com sucesso!",
             "TRIGGER_SCAN_ALL_FAIL": "Falha ao disparar análise geral com erro: {{error}",
diff --git a/src/portal/src/i18n/lang/zh-cn-lang.json b/src/portal/src/i18n/lang/zh-cn-lang.json
index c52155863..6c53a89ca 100644
--- a/src/portal/src/i18n/lang/zh-cn-lang.json
+++ b/src/portal/src/i18n/lang/zh-cn-lang.json
@@ -65,13 +65,18 @@
         "ITEM_REQUIRED": "此项为必填项。",
         "NUMBER_REQUIRED": "此项为必填项且为数字。",
         "PORT_REQUIRED": "此项为必填项且为合法端口号。",
-        "CRON_REQUIRED": "此项为必填项且为cron格式。",        
+        "CRON_REQUIRED": "此项为必填项且为cron格式。",
         "EMAIL_EXISTING": "邮件地址已经存在。",
         "USER_EXISTING": "用户名已经存在。",
         "RULE_USER_EXISTING": "名称已经存在。",
         "EMPTY": "名称为必填项",
         "NONEMPTY": "不能为空",
-        "ENDPOINT_FORMAT": "Endpoint必须以http或https开头。"
+        "ENDPOINT_FORMAT": "Endpoint必须以http或https开头。",
+        "OIDC_ENDPOIT_FORMAT": "Endpoint必须以https开头。",
+        "OIDC_NAME": "OIDC提供商的名称.",
+        "OIDC_ENDPOINT": "OIDC服务器的地址.",
+        "OIDC_SCOPE": "在身份验证期间发送到OIDC服务器的scope。它必须包含“openid”和“offline_access”。如果您使用Google，请从此字段中删除“脱机访问”。",
+        "OIDC_SKIPCERTVERIFY": "如果您的OIDC服务器是通过自签名证书托管的，请选中此框。"
     },
     "PLACEHOLDER": {
         "CURRENT_PWD": "输入当前密码",
@@ -620,6 +625,7 @@
         "AUTH_MODE_LDAP": "LDAP",
         "AUTH_MODE_UAA": "UAA",
         "AUTH_MODE_HTTP": "http_auth",
+        "AUTH_MODE_OIDC": "OIDC",
         "SCOPE_BASE": "本层",
         "SCOPE_ONE_LEVEL": "下一层",
         "SCOPE_SUBTREE": "子树",
@@ -682,6 +688,14 @@
             "ALWAYS_ONBOARD": "Always Onboard",
             "VERIFY_CERT": "Authentication验证证书"
         },
+        "OIDC": {
+            "OIDC_PROVIDER": "OIDC 供应商",
+            "ENDPOINT": "OIDC Endpoint",
+            "CLIENT_ID": "OIDC 客户端标识",
+            "CLIENTSECRET": "OIDC 客户端密码",
+            "SCOPE": "OIDC scope",
+            "OIDCSKIPCERTVERIFY": "OIDC 验证证书"
+        },
         "SCANNING": {
             "TRIGGER_SCAN_ALL_SUCCESS": "启动扫描所有镜像任务成功!",
             "TRIGGER_SCAN_ALL_FAIL": "启动扫描所有镜像任务失败:{{error}",