title: CDN Cname Cross domain issue in jwplayer caption
body: <p>I am using Jwplayer 6.8 and having my jwplayer setup in some server www.example.com.I am loading subtitles in vtt format from CDN d2cdnserver.cloudfront.com( cname - example.amazon.com, <strong><code>I am loading my subtitle using cname</code></strong> ) , It is throwing cross domain error.</p>
  
  <p><strong>Source Link :</strong>  <a href="http://www.longtailvideo.com/support/jw-player/28844/crossdomain-file-loading/" rel="nofollow noreferrer">Jwplayer crossdomain Issue</a> </p>
  
  <p>I have to added response header in server end, in <code>httpd.conf</code>, <code>php.ini</code> and <code>htaccess</code> file but it does not seems to work. 
  I was accessing my files through cname example.amazon.com, <strong><em>When I change this cname to my amazon S3 url ("<a href="https://s3.amazonaws.com/www.abcdef.com/files/myfiles" rel="nofollow noreferrer">https://s3.amazonaws.com/www.abcdef.com/files/myfiles</a>"), it works and cross domain issue is not coming even without setting the access-control-allow-origin in cdn</em></strong> but if I use <em>cloudfront cname then it always shows crossdomain error and file is not loaded.</em></p>
  
  <p>How to resolve this problem in <code>CDN and CNAME</code>? Is there some way to <code>allow access-control-allow-origin</code> for cname?</p>
  
  <p>BTW, I have tried <code>allow access-control-allow-origin</code> for <code>CDN</code> . It didn`t help for cloudfront cname.</p>
  
  <blockquote>
    <p><strong>My AWS CORS Configuration</strong></p>
  </blockquote>
  
  <p><em>At First, Both <code>https://s3.amazonaws.com/www.abcdef.com/files/myfiles</code> and cname <code>example.amazon.com</code> throws cross domain error</em> </p>
  
  <blockquote>
    <p><strong>But when I tried default configuration below</strong></p>
  </blockquote>
  
  <pre><code>&lt;CORSConfiguration&gt;
      &lt;CORSRule&gt;
          &lt;AllowedOrigin&gt;*&lt;/AllowedOrigin&gt;
          &lt;AllowedMethod&gt;GET&lt;/AllowedMethod&gt;
          &lt;MaxAgeSeconds&gt;3000&lt;/MaxAgeSeconds&gt;
          &lt;AllowedHeader&gt;Authorization&lt;/AllowedHeader&gt;
      &lt;/CORSRule&gt;
  &lt;/CORSConfiguration&gt;
  </code></pre>
  
  <blockquote>
    <p><strong>AWS url <code>https://s3.amazonaws.com/www.abcdef.com/files/myfiles</code> works
    and only cname <code>example.amazon.com</code> throws cross domain error</strong></p>
  </blockquote>
  
  <p><em>I also tried below configuration and it still results in same error, cname is still throwing the cross domain error</em></p>
  
  <pre><code>&lt;CORSConfiguration&gt;  
         &lt;CORSRule&gt;    
             &lt;AllowedOrigin&gt;http://*.example.com&lt;/AllowedOrigin&gt;
  
         &lt;AllowedMethod&gt;PUT&lt;/AllowedMethod&gt;    
         &lt;AllowedMethod&gt;POST&lt;/AllowedMethod&gt;    
         &lt;AllowedMethod&gt;DELETE&lt;/AllowedMethod&gt;
  
         &lt;AllowedHeader&gt;*&lt;/AllowedHeader&gt;  
         &lt;/CORSRule&gt;  
  
         &lt;CORSRule&gt;
           &lt;AllowedOrigin&gt;*&lt;/AllowedOrigin&gt;    
           &lt;AllowedMethod&gt;GET&lt;/AllowedMethod&gt; 
         &lt;/CORSRule&gt; 
  &lt;/CORSConfiguration&gt;
  </code></pre>
  
  <p><em>Am I doing something wrong ? What is the correct way to do this configuration to avoid the cross domain issue ?</em> </p>
  
  <hr>
  
  <blockquote>
    <p><strong>MY JWPLAYER SETUP</strong></p>
  </blockquote>
  
  <h2><strong>This is working</strong></h2>
  
  <pre><code> function videoSetUp(id, skinName){
               jwplayer('player'+id).setup({
               file: 'http://example.amazon.com/files/test.mp4',
               image: 'https://www.longtailvideo.com/content/images/jw-player/lWMJeVvV-876.jpg',
               stretching : 'exactfit',
               aspectratio: '4:3',
               fallback: 'false',
               height:270,
               width:480,
               primary: 'HTML5',
               tracks: [
                  { file: "https://s3.amazonaws.com/www.abcdef.com/files/jwplayer_test_eng.vtt", label: "Eng", kind: "subtitles" },
                  { file: "https://s3.amazonaws.com/www.abcdef.com/files/jwplayer_test_hak.vtt", label: "China", kind: "subtitles" },
                  { file: "https://s3.amazonaws.com/www.abcdef.com/files/jwplayer_test_tam.vtt", label: "Tamil", kind: "subtitles" },
                  { file: "https://s3.amazonaws.com/www.abcdef.com/files/jwplayer_test_eng.vtt", label: "Hindi", kind: "subtitles" }
              ],
               skin :'./skins/'+skinName+'.xml'
               });
  </code></pre>
  
  <h2>   <strong>This is not working</strong></h2>
  
  <pre><code> function videoSetUp(id, skinName){
               jwplayer('player'+id).setup({
               file: 'http://example.amazon.com/files/test.mp4',
               image: 'https://www.longtailvideo.com/content/images/jw-player/lWMJeVvV-876.jpg',
               stretching : 'exactfit',
               aspectratio: '4:3',
               fallback: 'false',
               height:270,
               width:480,
               primary: 'HTML5',
               tracks: [
                  { file: "http://example.amazon.com/files/jwplayer_test_eng.vtt", label: "Eng", kind: "subtitles" },
                  { file: "http://example.amazon.com/files/jwplayer_test_hak.vtt", label: "China", kind: "subtitles" },
                  { file: "http://example.amazon.com/files/jwplayer_test_tam.vtt", label: "Tamil", kind: "subtitles" },
                  { file: "http://example.amazon.com/files/jwplayer_test_eng.vtt", label: "Hindi", kind: "subtitles" }
              ],
               skin :'./skins/'+skinName+'.xml'
               });
  </code></pre>
  
  <h2> <strong>Helpful Links :</strong></h2>
  
  <p><a href="http://en.wikipedia.org/wiki/Cross-origin_resource_sharing" rel="nofollow noreferrer">Cross-origin_resource_sharing</a></p>
  
  <p><a href="https://stackoverflow.com/questions/5008944/how-to-add-an-access-control-allow-origin-header">how-to-add-an-access-control-allow-origin-header</a></p>
  
  <p><a href="https://stackoverflow.com/questions/1653308/access-control-allow-origin-multiple-origin-domains">access-control-allow-origin-multiple-origin-domains</a></p>
  
  <p><a href="http://html5hacks.com/blog/2012/11/18/configure-amazon-s3-for-cross-origin-resourse-sharing-to-host-a-web-font/" rel="nofollow noreferrer">configure-amazon-s3-for-cross-origin-resourse-sharing-to-host-a-web-font</a></p>
  
  <p><a href="http://aws.amazon.com/about-aws/whats-new/2012/08/31/amazon-s3-announces-cross-origin-resource-sharing-CORS-support/" rel="nofollow noreferrer">amazon-s3-announces-cross-origin-resource-sharing-CORS-support</a></p>
  
  <p><a href="https://docs.aws.amazon.com/AmazonS3/latest/dev/cors.html#how-do-i-enable-cors" rel="nofollow noreferrer">how-do-i-enable-cors-in-cdn</a></p>
  
  <p><a href="https://stackoverflow.com/a/12330829/1877909">Amazon S3 CORS (Cross-Origin Resource Sharing)</a></p>
  
  <h2> <strong>Thanks for Help</strong></h2>