1
0
Fork 0
mirror of https://github.com/portainer/portainer.git synced 2025-08-02 20:35:25 +02:00

feat(ingress): support-regex-with-k8s-ingress EE-2644 (#6748)

* support regex with k8s ingress

* remove text for rewrite to /

* added tooltip
This commit is contained in:
Richard Wei 2022-04-20 16:45:20 +12:00 committed by GitHub
parent e20c34e12a
commit 9de0704775
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
7 changed files with 166 additions and 75 deletions

View file

@ -277,42 +277,16 @@
</div>
</div>
</div>
<div class="form-group" ng-if="ic.IngressClass.Type === $ctrl.IngressClassTypes.NGINX">
<div class="col-sm-12">
<label class="control-label text-left">
Redirect published routes to / in application
<portainer-tooltip
position="bottom"
message="Enables the redirection of any route published via ingress to the root path of the application, e.g. /path remaps to /"
>
</portainer-tooltip>
</label>
<label class="switch" style="margin-left: 20px">
<input type="checkbox" ng-model="ic.RewriteTarget" /><i data-cy="namespaceCreate-redirectRoutesToggle{{ ic.IngressClass.Name }}"></i>
</label>
</div>
</div>
</div>
<div ng-repeat-end class="form-group" ng-if="ic.Selected" style="margin-bottom: 20px">
<div class="col-sm-12">
<p>
<a class="small interactive" ng-if="!ic.AdvancedConfig" ng-click="ic.AdvancedConfig = true" data-cy="namespaceCreate-advancedConfig{{ ic.IngressClass.Name }}">
<i class="fa fa-plus space-right" aria-hidden="true"></i> Advanced configuration
</a>
<a class="small interactive" ng-if="ic.AdvancedConfig" ng-click="ic.AdvancedConfig = false" data-cy="namespaceCreate-hideConfig{{ ic.IngressClass.Name }}">
<i class="fa fa-minus space-right" aria-hidden="true"></i> Hide configuration
</a>
</p>
</div>
<div class="col-sm-12 small text-muted" ng-if="ic.AdvancedConfig" style="margin-top: 5px">
<div class="col-sm-12 small text-muted" style="margin-top: 5px">
<p>
<i class="fa fa-info-circle blue-icon" aria-hidden="true" style="margin-right: 2px"></i>
You can specify a list of annotations that will be associated to the ingress.
</p>
</div>
<div class="col-sm-12" ng-if="ic.AdvancedConfig">
<div class="col-sm-12">
<label class="control-label text-left">Annotations</label>
<span
class="label label-default interactive"
@ -322,9 +296,42 @@
>
<i class="fa fa-plus-circle" aria-hidden="true"></i> add annotation
</span>
<portainer-tooltip
position="bottom"
message="Use annotations to configure options for an ingress. Review Nginx or Traefik documentation to find the annotations supported by your choice of ingress type."
>
</portainer-tooltip>
<span
class="label label-default interactive"
style="margin-left: 10px"
ng-click="$ctrl.addRewriteAnnotation(ic)"
data-cy="namespaceCreate-addAnnotation{{ ic.IngressClass.Name }}"
>
<i class="fa fa-plus-circle" aria-hidden="true"></i> add rewrite annotation
</span>
<portainer-tooltip
ng-if="ic.IngressClass.Type === $ctrl.IngressClassTypes.NGINX"
position="bottom"
message="When the exposed URLs for your applications differ from the specified paths in the ingress, use the rewrite target annotation to denote the path to redirect to."
>
</portainer-tooltip>
<span
class="label label-default interactive"
ng-if="ic.IngressClass.Type === $ctrl.IngressClassTypes.NGINX"
style="margin-left: 10px"
ng-click="$ctrl.addUseregexAnnotation(ic)"
data-cy="namespaceCreate-addAnnotation{{ ic.IngressClass.Name }}"
>
<i class="fa fa-plus-circle" aria-hidden="true"></i> add regular expression annotation
</span>
<portainer-tooltip
ng-if="ic.IngressClass.Type === $ctrl.IngressClassTypes.NGINX"
position="bottom"
message="Enable use of regular expressions in ingress paths (set in the ingress details of an application). Use this along with rewrite-target to specify the regex capturing group to be replaced, e.g. path regex of ^/foo/(,*) and rewrite-target of /bar/$1 rewrites example.com/foo/account to example.com/bar/account."
>
</portainer-tooltip>
</div>
<div class="col-sm-12 form-inline" style="margin-top: 10px" ng-if="ic.AdvancedConfig">
<div class="col-sm-12 form-inline" style="margin-top: 10px">
<div ng-repeat="annotation in ic.Annotations track by $index" style="margin-top: 2px">
<div class="input-group col-sm-5 input-group-sm">
<span class="input-group-addon">Key</span>
@ -332,7 +339,11 @@
type="text"
class="form-control"
ng-model="annotation.Key"
placeholder="nginx.ingress.kubernetes.io/rewrite-target"
placeholder="{{
ic.IngressClass.Type === $ctrl.IngressClassTypes.NGINX
? 'e.g. nginx.ingress.kubernetes.io/enable-rewrite-log'
: 'e.g. traefik.ingress.kubernetes.io/router.priority'
}}"
required
data-cy="namespaceCreate-annotationKey{{ ic.IngressClass.Name }}"
/>
@ -343,7 +354,7 @@
type="text"
class="form-control"
ng-model="annotation.Value"
placeholder="/$1"
placeholder="{{ ic.IngressClass.Type === $ctrl.IngressClassTypes.NGINX ? 'e.g. true or false' : 'e.g. 42' }}"
required
data-cy="namespaceCreate-annotationValue{{ ic.IngressClass.Name }}"
/>

