Cors configuration

I've created a web application that consists of a front end and an api, the front end is an app service hosted with the url https://www.pinsandgambits.com/frenchDefence.html the back end is hosted with a default azure url https://app-pag-master.azurewebsites.net/api/v1

the cors configuration

seems fine to me, the api is running https://app-pag-master.azurewebsites.net/api/v1/test/

here's the kicker, it works as expected in most browsers, however not in Duck Duck go and more importantly mobile apps like Instagram and Reddit produce a cors violation

I'm more of a full stack dev, so a bit of a novice when it comes to actually hosting a project, does anyone know what the issue could be or even better how to resolve it?

Your allowed origins have a https addresses, the ones that are blocked have http addresses.

There is also two https address that is blocked, but maybe those url's are not marked as allowed.