‘Origin is not allowed by Access-Control-Allow-Origin’ since 2021

For a school project, my mate and I are using a webpage using Microsoft Azure Video Indexer’s API, since last week everything was working well but now I have this error every time.. I thought it was because of the new year because it stopped working the 1st of January. What is strange it’s that the same snippet of code that worked don’t work anymore. For example the sample proposed on the API’s website for getting a token doesn’t

<!DOCTYPE html>
<html>
<head>
    <title>JSSample</title>
    <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.9.0/jquery.min.js"></script>
</head>
<body>

<script type="text/javascript">
    $(function() {
        var params = {
            // Request parameters
            "allowEdit": "False",
        };
      
        $.ajax({
            url: "https://api.videoindexer.ai/Auth/trial/Accounts/198UE0192/AccessToken?" + $.param(params),
            beforeSend: function(xhrObj){
                // Request headers
                xhrObj.setRequestHeader("x-ms-client-request-id","");
                xhrObj.setRequestHeader("Ocp-Apim-Subscription-Key","108D193J");
            },
            type: "GET",
            // Request body
            data: "{body}",
        })
        .done(function(data) {
            alert("success");
        })
        .fail(function() {
            alert("error");
        });
    });
</script>
</body>
</html

Answer

We have fixed the issue. you will get “access-control-allow-origin: *” header at the API responses.

your API key (Ocp-Apim-Subscription-Key) is private information, and you should not expose it at the client side.

you should generate access token from your web server using that key and use (send it at Authorization header) it with all your operations request.

please delete it from the example above as well.