Hosting webapp with relative URLs behind Kubernetes NGINX ingress controller

Asked 28/3, 2019 at 10:4 Answered 5/5, 2020 at 19:37

Solved kubernetes-ingress nginx-reverse-proxy

I am hosting a web application inside a Kubernetes 1.13 cluster behind an NGINX ingress controller. The Ingress specifies path: /my-webapp/?(.*) and annotations: { nginx.ingress.kubernetes.io/rewrite-target: /$1 } such that the webapp can be reached from outside the cluster at http://my-cluster/my-webapp. (The ingress controller is exposed as my-cluster.)

One remaining problem is that the webapp contains "relative" URLs that refer e.g. to CGI scripts and to CSS stylesheets. For instance, the stylesheet in <link rel="stylesheet" type="text/css" href="/my-stylesheet.css" /> currently does not load. I assume this is because the browser requests it at the wrong URL (http://my-cluster/my-webapp/my-stylesheet.css would be right) and that some more annotations are needed.

What is the correct configuration is such a case?

UPDATE The inspector reveals that the browser currently requests the stylesheet from URL http://my-cluster/my-stylesheet.css, which is indeed wrong and needs to be fixed.

UPDATE This looks like a related problem with an NGINX reverse proxy in general, not a Kubernetes NGINX ingress controller in particular. I wonder if and how the suggested recipes can also serve in this particular case. For a start, I have tried switching to a relative URL for referencing the stylesheet (per recipe One in the accepted answer), but this also has not worked so far: <link rel="stylesheet" type="text/css" href="my-stylesheet.css" />, the browser apparently still tries to get the stylesheet from http://my-cluster/my-stylesheet.css, although it displays http://my-cluster/my-webapp in the URL bar and the inspector reports the same URL as baseURI.

Berhley answered 28/3, 2019 at 10:4 Comment(0)

Now this combination of annotations seems to do the trick:

annotations:
  nginx.ingress.kubernetes.io/configuration-snippet: |
    proxy_set_header Accept-Encoding "";
    sub_filter '<head>' '<head> <base href="/my-webapp/">';
  nginx.ingress.kubernetes.io/rewrite-target: /$1
  nginx.ingress.kubernetes.io/use-regex: "true"

I am currently using this version of the ingress controller:

-------------------------------------------------------------------------------
NGINX Ingress controller
  Release:    0.23.0
  Build:      git-be1329b22
  Repository: https://github.com/kubernetes/ingress-nginx
-------------------------------------------------------------------------------

Berhley answered 29/3, 2019 at 13:39 Comment(3)

but doesn't that do it for any other path? if you added /myapi it would fail – Streetwalker 24/10, 2019 at 22:36

To solve the issue mentioned by Brett, you can replace the hard-coded <base href="/my-webapp/"> by a variable that matches the path: <base href="/$1/">. To make regex assign the path to $1, put it between parenthesis, as follows: <pre> - host: demo.localdev.me http: paths: - path: /(my-webapp)/?(.*) ... - path: /(my-other-webapp)/?(.*) ... </pre> Now $2 matches the remainer of the path, so: nginx.ingress.kubernetes.io/rewrite-target: /$2 – Sikorsky 22/6, 2022 at 13:51

@GerritBrouwer I believe you have misunderstood the issue that Brett mentioned. Correct me if I'm wrong, but what you're doing simply makes you able to change the path only in one place. But it won't correctly rewrite links like /api/... to /my-webapp/api, which is the issue at hand here. – Inez 20/9 at 14:24

In my situation, I must replace URL-s from wsdl service page and this my solution code that was written thanks to the above code

nginx.ingress.kubernetes.io/configuration-snippet: |
  sub_filter 'http://example.com:80/project/domain/' 'http://example.com:80${PUBLISH_PATH}/project/domain/';
  sub_filter_once off;
  sub_filter_types text/xml;

${PUBLISH_PATH} - is the kuber domain specific

Conjure answered 5/5, 2020 at 19:37 Comment(0)

Recommended topics

Hot tags