MySpace Hotlinking

My idea of a typical MySpace user.

If you had told me a year ago that I would be an active member of MySpace I would have laughed. From what I had seen of the social network back then, I had decided that it was simply a meeting place for people like “Kenny” from Can’t Hardly Wait. On top of that, most MySpace profiles I had seen at the time violated every principle of good design and web standards that I hold dear. Some much worse than others.

These dissenting opinions kept me away for a while, but I finally caved to the peer pressure of a few close friends and set up an account. After a few months of being discovered by and finding old friends I started to realize the value of this system. Despite all the negative hype from the web design community, MySpace really is an effective tool for staying in touch with people. Of course, there is still the problem of bad design. The default profile layout for MySpace accounts is bearably plain design-wise, but it begs to be customized. The problem is that the profile HTML was never meant to be custom as there is no tool to change the display of a profile within the settings interface. All profile design changes are basically hacks that are achieved by by injecting quasi-CSS and extra HTML into a textbox that is meant to contain info about yourself. Out of this tiny loophole of potential has come a wellspring of custom layout sites and tutorials. Most of which are horrible… Why? Mainly because the HTML consists of nested tables with very few IDs or classes to grab hold of and style.

I tried for a while to create a custom MySpace profile that represented me as a designer but walked away frustrated every time. After reading Mike Davidson’s informative tutorial back in April my hope was renewed and I created a profile that I was somewhat proud of. A few months later, I took it down. Why? Because my design got posted to “free layout” site without my permission. I only realized this after noticing hundreds of requests for the images used in the design in my server log files. To stop the hotlinking, I swapped in images like this:

Rainbow Pony Explorers say STOP HOTLINKING MY IMAGES!

and this…until people finally stopped linking to my files:

I POO ON YOUR PROFILE!

While that was fun, my problem wasn’t really that people were using my design, but that they were eating my bandwidth, and at a viral rate. I wanted to have a custom MySpace, but didn’t want my webhosting account to be the repository for world’s profile background images. For a while I looked into .htaccess as a possible solution, but didn’t have much luck. I could block hotlinking altogether from myspace.com, but I couldn’t figure out a way to allow my own profile to hotlink.

The Solution: Serve Images with PHP

While working on a client project for work, I rediscovered The Random Image Rotator PHP script from Automatic Labs. On its own, the script is actually very handy. By placing it in a folder of images and visiting the page in a browser, it will automatically display a random image from that directory. You can use the URL of the php file as the src for an img tag, or even as the url for a background-image in css. If there is only one image in the directory, it will always show that one image. At some point, I got the idea that I could use a similar script to serve my MySpace profile images. I’m not a PHP guru, but I know that PHP can return the referring URL of a page…and if I could get that, I could determine whether or not to show my image. After a few hours of trying to roll my own PHP image serving script, I realized that the Automatic Labs script had everything I needed but the referrer checking. To check the value of the referrer variable, I simply set it to display an image on my profile and added the following code to the top of the script to create a simple log file:

$ref = strtolower($_SERVER['HTTP_REFERER']);
if (file_exists('log.txt')) {
$date = date('m/d/Y');
$time = date('g:i a');
$content = $date.','.$time.','.$ref."n";

$file = "log.txt";
$fp = fopen ("$file", "ab");

fwrite($fp, $content);
fclose($fp);
}

Then…I waited, letting the log file build up so that I could see what URLs I wanted to allow thorough. After some time, I noticed that all the URLs in the file were in one of the following formats:

http://myspace.com/jasongraphix
http://profile.myspace.com/jasongraphix
http://profile.myspace.com/index.cfm?fuseaction=user.viewprofile&friendid=40898145

There were some longer ones like the last one that had some other query string values, but every referring url from my MySpace profile contained either “myspace.com/username” or “friendid=idnumber”. Taking this knowledge back to my php file, I added the following code after the logging if statement:

$friendid = '40898145';
$username = 'jasongraphix';
$check_id = strpos($ref, 'friendid='.$friendid);
$check_name = strpos($ref, 'myspace.com/'.$username);
if ($check_id === false && $check_name === false) {
exit;
}

Basically, what this does is check to see if the referring URL ($ref) contains either “friendid=4089145” (my MySpace friend ID) or “myspace.com/jasongraphix” (my permanent url/username). If it doesn’t have either of those, it exits the script and the image is not served. Theoretically, I could use that if block to define a fun alternative image to show, but why waste the bandwidth? This probably isn’t the most elegant solution to the profile-image hosting problem, but it works for me.

7 Comments

  1. I had the same problem.

    I just try to make the images more personal rather than generic.

  2. i was wondering, as you had much help listed here, if you knew anything about rotators that might help me. im wanting to do a rotating “special friend” with a link to their profile and an “add to friends” link. im starting to understand the whole image rotation principle now- but how do you make a random image and links set to appear? is this do-able or should i quit now before im eyeball deep in redundancy? my profile is http://www.myspace.com/pit_slaves and the area i want to have the rotating friend info in is the “artist friend” div. i want a new friend to load into each one of the two slots everytime someone loads the page. (there are only 18 total people so far in rotation) keep in mind i have the constraint of having to place the script inside the div info for that particular div box to retain the alignment of the other divs (i think). any ideas?

  3. I didn’t try this out, but perhaps a script like this would work:
    Cut and Paste Random Content Script

  4. PLEASE HELP ME! I’ve been using PHP for most of the content of my myspace profile, and I use it for almost every image to make sure everything is dymanic. I use PHP to display my recent blogs and my top friends in a way I haven’t seen done by anybody else before. I’d explain to you just exactly what everything does but I’d like to get to the point.

    Myspace apparently doesn’t like image references with the PHP file extension, so if it sees them it starts filtering them out, replacing the IMG tag with “..”

    For a long time I’ve been able to “fool” the filter into thinking it was a ‘valid image source’ but while making some updates to the profile tonight I noticed that each time i clicked “Save All Changes” on my profile edit page, it started to filter out the PHP images again, one by one (not all at once).

    I’ve currently had to disable my recent blog listing because it’s deteriorating, as well as my default profile image. It won’t be long before everything is eaten up by this darn filter! I’ve worked much too hard for everything to go away like this! Please if you know any secrets for getting the PHP image references to stay put, I would be so very grateful! Contact me via email or through myspace, and please do so ASAP… I don’t know what to do! I’m afraid that all of my hard work will go down the drain…

  5. I’ve never posted a link to an image with a .php extension on my MySpace and didn’t know they were blocking the .php extension. What I do is name each php file “index.php” and place it in it’s own folder. That way, my image src looks something like http://www.domain.com/folder/ and the server will automatically pull the index.php file.
    Hope that helps!

  6. I got the index.php to work. But I’m the only one that sees the images. What do I change or add to the code to let others see the images, but not save them.

    Thanks!

  7. Thanks for helping me with my myspace! You rock!!!

Leave a Comment

Latest Tweet
Somewhat Recent
The Whole Nine Yards