app assets are not accessible behind nginx proxy on kubernetes

[rvashishth]

Similar issue on pulsar dashboard

I have deployed pulsar-express on azure kubernetes services. when loading the on browser using nginx ingress controller host name, it failed to load resources. All call to resources are made using absolute path.

here Pulsar-Express is deployed behind < https://cluster-host/pulsar-express > but all call to asset resources is not going via /pulsar-express uri, instead all call are made to absolute uri. https://cluster-host/_nuxt/576314c3783866ee5689.js instead of https://cluster-host/pulsar-express/_nuxt/576314c3783866ee5689.js

[bbonnin]

Hi,

I have made a quick fix.
The steps:

• Set the base URL you want to use: export PE_BASE_URL=pulsar-express
• Rebuild the docker image: npm run docker-build (or docker build --build-arg BASE_URL=${PE_BASE_URL} -t pulsar-express .)
• Run the image, for example: docker run -it -p 3000:3000 -e PE_CONNECTION_URL=http://host.docker.internal:8080 -e PE_BASE_URL=${PE_BASE_URL} pulsar-express

When running the image, do not forget to set PE_BASE_URL !

HTH

[rvashishth]

@jiazhai @bbonnin
I have tested this fix over ingress, there still seems some issue while loading the fonts.

Refused to load the font 'data:font/woff;base64,d09KZU=' because it violates the following Content Security Policy directive: "default-src 'none'". Note that 'font-src' was not explicitly set, so 'default-src' is used as a fallback.

[bbonnin-zen]

@rvashishth
I've just pushed a config file for this problem.
Can you test and let me know if it's better ?

[rvashishth]

it didn't work for me via nginx. Though i can access the app using LoadBalancer service type. Check below the kubernetes nginx config and errors.

{
  "kind": "Ingress",
  "apiVersion": "extensions/v1beta1",
  "metadata": {
    "name": "pulsar-dashboard",
      "annotations": {
      "kubernetes.io/ingress.class": "nginx",
      "nginx.ingress.kubernetes.io/rewrite-target": "/$2"
    }
  },
  "spec": {
    "rules": [
      {
        "host": “my.domain”,
        "http": {
          "paths": [
            {
              "path": "/pexpress(/|$)(.*)",
              "backend": {
                "serviceName": "pulsar-express",
                "servicePort": 3000
              }
            }
          ]
        }
      }
    ]
  }
}

Error remains same.

[bruno-bonnin-cbp]

In my fix, I've updated the content security policy directive.
And you should not get this error.
You have this error with the first page ?
Have you rebuilt the project before redeploying it ?

[rvashishth]

yes. i have tested with updated build.

[bruno-bonnin-cbp]

If you inspect the first page for example, have you the same values like in this image ?