2

Cors preflight requests do not work when a Jwt Policy is configured on the istio-ingressgateway target.

Gateway

apiVersion: networking.istio.io/v1alpha3
kind: Gateway
metadata:
  name: api-gateway
  namespace: foo
spec:
  selector:
    istio: ingressgateway # use istio default controller
  servers:
    - port:
        number: 80
        name: http
        protocol: HTTP
      hosts:
        - "api.example.com"
      tls:
        httpsRedirect: true # sends 301 redirects for http requests
    - port:
        number: 443
        name: https
        protocol: HTTPS
      tls:
        mode: SIMPLE
        serverCertificate: /etc/istio/ingressgateway-certs/tls.crt
        privateKey: /etc/istio/ingressgateway-certs/tls.key
      hosts:
        - "api.example.com"

Virtual Service

apiVersion: networking.istio.io/v1alpha3
kind: VirtualService
metadata:
  name: backend-vs
  namespace: foo
spec:
  hosts:
    - "api.example.com"
  gateways:
    - api-gateway
  http:
    - match:
        - uri:
            prefix: /api/v1/info
      route:
        - destination:
            host: backend.foo.svc.cluster.local
      corsPolicy:
        allowOrigin:
          - "https://app.example.com"
        allowMethods:
          - POST
          - GET
          - PUT
          - DELETE
          - PATCH
          - OPTIONS
        allowHeaders:
          - authorization
          - content-type
          - accept
          - origin
          - user-agent
        allowCredentials: true
        maxAge: 300s

Security

apiVersion: "security.istio.io/v1beta1"
kind: "RequestAuthentication"
metadata:
  name: "jwt-example"
  namespace: foo
spec:
  selector:
    matchLabels:
      app: backend
  jwtRules:
    - issuer: "http://keycloak.foo/auth/realms/example"
      jwksUri: "http://keycloak.foo/auth/realms/example/protocol/openid-connect/certs"
---
apiVersion: security.istio.io/v1beta1
kind: AuthorizationPolicy
metadata:
  name: require-jwt-example
  namespace: foo
spec:
  selector:
    matchLabels:
      app: backend
  action: ALLOW
  rules:
    - from:
        - source:
            requestPrincipals: ["http://keycloak.foo/auth/realms/example/http://keycloak.foo/auth/realms/example"]
      when:
        - key: request.auth.claims[groups]
          values: ["group1"]

when I test the web application in firefox it works fine, but in other browsers like opera, chrome, safari, it fails with the following error:

Access to XMLHttpRequest at 'https://api.example.com/api/v1/info' from origin 'https://app.example.com' has been blocked by CORS policy: Response to preflight request doesn't pass access control check: No 'Access-Control-Allow-Origin' header is present on the requested resource.

What makes me more thoughtful is because in firefox it works well but in other browsers it fails

NOTE: To validate that the cors policy was correct in istio, what I did was disable this policy in istio and test in firefox to see what was happening, the result was that a problem with cors did indeed come out, but when I re-enabled the cors in istio when rerunning in firefox the request works fine.

Juanes30
  • 2,398
  • 2
  • 24
  • 38
  • In cases where it works in some browsers but fails in others, the most-likely cause is browser extensions. So make sure to test with all browser extensions disabled. Adblock is one extension in particular that’s often the cause of scripted requests failing. – sideshowbarker Apr 11 '20 at 08:17
  • disable all chrome extensions and it does not work, the problem persists, the strange thing is that I do not have extensions in safari and it does not work there either. – Juanes30 Apr 11 '20 at 17:35
  • As the issue was solved I would suggest to add UPDATE as an answer and accept it for more visibility. Then open new post for the cors/browsers issues itself. About this cors/browsers issue, take a loot at comments [here](https://stackoverflow.com/questions/41080556/chrome-vs-firefox-why-do-cors-headers-behave-differently-and-how-should-i-use) and answers [here](https://stackoverflow.com/questions/10636611/how-does-access-control-allow-origin-header-work). – Jakub Apr 14 '20 at 13:12

1 Answers1

0

Good after doing segmented tests and see what was causing the error, I found that the problem appeared when I created the keycloak gateway (keycloak.example.com) that was running on the same service port (backend.example.com) , which by default for https is 443 and for http is 80.

What I did was expose keycloak to another port on the gateway (ingressgateway). with the above and the angular application I stop putting problem of the cors.

Juanes30
  • 2,398
  • 2
  • 24
  • 38