Unable to use self hosted GitLab as storage for self hosted drawio

[AmmarovTou]

Hi, I'm trying to self host drawio on k8s, and use a self hosted GitLab(not gitlab.com) for storage.

However, I'm not able to use self hosted GitLab as storage and also edit the DRAWIO_CSP_HEADER env variable, together at the same time.

If I provide a value for the DRAWIO_CSP_HEADER env variable, then when trying to authorize self hosted drawio to use self hosted gitlab, it will result in re-directing to gitlab.com sign in page instead of redirecting to <company-gitlab>.com.

If I don't provide a value for the DRAWIO_CSP_HEADER env variable, then when trying to authorize self hosted drawio to use self hosted gitlab, it will redirect correctly to the <company-gitlab>.com and authorize, but when it comes back to the drawio page, it shows Error Access Denied, checking the browser logs(firefox):

Content Security Policy: The page’s settings blocked the loading of a resource at https://<company-gitlab>.com/api/v4/user (“connect-src”).

hence the need to provide a value for the DRAWIO_CSP_HEADER env variable.

Is there a bug? or is there a misconfiguration? then what is the correct configuration? Thanks.

---

I've searched in the issues, the closest one I found is: https://github.com/jgraph/drawio/issues/1884 but the comments were deleted and the issue was closed.

---

Steps to re-produce:

1. Created the drawio application in GitLab, with the settings: Callback URL: https://<company-drawio>.com/gitlab Confidential: yes. Scopes: api, read_repository, write_repository. Provide the app ID and secret as env variables in the manifest below.

2. The k8s manifest:

   
   apiVersion: v1
   kind: Namespace
   metadata:
   name: drawio
   ---
   apiVersion: v1
   kind: Service
   metadata:
   name: drawio
   namespace: drawio
   labels:
   app: draw.io
   spec:
   type: ClusterIP
   sessionAffinity: ClientIP
   sessionAffinityConfig:
   clientIP:
     timeoutSeconds: 3600
   ports:
   - name: http
   port: 8080
   - name: https
   port: 443
   protocol: TCP
   targetPort: 8080
   selector:
   app: draw.io
   ---
   apiVersion: networking.k8s.io/v1
   kind: Ingress
   metadata:
   annotations:
   kubernetes.io/ingress.class: traefik
   labels:
   app: draw.io
   name: drawio-ingress
   namespace: drawio

spec: rules:

• host: .com http: paths:

  • backend: service: name: drawio port: number: 8080 path: / pathType: Prefix

    apiVersion: apps/v1 kind: Deployment metadata: name: drawio namespace: drawio spec: replicas: 1 selector: matchLabels: app: draw.io template: metadata: labels: app: draw.io spec: containers:

  • image: docker.io/jgraph/drawio:20.2.8 imagePullPolicy: Always name: drawio resources: limits: cpu: 200m memory: 512Mi requests: cpu: 50m memory: 128Mi ports:
    • containerPort: 8080 env:

      Enable GitLab storage.

    • name: gl value: "1"
    • name: DRAWIO_GITLAB_ID value: ""
    • name: DRAWIO_BASE_URL value: "https://.com"
    • name: DRAWIO_GITLAB_URL value: "https://.com"
    • name: DRAWIO_GITLAB_SECRET value: ""

    • name: DRAWIO_CSP_HEADER value: "default-src \'self\'; script-src \'self\' \'unsafe-inline\'; connect-src \'self\' https://.com; img-src data:; media-src data:; font-src * about:; style-src \'self\' \'unsafe-inline\'; object-src \'none\';"

      3. Open drawio --> Save diagrams to --> GitLab --> Create New Diagram --> Create --> Authorize, here it shows:
      `Error Access Denied`
      browser logs(firefox):

      Content Security Policy: The page’s settings blocked the loading of a resource at https://.com/api/v4/user (“connect-src”).

Thanks.

[stale[bot]]

This issue has been automatically marked as stale because it has not had recent activity. It will be closed if no further activity occurs. Thank you for your contributions. See the FAQ for more information.

[MorganReid]

I met the same problem, did you solve it?

[r4venlord]

I have the same problem, any progress with this integration?

[BigTows]

Got same effect. PreConfig.js generated correctly but nothing changes

[johanlundberg92]

Had the same problem when running on K8s and I solved it by just adding my Gitlab URL to the docker-entrypoint.sh line 19 where it generates PreConfig.js. To be clear I created my own image and edited the docker-entrypoint.sh.

[LU-386]

Hey, could we achieve something like that for a more general use? I'm writing a plugin to reference data into diagrams and would like to call a server for that purpose.

  Refused to connect to https://server.domain.tld/endpoint?format=json because it does not appear in the connect-src directive of the Content Security Policy.

Maybe an ENV-Variable like "DRAWIO_EXT_RESOURCES" would be suitable for this.

[m-mohamedin]

You can

Hey, could we achieve something like that for a more general use? I'm writing a plugin to reference data into diagrams and would like to call a server for that purpose.

Refused to connect to https://server.domain.tld/endpoint?format=json because it does not appear in the connect-src directive of the Content Security Policy.

Maybe an ENV-Variable like "DRAWIO_EXT_RESOURCES" would be suitable for this.

You can set CSP using DRAWIO_CSP_HEADER variable

[omaralbalolly]

I had the same issue and I fixed it by escaping the backslashes in DRAWIO_CSP_HEADER

apiVersion: v1
kind: ConfigMap
metadata:
  name: drawio-config
  namespace: drawio
data:
  DRAWIO_GITLAB_ID: xxxx
  DRAWIO_GITLAB_SECRET: xxxx
  DRAWIO_GITLAB_URL: https://<company-gitlab>.com
  DRAWIO_CSP_HEADER: "default-src \\'self\\'; script-src \\'self\\' \\'unsafe-inline\\'; connect-src \\'self\\' https://<company-gitlab>.com; img-src * data:; media-src * data:; font-src * about:; style-src \\'self\\' \\'unsafe-inline\\'; object-src \\'none\\';"