I am trying to implement image hotlink protection problem in nginx and I need help. I have a huge issue of my site's images being submitted to social networks like StumbleUpon with a direct link like

http://example.com/xxxxx.jpg

Which sometimes gets huge traffic and increases CPU usage and bandwidth usage. I want to block direct access to my images from other referrers and protect them from being hotlinked.

Here is the code from my vhost.conf

 server {
  access_log off;

  error_log  logs/vhost-error_log warn;
  listen    80;
  server_name  mydomain.com www.mydomain.com;

  # uncomment location below to make nginx serve static files instead of Apache
  # NOTE this will cause issues with bandwidth accounting as files wont be logged
  location ~* \.(gif|jpg|jpeg|png|wmv|avi|mpg|mpeg|mp4|htm|html|js|css)$ {
   root   /home/username/public_html;
   expires 1d;
  }

   root   /home/mydomain/public_html;
}


  location / {
   client_max_body_size    10m;
   client_body_buffer_size 128k;

   proxy_send_timeout   90;
   proxy_read_timeout   90;

   proxy_buffer_size    4k;
   # you can increase proxy_buffers here to suppress "an upstream response
   #  is buffered to a temporary file" warning
   proxy_buffers     16 32k;
   proxy_busy_buffers_size 64k;
   proxy_temp_file_write_size 64k;

   proxy_connect_timeout 30s;

   proxy_redirect  http://www.mydomain.com:81   http://www.mydomain.com;
   proxy_redirect  http://mydomain.com:81   http://mydomain.com;

   proxy_pass   http://ip_address/;

   proxy_set_header   Host   $host;
   proxy_set_header   X-Real-IP  $remote_addr;
   proxy_set_header   X-Forwarded-For $proxy_add_x_forwarded_for;

   expires       24h;

  }
  }

For hotlink protection I added this code

location ~* (\.jpg|\.png|\.gif|\.jpeg)$ {
     valid_referers blocked www.mydomain.com mydomain.com;
     if ($invalid_referer) {
        return 403;
     }

This is the current nginx code for this domain, but it didn't work:

 server {
  access_log off;

  error_log  logs/vhost-error_log warn;
  listen    80;
  server_name  mydomain.com www.mydomain.com;

  # uncomment location below to make nginx serve static files instead of Apache
  # NOTE this will cause issues with bandwidth accounting as files wont be logged
  location ~* \.(gif|jpg|jpeg|png|wmv|avi|mpg|mpeg|mp4|htm|html|js|css)$ {
   root   /home/username/public_html;
   expires 1d;
  }

   root   /home/mydomain/public_html;
}
  location ~* (\.jpg|\.png|\.gif|\.jpeg)$ {
     valid_referers blocked www.mydomain.com mydomain.com;
     if ($invalid_referer) {
        return 403;
     }


  location / {
   client_max_body_size    10m;
   client_body_buffer_size 128k;

   proxy_send_timeout   90;
   proxy_read_timeout   90;

   proxy_buffer_size    4k;
   # you can increase proxy_buffers here to suppress "an upstream response
   #  is buffered to a temporary file" warning
   proxy_buffers     16 32k;
   proxy_busy_buffers_size 64k;
   proxy_temp_file_write_size 64k;

   proxy_connect_timeout 30s;

   proxy_redirect  http://www.mydomain.com:81   http://www.mydomain.com;
   proxy_redirect  http://mydomain.com:81   http://mydomain.com;

   proxy_pass   http://ip_address/;

   proxy_set_header   Host   $host;
   proxy_set_header   X-Real-IP  $remote_addr;
   proxy_set_header   X-Forwarded-For $proxy_add_x_forwarded_for;

   expires       24h;

  }
  }

How can I fix this?