Uncaught DOMException: Blocked a frame with origin "https://music.domain.com" from accessing a cross-origin frame

I have Libretime accessible on two domain names via a reverse proxy.

One is libretime.domain1.org and that’s the actual host. The other is music.domain2.org. The site works perfectly fine via libretime.domain1.org.

When I access the site via music.domain2.org then I get the mentioned cross-origin error. I did define both domains including the https:// in the “Allowed CORS URLs” field under the settings.

  • In Firefox I just see the logo on the top right and the background image.

  • In Chrome I also see the calendar and the bar at the bottom to play the current song. But the two icons on the lower left to switch from calendar to Station Name are missing. Same in the new Edge browser.

It’s not really important, but I wonder if there’s a setting I can adjust to get that working too.

Please, check the install documentation https://libretime.org/install, search for " Cross-Origin Resource Sharing (CORS)" in there. Hope that helps

Thanks for the reply.

As I have explained in my initial post, I did include both domains in the settings under “Allowed CORS URLs”. I also included the necessary parts in the nginx reverse proxy.

server {
    server_name music.domain2.org;

    location / {
        proxy_pass https://192.168.7.66;
        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_header Access-Control-Allow-Origin "*" always;
        add_header Access-Control-Allow-Methods "GET, POST, PATCH, OPTIONS, DOCUMENT" always;
        add_header Access-Control-Allow-Headers "Content-Type" always;
        add_header Strict-Transport-Security "max-age=31536000" always;
        add_header X-Frame-Options allow;
        client_max_body_size 512M;
        proxy_next_upstream error timeout invalid_header http_500 http_502 http_503 http_504;
        proxy_redirect off; proxy_buffering off;

    }

    listen 443 ssl; # managed by Certbot
    ssl_certificate /etc/letsencrypt/live/music.domain2.org/fullchain.pem; # managed by Certbot
    ssl_certificate_key /etc/letsencrypt/live/music.domain2.org/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

Both virtual hosts have the identical settings, apart from the domain name.

The funny thing is that the site works in general, only the two icons on the lower right are missing. And I realized today, that the behavior in Firefox and Chrome is the same. The difference was because of privacy badger blocking some content.

This is the error/warning messages in Firefox.

23:13:28.058 This page uses the non standard property “zoom”. Consider using calc() in the relevant property values, or using “transform” along with “transform-origin: 0 0”. music.domain2.org
23:13:28.768 Synchronous XMLHttpRequest on the main thread is deprecated because of its detrimental effects to the end user’s experience. For more help http://xhr.spec.whatwg.org/ mrp.js:1910:25
23:13:28.843 Uncaught DOMException: Permission denied to access property "document" on cross-origin object jquery-1.8.3.min.js:2
    jQuery 3
    <anonymous> https://music.domain2.org/:79
    jQuery 9
    <anonymous> https://music.domain2.org/:77
    jQuery 11
23:13:28.855 Layout was forced before the page was fully loaded. If stylesheets are not yet loaded this may cause a flash of unstyled content. jquery-1.6.1.min.js:16:18262
23:13:28.906 Uncaught DOMException: Permission denied to access property "document" on cross-origin object music.domain2.org:32
    autoResize https://music.domain2.org/:32
    onload https://music.domain2.org/:1
23:13:28.989 Source map error: Error: request failed with status 404
Resource URL: https://libretime.domain1.org/js/libs/angular.min.js?16bff4ff9
Source Map URL: angular.min.js.map

This is how it should look like and does on https://libretime.domain1.org:

And this is how it looks on the other domain. The calendar in the middle is shown with a scroll-bar, and the two icons at the bottom right are missing: