数字海洋 NGINX 和 gunicorn 上的 CORS 标头访问控制缺少 django

Question

控制台响应：-

跨域请求被阻止：同源策略不允许读取位于https://blissedmaths.sgp1.digitaloceanspaces.com/media/topics/4276769703/4276769703.svg 的远程资源。 （原因：缺少 CORS 标头“Access-Control-Allow-Origin”）。

我有用户 django-cors-headers，这是一个 Django 应用程序，可将 CORS（跨域资源共享）标头添加到响应中。

我的setting.py文件是

   INSTALLED_APPS = [
    'django.contrib.admin',
    'django.contrib.auth',
    'django.contrib.contenttypes',
    'django.contrib.sessions',
    'django.contrib.messages',
    'django.contrib.staticfiles',

    'corsheaders',
    'students',
    'commons',

]

         CORS_ORIGIN_ALLOW_ALL = True
    CORS_ALLOW_CREDENTIALS = True
    CORS_ALLOW_METHODS = (
        'DELETE',
        'GET',
        'OPTIONS',
        'PATCH',
        'POST',
        'PUT',
    )
    CORS_ALLOW_HEADERS = (
        'accept',
        'accept-encoding',
        'authorization',
        'content-type',
        'dnt',
        'origin',
        'user-agent',
        'x-csrftoken',
        'x-requested-with',
    )

MIDDLEWARE = [
    'django.middleware.security.SecurityMiddleware',
    'django.contrib.sessions.middleware.SessionMiddleware',
    'django.middleware.common.CommonMiddleware',
    'django.middleware.csrf.CsrfViewMiddleware',
    'django.contrib.auth.middleware.AuthenticationMiddleware',
    'django.contrib.messages.middleware.MessageMiddleware',

    'corsheaders.middleware.CorsMiddleware',
    'django.middleware.common.CommonMiddleware',
]

来自数字海洋空间给我错误的图像是

   <script>
                function fetchXML(url, callback) {
                var xhr = new XMLHttpRequest();
                xhr.open('GET', url, true);
                xhr.withCredentials = true;
                xhr.setRequestHeader('Access-Control-Allow-Origin' , '*');
                console.log(xhr.getAllResponseHeaders)
                xhr.onreadystatechange = function (evt) {
                //Do not explicitly handle errors, those should be
                //visible via console output in the browser.
                if (xhr.readyState === 4) {
                    callback(xhr.responseXML);
                }
                };
                xhr.send(null);
                };


                    fetchXML("{{a.image.url}}",function(newSVGDoc){
                    //import it into the current DOM
                    var n = document.importNode(newSVGDoc.documentElement,true);
                    document.querySelector('.{{a.topic|slugify}}-image').appendChild(n);
                        }); 



            </script>

此页面位于https://blissedmaths.com/myclassroom/polynomial/

我已经在 setting.py 中添加了所有需要的东西，但标题仍然没有出现。我也尝试过 Jquery 和 AJAX。但是没用。

如何解决这个问题。 是否还需要一些 javascript 或仅此后端就足够了？

我也尝试通过 Nginx conf 添加标头。但是没有用。 我如何通过 python 代码或 Jquery/JS 或服务器配置文件来解决这个问题。实际上没有任何方法对我有用。但图像来自源。 请为此提供修复。

Answer 1

设置文件中有两个“django.middleware.common.CommonMiddleware”。 CorsMiddleware 应该放在尽可能高的位置，尤其是在任何可以生成响应的中间件之前，例如 Django 的 CommonMiddleware