Crossdomain File Loading Reference (Web Player)

This guide describes the cross-domain file loading (security) restrictions associated with JavaScript in HTML5 browsers/devices.

The act of disallowing domains from accessing content is a security measure that prevents users from basically leeching your files and using them elsewhere. This functionally works as a whitelist, in that all domains are inherently blocked unless specified. A basic walkthrough of the process is as follows:

  1. A JW Player hosted on DomainA wishes to access a VTT file that is hosted on DomainB.
  2. DomainB sees this request and confirms that DomainA should have access.
  3. If DomainA is allowed access, the file is served.

Each version has a distinct method of allowing/denying access across domains. Let's explore the differences.

🚧

CORS redirects from HTTP to HTTPS are not supported in Microsoft Edge.



Cross Domain in Javascript

In JavaScript, a Cross-Site Scripting mechanism exists. It impacts publishers using JWP on HTML5 capable browsers and devices, denying to load the following files from another domain:

  • RSS feeds
  • XML skins
  • VTT, SRT & DFXP files

Generally, these file loads will fail if there’s no crossdomain access. Most browsers will display an error in their debug console.


Cross-Origin Resource Sharing

Instead of hosting a crossdomain.xml file, crossdomain access is enabled per file through an additional HTTP response header (the CORS header).

Access-Control-Allow-Origin: *

πŸ“˜

The previous example sets your file wide open. Any script from any site can load the file and do whatever it wants.



Restrict Access Example

Here is another example CORS header, this time permitting the JavaScript file from only a number of domains.

Access-Control-Allow-Origin: *.domain1.com www.domain2.com

πŸ“˜

With the use of the wildcard symbol, any subdomain from domain1 can load data, whereas domain2 is restricted to only the www subdomain.


Options to limit protocols and ports can be added. See the enabled-cors.org site for more info. The site lists how to enable CORS headers for various popular webservers, frameworks and server-side languages.



Cloud-hosted players and Crossdomain restrictions

When using our cloud-hosted player and hosting external files on your own site (captions, playlists, etc.) you will need to give our CDN crossdomain access. This ensures that the external files can be properly accessed and loaded by our player.

The crossdomain.xml file on a personal domain should have the following line added to ensure this.

allow-access-from domain="*.jwpcdn.com"

Likewise, the domain's CORS headers should be adjusted to allow this access as well.

For testing, we suggest using a site like test-cors.org. Simply copy your file URL to the Remote URL box and select the blue Send Request button. An XHR status: 200 means your URL can be accessed across domains. Anything else indicates a problem with CORS.