CORS issue on a fresh install #4923

Closed
opened 2026-02-21 18:08:37 -05:00 by yindo · 3 comments
Owner

Originally created by @ruzzzz6312 on GitHub (Aug 6, 2024).

Self Checks

  • This is only for bug report, if you would like to ask a question, please head to Discussions.
  • I have searched for existing issues search for existing issues, including closed ones.
  • I confirm that I am using English to submit this report (我已阅读并同意 Language Policy).
  • [FOR CHINESE USERS] 请务必使用英文提交 Issue,否则会被关闭。谢谢!:)
  • Please do not modify this template :) and fill in all the required fields.

Dify version

0.6.16

Cloud or Self Hosted

Self Hosted (Docker)

Steps to reproduce

Installation method
Self-hosted using Docker

Steps to Reproduce
Installation as per https://docs.dify.ai/getting-started/install-self-hosted/docker-compose
All good.
Then proceeding to http://localhost:8080/install (using SSH tunneling) or to http://domain.....com/install

Seeing this blank screen with CORS errors.

Tried accessing here:
http://localhost:8080/signin, I see the page but I have to initialize first, so when I click, I see same as in step #2.

Console logs:
Cross-Origin Request Blocked: The Same Origin Policy disallows reading the remote resource at https://api.console.dify.xxx.com/console/api/system-features. (Reason: CORS request did not succeed). Status code: (null).

Cross-Origin Request Blocked: The Same Origin Policy disallows reading the remote resource at https://api.console.dify.xxx.com/console/api/system-features. (Reason: CORS request did not succeed). Status code: (null).

Uncaught (in promise) TypeError: NetworkError when attempting to fetch resource.

Please help, thanks!

P.S. I checked both github and discord search

My ENV.
[ec2-user@xxx docker]$ cat .env | grep "URL"
The backend URL of the console API,
CONSOLE_API_URL=https://api.console.dify.xxx.com/
The front-end URL of the console web,
CONSOLE_WEB_URL=https://console.dify.xxx.com/
SERVICE_API_URL=https://api.dify.xxx.com/
used to declare the back-end URL for the front-end API.
APP_API_URL=https://api.app.dify.xxx.com/
APP_WEB_URL=https://app.dify.xxx.com/
FILES_URL=https://app.dify.xxx.com/
CHECK_UPDATE_URL=https://updates.dify.ai/

Screenshot 2024-08-06 at 2 00 37 PM

✔️ Expected Behavior

Expected Behavior
I was execting to continue installation process

Actual Behavior

Actual Behavior
I see an infinite loader with CORS errors in console

Originally created by @ruzzzz6312 on GitHub (Aug 6, 2024). ### Self Checks - [X] This is only for bug report, if you would like to ask a question, please head to [Discussions](https://github.com/langgenius/dify/discussions/categories/general). - [X] I have searched for existing issues [search for existing issues](https://github.com/langgenius/dify/issues), including closed ones. - [X] I confirm that I am using English to submit this report (我已阅读并同意 [Language Policy](https://github.com/langgenius/dify/issues/1542)). - [X] [FOR CHINESE USERS] 请务必使用英文提交 Issue,否则会被关闭。谢谢!:) - [X] Please do not modify this template :) and fill in all the required fields. ### Dify version 0.6.16 ### Cloud or Self Hosted Self Hosted (Docker) ### Steps to reproduce Installation method Self-hosted using Docker Steps to Reproduce Installation as per https://docs.dify.ai/getting-started/install-self-hosted/docker-compose All good. Then proceeding to http://localhost:8080/install (using SSH tunneling) or to http://domain.....com/install Seeing this blank screen with CORS errors. Tried accessing here: http://localhost:8080/signin, I see the page but I have to initialize first, so when I click, I see same as in step #2. Console logs: Cross-Origin Request Blocked: The Same Origin Policy disallows reading the remote resource at https://api.console.dify.xxx.com/console/api/system-features. (Reason: CORS request did not succeed). Status code: (null). Cross-Origin Request Blocked: The Same Origin Policy disallows reading the remote resource at https://api.console.dify.xxx.com/console/api/system-features. (Reason: CORS request did not succeed). Status code: (null). Uncaught (in promise) TypeError: NetworkError when attempting to fetch resource. Please help, thanks! P.S. I checked both github and discord search My ENV. [ec2-user@xxx docker]$ cat .env | grep "URL" The backend URL of the console API, CONSOLE_API_URL=https://api.console.dify.xxx.com/ The front-end URL of the console web, CONSOLE_WEB_URL=https://console.dify.xxx.com/ SERVICE_API_URL=https://api.dify.xxx.com/ used to declare the back-end URL for the front-end API. APP_API_URL=https://api.app.dify.xxx.com/ APP_WEB_URL=https://app.dify.xxx.com/ FILES_URL=https://app.dify.xxx.com/ CHECK_UPDATE_URL=https://updates.dify.ai/ <img width="1496" alt="Screenshot 2024-08-06 at 2 00 37 PM" src="https://github.com/user-attachments/assets/8b3e4e35-851e-4f0a-810d-bdbc492dc36e"> ### ✔️ Expected Behavior Expected Behavior I was execting to continue installation process ### ❌ Actual Behavior Actual Behavior I see an infinite loader with CORS errors in console
yindo added the 🐞 bug label 2026-02-21 18:08:37 -05:00
yindo closed this issue 2026-02-21 18:08:37 -05:00
Author
Owner

