mal1kov
@mal1kov
Притворись дураком 5 минут, чем быть им всю жизнь.

Почему не воспроизводится аудио с WaveSurfer.js сайте на Django (MediaElementAudioSource outputs zeroes due to CORS access restrictions...)?

Почему-то не воспроизводится аудиофайл на сайте на production сервере.
Файлы находятся на хранилище Selectel и загружаются с CDN от Selectel.
При загрузке страницы в консоли появляется ошибка MediaElementAudioSource outputs zeroes due to CORS access restrictions for https://cdn.x.fullfocus.uz/media/audio/2021/12/20/...

На NGINX и настройках CDN и хранилища заголовки Access-Control-Allow-Origin = *

Настройки NGINX

server {
        server_name xabardor.uz;
        client_max_body_size 500M;
        access_log /var/log/nginx/xabardor.log;

        root /var/www/html;

        index index.html index.html index.nginx-debian.html;

        location ~* \.(eot|ttf|woff|woff2|mp3|wav|ogg|wob)$ {
                add_header Access-Control-Allow-Origin *;
        }

        location / {
                proxy_pass http://127.0.0.1:8001;
                proxy_set_header X-Forwarded-Host $server_name;
                proxy_set_header X-Real-IP $remote_addr;
                proxy_set_header Host $http_host;
                add_header P3P 'CP="ALL DSP COR PSAa PSDa OUR NOR ONL UNI COM NAV"';
                add_header 'Accept-Encoding' 'gzip, deflate';
                add_header 'Access-Control-Allow-Origin' '*';
                add_header 'Access-Control-Allow-Credentials' 'true';
                add_header 'Access-Control-Allow-Methods' '*';
                add_header 'Access-Control-Allow-Headers' 'DNT,User-Agent,X-CustomHeader,Keep-Alive,X-Requested-With,If-Modified-Since,Cache-Control,Content-Type,Range';
        }

        location = /favicon.ico {
                root /home/www/xabardoruz-django/xabardor/news/static/news/images/favicon.png;
        }

        location /static/ {
                root /home/www/xabardoruz-django/xabardor/static_files;
        }



    listen 443 ssl; # managed by Certbot
    ssl_certificate /etc/letsencrypt/live/xabardor.uz/fullchain.pem; # managed by Certbot
    ssl_certificate_key /etc/letsencrypt/live/xabardor.uz/privkey.pem; # managed by Certbot
    include /etc/letsencrypt/options-ssl-nginx.conf; # managed by Certbot
    ssl_dhparam /etc/letsencrypt/ssl-dhparams.pem; # managed by Certbot

}


Скриншот настроек CDN
Скриншот настроек хранилища
Скриншот настроек Network браузера

Кто-то сталкивался с подобной проблемой, в чём может быть пролема?
Без WaveSurfer.js с обычным audio тегом всё прекрасно работает.
  • Вопрос задан
  • 205 просмотров
Решения вопроса 1
karabanov
@karabanov
Системный администратор
Попробуй добавить crossOrigin = "anonymous"
Ответ написан
Комментировать
Пригласить эксперта
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Похожие вопросы