View file

@ -6,6 +6,9 @@ import {
KubernetesResourcePoolFormValues,
KubernetesResourcePoolIngressClassAnnotationFormValue,
KubernetesResourcePoolIngressClassHostFormValue,
KubernetesResourcePoolNginxRewriteAnnotationFormValue,
KubernetesResourcePoolNginxUseregexAnnotationFormValue,
KubernetesResourcePoolTraefikRewriteAnnotationFormValue,
} from 'Kubernetes/models/resource-pool/formValues';
import { KubernetesIngressConverter } from 'Kubernetes/ingress/converter';
import KubernetesFormValidationHelper from 'Kubernetes/helpers/formValidationHelper';
@ -96,6 +99,20 @@ class KubernetesCreateResourcePoolController {
ingressClass.Annotations.push(new KubernetesResourcePoolIngressClassAnnotationFormValue());
}
addRewriteAnnotation(ingressClass) {
if (ingressClass.IngressClass.Type === this.IngressClassTypes.NGINX) {
ingressClass.Annotations.push(new KubernetesResourcePoolNginxRewriteAnnotationFormValue());
}
if (ingressClass.IngressClass.Type === this.IngressClassTypes.TRAEFIK) {
ingressClass.Annotations.push(new KubernetesResourcePoolTraefikRewriteAnnotationFormValue());
}
}
addUseregexAnnotation(ingressClass) {
ingressClass.Annotations.push(new KubernetesResourcePoolNginxUseregexAnnotationFormValue());
}
removeAnnotation(ingressClass, index) {
ingressClass.Annotations.splice(index, 1);
}

View file

