htaccess multiple headers returning CORS mismatch

I've followed https://developer.mozilla.org/en-US/docs/Learn/Server-side/Apache_Configuration_htaccess#cross-origin_images and these stackoverflow answers Access-Control-Allow-Origin Multiple Origin Domains?

To try and get this to work nicely. But it's throwing a mismatch on some origins and some, it works as expected.

htaccess update

<IfModule mod_rewrite.c>
<IfModule mod_setenvif.c>
    <IfModule mod_headers.c>
      # Allowing fonts for specific origins on mtn domains and local testing
      <FilesMatch "\.(ttf|otf|eot|woff|woff2)$">
        SetEnvIf Origin "^http(s)?://(.+\.)?(fiddle\.jshell\.net|lab4\.onlinecms\.mtn\.co\.za|mtndecoupled\.lndo\.site:444|localhost:4200)$" AccessControlAllowOrigin=$0
        Header add Access-Control-Allow-Origin %{AccessControlAllowOrigin}e env=AccessControlAllowOrigin
        Header set Access-Control-Allow-Credentials true
      </FilesMatch>
    </IfModule>
  </IfModule>
</IfModule>

Screenshots of CORS error:

mtndecoupled.lndo.site:444 https://share.getcloudapp.com/geuA8QxY
lab4.onlinecms.mtn.co.za https://share.getcloudapp.com/Wnu0z94G
localhost:4200 https://share.getcloudapp.com/P8uGvzgx
jsfiddle https://jsfiddle.net/ft92z8c3/1

Edit

Error message in browser console:

CORS header 'Access-Control-Allow-Origin' does not match 'mtndecoupled.lndo.site:444'

Not sure if it's the module check or the set env regex. I'm hoping someone can give more information for this and how I can resolve it.

Appreciate any feedback.

Solution

Ok managed to fix this. Hope this might help someone else having this issue.

We are using Varnish cache and realised it was caching the first domain hit. So we updated the htaccess as:

<IfModule mod_rewrite.c>
<IfModule mod_setenvif.c>
    <IfModule mod_headers.c>
      # Disable caching
      Header set Cache-Control "no-cache, no-store, must-revalidate"
      Header set Pragma "no-cache"
      Header set Expires 0
      # Allowing fonts for specific origins on mtn domains and local testing
      <FilesMatch "\.(ttf|otf|eot|woff|woff2)$">
        <IfModule mod_expires.c>
            ExpiresActive Off
        </IfModule>
        <IfModule mod_headers.c>
              FileETag None
              Header unset ETag
              Header unset Pragma
              Header unset Cache-Control
              Header unset Last-Modified
              Header set Pragma "no-cache"
              Header set Cache-Control "max-age=0, no-cache, no-store, must-revalidate"
              Header set Expires "Thu, 1 Jan 1970 00:00:00 GMT"
        SetEnvIf Origin "^http(s)?://(.+\.)?(fiddle\.jshell\.net|lab4\.onlinecms\.mtn\.co\.za|mtndecoupled\.lndo\.site:444|localhost:4200)$" AccessControlAllowOrigin=$0
        Header add Access-Control-Allow-Origin %{AccessControlAllowOrigin}e env=AccessControlAllowOrigin
        Header set Access-Control-Allow-Credentials true
        </IfModule>
      </FilesMatch>
    </IfModule>
  </IfModule>
</IfModule>