@dosubot[bot] commented on GitHub (Aug 6, 2024):

Hey @ruzzzz6312! I'm here to help you with any bugs, questions, or contributions you have for the Dify repository. Let's tackle this CORS issue together while we wait for the human maintainer.

To resolve the CORS issue on your fresh install of Dify version 0.6.16, which is self-hosted using Docker, you need to update the CORS configuration in your docker-compose.yml file. Here are the steps:

  1. Update the .env file:
    Ensure that all URLs are correctly set to your specific domain names:

    CONSOLE_API_URL=https://api.console.dify.xxx.com/
    CONSOLE_WEB_URL=https://console.dify.xxx.com/
    SERVICE_API_URL=https://api.dify.xxx.com/
    APP_API_URL=https://api.app.dify.xxx.com/
    APP_WEB_URL=https://app.dify.xxx.com/
    
  2. Update the docker-compose.yml file:
    Make sure the environment variables in the docker-compose.yml file are also set to allow CORS from all origins:

    environment:
      CONSOLE_CORS_ALLOW_ORIGINS: "*"
      WEB_API_CORS_ALLOW_ORIGINS: "*"
    
  3. Set CORS headers in Nginx:
    If you are using Nginx as a reverse proxy, ensure that the CORS headers are correctly set in your nginx.conf:

    server {
        listen 80;
        server_name your_domain.com;
    
        location / {
            proxy_pass http://api:5001;
            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
            add_header 'Access-Control-Allow-Origin' '*';
            add_header 'Access-Control-Allow-Methods' 'GET, POST, OPTIONS, DELETE, PUT';
            add_header 'Access-Control-Allow-Headers' 'Origin, Content-Type, Accept, Authorization';
    
            # Handle preflight requests
            if ($request_method = OPTIONS) {
                add_header 'Access-Control-Allow-Origin' '*';
                add_header 'Access-Control-Allow-Methods' 'GET, POST, OPTIONS, DELETE, PUT';
                add_header 'Access-Control-Allow-Headers' 'Origin, Content-Type, Accept, Authorization';
                add_header 'Access-Control-Max-Age' 1728000;
                add_header 'Content-Type' 'text/plain charset=UTF-8';
                add_header 'Content-Length' 0;
                return 204;
            }
        }
    }
    
  4. Restart Docker containers:
    After making these changes, restart your Docker containers to apply the new configurations:

    docker-compose down
    docker-compose up -d
    

By ensuring these configurations are correctly set, you should be able to resolve the CORS error [1][2].

To continue talking to Dosu, mention @dosu.

@dosubot[bot] commented on GitHub (Aug 6, 2024): <!-- Greeting --> Hey @ruzzzz6312! I'm here to help you with any bugs, questions, or contributions you have for the Dify repository. Let's tackle this CORS issue together while we wait for the human maintainer. <!-- Answer --> To resolve the CORS issue on your fresh install of Dify version 0.6.16, which is self-hosted using Docker, you need to update the CORS configuration in your `docker-compose.yml` file. Here are the steps: 1. **Update the `.env` file**: Ensure that all URLs are correctly set to your specific domain names: ```env CONSOLE_API_URL=https://api.console.dify.xxx.com/ CONSOLE_WEB_URL=https://console.dify.xxx.com/ SERVICE_API_URL=https://api.dify.xxx.com/ APP_API_URL=https://api.app.dify.xxx.com/ APP_WEB_URL=https://app.dify.xxx.com/ ``` 2. **Update the `docker-compose.yml` file**: Make sure the environment variables in the `docker-compose.yml` file are also set to allow CORS from all origins: ```yaml environment: CONSOLE_CORS_ALLOW_ORIGINS: "*" WEB_API_CORS_ALLOW_ORIGINS: "*" ``` 3. **Set CORS headers in Nginx**: If you are using Nginx as a reverse proxy, ensure that the CORS headers are correctly set in your `nginx.conf`: ```nginx server { listen 80; server_name your_domain.com; location / { proxy_pass http://api:5001; 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 add_header 'Access-Control-Allow-Origin' '*'; add_header 'Access-Control-Allow-Methods' 'GET, POST, OPTIONS, DELETE, PUT'; add_header 'Access-Control-Allow-Headers' 'Origin, Content-Type, Accept, Authorization'; # Handle preflight requests if ($request_method = OPTIONS) { add_header 'Access-Control-Allow-Origin' '*'; add_header 'Access-Control-Allow-Methods' 'GET, POST, OPTIONS, DELETE, PUT'; add_header 'Access-Control-Allow-Headers' 'Origin, Content-Type, Accept, Authorization'; add_header 'Access-Control-Max-Age' 1728000; add_header 'Content-Type' 'text/plain charset=UTF-8'; add_header 'Content-Length' 0; return 204; } } } ``` 4. **Restart Docker containers**: After making these changes, restart your Docker containers to apply the new configurations: ```sh docker-compose down docker-compose up -d ``` By ensuring these configurations are correctly set, you should be able to resolve the CORS error <sup>[[1]](https://github.com/langgenius/dify-docs/blob/main/en/getting-started/install-self-hosted/install-faq.md)</sup><sup>[[2]](https://github.com/langgenius/dify/blob/main/docker/docker-compose.yaml)</sup>. <!-- Dosu Comment Footer --> *To continue talking to [Dosu](https://dosu.dev), mention @dosu.*
Author
Owner

@ruzzzz6312 commented on GitHub (Aug 6, 2024):

OMG, fixed.
Very hard to figure out how to deploy HTTPS.
It took some time.

Key is in .ENV:
CERTBOT_DOMAIN to include all
NGINX_HTTPS_ENABLED=true
NGINX_ENABLE_CERTBOT_CHALLENGE=true

PLease update instructions for future users

@ruzzzz6312 commented on GitHub (Aug 6, 2024): OMG, fixed. Very hard to figure out how to deploy HTTPS. It took some time. Key is in .ENV: CERTBOT_DOMAIN to include all NGINX_HTTPS_ENABLED=true NGINX_ENABLE_CERTBOT_CHALLENGE=true PLease update instructions for future users
Author
Owner

@taowang1993 commented on GitHub (Aug 21, 2024):

I also struggled with these url configs. In the end, I configured only one which is the APP_WEB_URL.

I am not really sure why we need to configure so many urls....

Are you using all of them?

OMG, fixed. Very hard to figure out how to deploy HTTPS. It took some time.

Key is in .ENV: CERTBOT_DOMAIN to include all NGINX_HTTPS_ENABLED=true NGINX_ENABLE_CERTBOT_CHALLENGE=true

PLease update instructions for future users

@taowang1993 commented on GitHub (Aug 21, 2024): I also struggled with these url configs. In the end, I configured only one which is the APP_WEB_URL. I am not really sure why we need to configure so many urls.... Are you using all of them? > OMG, fixed. Very hard to figure out how to deploy HTTPS. It took some time. > > Key is in .ENV: CERTBOT_DOMAIN to include all NGINX_HTTPS_ENABLED=true NGINX_ENABLE_CERTBOT_CHALLENGE=true > > PLease update instructions for future users
Sign in to join this conversation.
1 Participants
Notifications
Due Date
No due date set.
Dependencies

No dependencies set.

Reference: langgenius/dify#4923