HTML crossorigin Attribute

Last Updated : 30 Sep, 2021

CORS stands for cross-origin resource sharing. It is a mechanism by which one webpage requests to another domain for fetching out the resource like audio, video, script, etc from the third party server without leaking their credentials information. If specified, the request will be sent with or without credentials.

The crossorigin attribute is used to define whether to support CORS requests. When fetching out the resources from another domain or from third-party servers. It includes resources like audio. video, images. link and script. It is used to handle the CORS request that checks whether it is safe to allow for sharing the resources from other domains.

Usage : It is used in many elements such as <audio> , <video>, <link>, <img> and <script>.

Syntax:

<script crossorigin="anonymous|use-credentials">

Attribute Values:

anonymous: It has a default value. It defines a CORS request which will be sent without passing the credential information.
use-credentials: A cross-origin request will be sent with credentials, cookies, and certificate.

Example: Below code illustrates the use of crossorigin attribute in <audio> element.

HTML

<!DOCTYPE html> 
<html> 
  
<head> 
    <title> 
        HTML crossorigin Attribute 
    </title> 
</head> 
  
<body> 
    <center> 
    <h1>GeeksforGeeks</h1> 
  
    <h2>HTML crossorigin Attribute</h2> 
  
          
<p>Audio Sample</p> 
  
  
    <!-- Use of crossorigin attribute in audio element -->
    <audio  crossorigin="anonymous" controls> 
        <source src="test.mp3" type="audio/mp3"> 
        <source src="test.ogg" type="audio/ogg"> 
    </audio> 
    <!-- audio tag ends here -->
</body> 
  
</html> 