@ -237,56 +237,80 @@
</div>
</div>
</div>
<div class="form-group" ng-if="ic.IngressClass.Type === ctrl.IngressClassTypes.NGINX">
<div class="col-sm-12">
<label class="control-label text-left">
Redirect published routes to / in application
<portainer-tooltip
position="bottom"
message="Enables the redirection of any route published via ingress to the root path of the application, e.g. /path remaps to /"
>
</portainer-tooltip>
</label>
<label class="switch" style="margin-left: 20px"> <input type="checkbox" ng-model="ic.RewriteTarget" /><i></i> </label>
</div>
</div>
</div>
<div ng-repeat-end class="form-group" ng-if="ic.Selected" style="margin-bottom: 20px">
<div class="col-sm-12">
<p>
<a class="small interactive" ng-if="!ic.AdvancedConfig" ng-click="ic.AdvancedConfig = true">
<i class="fa fa-plus space-right" aria-hidden="true"></i> Advanced configuration
</a>
<a class="small interactive" ng-if="ic.AdvancedConfig" ng-click="ic.AdvancedConfig = false">
<i class="fa fa-minus space-right" aria-hidden="true"></i> Hide configuration
</a>
</p>
</div>
<div class="col-sm-12 small text-muted" ng-if="ic.AdvancedConfig" style="margin-top: 5px">
<div class="col-sm-12 small text-muted" style="margin-top: 5px">
<p>
<i class="fa fa-info-circle blue-icon" aria-hidden="true" style="margin-right: 2px"></i>
You can specify a list of annotations that will be associated to the ingress.
</p>
</div>
<div class="col-sm-12" ng-if="ic.AdvancedConfig">
<div class="col-sm-12">
<label class="control-label text-left">Annotations</label>
<span class="label label-default interactive" style="margin-left: 10px" ng-click="ctrl.addAnnotation(ic)">
<i class="fa fa-plus-circle" aria-hidden="true"></i> add annotation
</span>
<portainer-tooltip
position="bottom"
message="Use annotations to configure options for an ingress. Review Nginx or Traefik documentation to find the annotations supported by your choice of ingress type."
>
</portainer-tooltip>
<span
class="label label-default interactive"
ng-if="ic.IngressClass.Type === ctrl.IngressClassTypes.NGINX"
style="margin-left: 10px"
ng-click="ctrl.addRewriteAnnotation(ic)"
>
<i class="fa fa-plus-circle" aria-hidden="true"></i> add rewrite annotation
</span>
<portainer-tooltip
ng-if="ic.IngressClass.Type === ctrl.IngressClassTypes.NGINX"
position="bottom"
message="When the exposed URLs for your applications differ from the specified paths in the ingress, use the rewrite target annotation to denote the path to redirect to."
>
</portainer-tooltip>
<span
class="label label-default interactive"
ng-if="ic.IngressClass.Type === ctrl.IngressClassTypes.NGINX"
style="margin-left: 10px"
ng-click="ctrl.addUseregexAnnotation(ic)"
>
<i class="fa fa-plus-circle" aria-hidden="true"></i> add regular expression annotation
</span>
<portainer-tooltip
ng-if="ic.IngressClass.Type === ctrl.IngressClassTypes.NGINX"
position="bottom"
message="Enable use of regular expressions in ingress paths (set in the ingress details of an application). Use this along with rewrite-target to specify the regex capturing group to be replaced, e.g. path regex of ^/foo/(,*) and rewrite-target of /bar/$1 rewrites example.com/foo/account to example.com/bar/account."
>
</portainer-tooltip>
</div>
<div class="col-sm-12 form-inline" style="margin-top: 10px" ng-if="ic.AdvancedConfig">
<div class="col-sm-12 form-inline" style="margin-top: 10px">
<div ng-repeat="annotation in ic.Annotations track by $index" style="margin-top: 2px">
<div class="input-group col-sm-5 input-group-sm">
<span class="input-group-addon">Key</span>
<input type="text" class="form-control" ng-model="annotation.Key" placeholder="nginx.ingress.kubernetes.io/rewrite-target" required />
<input
type="text"
class="form-control"
ng-model="annotation.Key"
placeholder="{{
ic.IngressClass.Type === ctrl.IngressClassTypes.NGINX
? 'e.g. nginx.ingress.kubernetes.io/enable-rewrite-log'
: 'e.g. traefik.ingress.kubernetes.io/router.priority'
}}"
required
/>
</div>
<div class="input-group col-sm-5 input-group-sm">
<span class="input-group-addon">Value</span>
<input type="text" class="form-control" ng-model="annotation.Value" placeholder="/$1" required />
<input
type="text"
class="form-control"
ng-model="annotation.Value"
placeholder="{{ ic.IngressClass.Type === ctrl.IngressClassTypes.NGINX ? 'e.g. true or false' : 'e.g. 42' }}"
required
/>
</div>
<div class="col-sm-1 input-group input-group-sm">
<button class="btn btn-sm btn-danger" type="button" ng-click="ctrl.removeAnnotation(ic, $index)">

View file

@ -9,6 +9,9 @@ import {
KubernetesResourcePoolFormValues,
KubernetesResourcePoolIngressClassAnnotationFormValue,
KubernetesResourcePoolIngressClassHostFormValue,
KubernetesResourcePoolNginxRewriteAnnotationFormValue,
KubernetesResourcePoolNginxUseregexAnnotationFormValue,
KubernetesResourcePoolTraefikRewriteAnnotationFormValue,
} from 'Kubernetes/models/resource-pool/formValues';
import { KubernetesIngressConverter } from 'Kubernetes/ingress/converter';
import { KubernetesFormValidationReferences } from 'Kubernetes/models/application/formValues';
@ -78,6 +81,20 @@ class KubernetesResourcePoolController {
ingressClass.Annotations.push(new KubernetesResourcePoolIngressClassAnnotationFormValue());
}
addRewriteAnnotation(ingressClass) {
if (ingressClass.IngressClass.Type === this.IngressClassTypes.NGINX) {
ingressClass.Annotations.push(new KubernetesResourcePoolNginxRewriteAnnotationFormValue());
}
if (ingressClass.IngressClass.Type === this.IngressClassTypes.TRAEFIK) {
ingressClass.Annotations.push(new KubernetesResourcePoolTraefikRewriteAnnotationFormValue());
}
}
addUseregexAnnotation(ingressClass) {
ingressClass.Annotations.push(new KubernetesResourcePoolNginxUseregexAnnotationFormValue());
}
removeAnnotation(ingressClass, index) {
ingressClass.Annotations.splice(index, 1);
this.onChangeIngressHostname();