Resolving CORS Error in Taiga Development Environment

Troubleshooting
1

Hi Taiga Community,

I’m currently setting up a development environment for Taiga on Ubuntu server via vm ware, the steps followed by and have encountered a Cross-Origin Resource Sharing (CORS) error when trying to access the Taiga front-end. I’ve tried several configurations, but the issue persists. Here’s a brief overview of my setup and the steps I’ve taken:

Setup Overview

  • OS: Ubuntu
  • **Taiga Version:6.8.0
  • Backend: Django python3.8
  • Frontend: (Taiga front-end)
  • Web Server: Nginx
  • Database: psql (PostgreSQL) 12.19 (Ubuntu 12.19-1.pgdg24.04+1)

Issue

When I try to access the front-end, I receive the following CORS error in the browser console:

The stylesheet http://taskusfdev.thepermatech.pit/v-1719498476318/styles/theme-taiga.css was not loaded because its MIME type, “text/html”, is not “text/css”

Additionally, there are CORS errors when making API requests.

Steps Taken

1. Configured CORS in Django (Taiga Back-end)

  • Installed django-cors-headers:
    pip install django-cors-headers
  • Updated settings.py:
    INSTALLED_APPS = [
    ...
    'corsheaders',
    ...
]

MIDDLEWARE = [
    ...
    'corsheaders.middleware.CorsMiddleware',
    'django.middleware.common.CommonMiddleware',
    ...
]

CORS_ALLOWED_ORIGINS = [
    "http://your_frontend_domain",
    "http://another_allowed_domain",
]
    Tried allowing all origins:
    CORS_ALLOW_ALL_ORIGINS = True
  • Restarted the Django server:
    python manage.py runserver

2. Configured Nginx

  • Nginx Configuration for the back-end:
    server {
    listen 80;
    server_name your_backend_domain;

    location / {
        proxy_pass http://192.168.1.100:8000;
        proxy_set_header Host $host;
        proxy_set_header X-Real-IP $remote_addr;
        proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
        proxy_set_header X-Forwarded-Proto $scheme;

        # Add CORS headers
        if ($request_method = 'OPTIONS') {
            add_header 'Access-Control-Allow-Origin' '*';
            add_header 'Access-Control-Allow-Methods' 'GET, POST, OPTIONS';
            add_header 'Access-Control-Allow-Headers' 'DNT,User-Agent,X-Requested-With,If-Modified-Since,Cache-Control,Content-Type,Range';
            add_header 'Access-Control-Max-Age' 1728000;
            add_header 'Content-Type' 'text/plain; charset=utf-8';
            add_header 'Content-Length' 0;
            return 204;
        }

        add_header 'Access-Control-Allow-Origin' '*';
        add_header 'Access-Control-Allow-Methods' 'GET, POST, OPTIONS';
        add_header 'Access-Control-Allow-Headers' 'DNT,User-Agent,X-Requested-With,If-Modified-Since,Cache-Control,Content-Type,Range';
    }
}

Despite these configurations, the CORS error persists. I suspect there might be additional steps or configurations that I’m missing.

Questions

  1. Is there a specific configuration for Taiga that I might be missing?
  2. Are there known issues or additional settings required to resolve CORS errors in the Taiga development environment?
  3. Any advice or guidance from those who have successfully set up Taiga as development environment would be greatly appreciated!

Thank you in advance for your help!

Best regards,
Subash S

2

Hi there,

I found this thread where they discuss an error similar to yours, does this help?

In their case, it’s not a development environment, though most things should still apply.

Best regards!

3

Thanks for your reply,
In my issue I’ve missed to add the below headers in the taiga back end
taiga-back\settings\common.py

CORS_ALLOW_HEADERS = [
‘x-session-id’,
‘content-type’,
‘accept’,
‘origin’,
‘authorization’,
‘x-csrftoken’,
‘x-requested-with’,
‘x-lazy-pagination’,
‘x-disable-pagination’,
‘set-orders’,
]