title: Prevent hotlinking of Amazon S3 files?
body: <p>I'd like to allow anyone to play a video located in my s3 on my site as the <code>src</code> on a <code>&lt;video&gt;</code> tag but <strong>not</strong> allow people to use it as a <code>src</code> on their site <strong>or</strong> to play the video directly by typing the url into the browser bar.</p>
  
  <p>I <strong>don't</strong> want people doing this:</p>
  
  <p><img src="https://i.stack.imgur.com/43PuO.png" alt="enter image description here"></p>
  
  <p>and I don't want the following HTML to appear on http://<strong>your</strong>-site.com but only on http://<strong>my</strong>-site.com:</p>
  
  <pre><code>&lt;html&gt;
      &lt;video src="https://s3.amazonaws.com/my-bucket/my-video.mp4"&gt;&lt;/video&gt;
  &lt;/html&gt;
  </code></pre>
  
  <p>I've seen some <a href="https://stackoverflow.com/questions/948823/how-do-i-prevent-hotlinking-on-amazon-s3-without-using-signed-urls">SO links</a> on this but I wanted to talk in code since I haven't been able to make these solutions work for me.</p>
  
  <p>Here's my bucket policy that is currently <strong>NOT</strong> working:</p>
  
  <pre><code>{
  "Version": "2008-10-17",
  "Statement": [
      {
          "Sid": "AllowPublicRead",
          "Effect": "Allow",
          "Principal": {
              "AWS": "*"
          },
          "Action": "s3:GetObject",
          "Resource": "arn:aws:s3:::my-bucket/*",
          "Condition": {
              "StringLike": {
                  "aws:Referer": [
                      "https://my-site.com/*"
                  ]
              }
          }
      }
    }
  </code></pre>
  
  <p>Two questions:</p>
  
  <ol>
  <li>To test my bucket policy, I put the above HTML in a test file on my localhost and sure enough I can access the video by typing <code>http://localhost/test.html</code>. Why isn't my bucket policy preventing this? (I'd only want it to work from <code>http://my-site.com/test.html</code>)</li>
  <li>To prevent people from inputing the s3 URL into the browser bar, I was thinking I need a separate solution from the bucket policy since it's not clear to me from the AWS documentation how to prevent direct access via the browser. I was thinking of hashing the url to make it hard to guess. Perhaps there are ways using the AWS bucket policy or other solutions though?</li>
  </ol>
  
  <p>To be more clear, my files are stored on s3 but they are delivered by Amazon's CloudFront. So my CloudFront url src is currently media.my-site.com/my-video.mp4. The CNAME being media.my-site.com.</p>