MySpace Dev. 5: Importing RSS via Flash

Well, it’s been a while. At this point, everything else on your profile should be complete: we’ve built an entirely custom profile using the div overlay method and brought back audio using the open-source XSPF audio player. In fact, we could easily stop here and call it quits. After all, it’s been a lot of work, hasn’t it?

Some of us, however, just aren’t satisfied; MySpace is the biggest blog network, and although the majority of us have blogs (or other people’s blogs) somewhere, it was previously impossible to tie the MySpace blogs to our ones elsewhere (and, in fact, it still is.)

At first, I just considered copying hyalineskies entries into MySpace, but extracting that content and placing it on the div overlay would have required a lot of CSS z-index trickery that is subsceptible to cross-browser failure. I decided that it would make more sense to automate the process, and to do so, I would have to write a bit of Flash code to access the hyalineskies RSS feed. The problem in doing so was that I didn’t know Flash (and I truly mean not one bit of it.)

I attempted to find an off-the-shelf solution, but nothing worked the way that I wanted my RSS reader to. I finally gave in and opened my copy of Flash 8. Five and a half hours of tutorials, Flash references, and crappy ActionScript later, I had build a .swf to read in the <description> of the RSS feed. I’m not going to go into the specifics of building the Flash application — that would take a four-part tutorial of its own — but I have released its code in the final MySpace Hack Pack at the bottom of this page. However, it is important to configure your server (and your MySpace profile) properly.

Preparing WordPress for Flash access

No matter what blog software you’re using, you will need to give the Flash application explicit permission to read the RSS feed from your server. Flash, unlike RSS readers, first searches the root directory of a domain (in this case, hyalineskies.com) for an XML file named crossdomain.xml. If crossdomain.xml doesn’t exist, then Flash will kill itself and not load the feed. It’s an interesting (read: seemingly kind of stupid) default security option. Make a file named crossdomain.xml on your root directory and copy/paste this XML construct:

<!– Cross-Domain Policy - MySpace Flash Reader –>
<cross-domain-policy>
<allow-access-from domain=”*.myspace.com” />
</cross-domain-policy>

For most default blog installations on your server, this should be good enough — that means this should work with just about any RSS feed on the server with crossdomain.xml in its root directory. Unfortunately those running Steve Smith’s WordPress FeedBurner Plugin will run into some trouble: your Flash RSS reader will get redirected to FeedBurner, where Flash will then search for crossdomain.xml (which doesn’t exist on FeedBurner’s root. Plus, your Flash reader would taint your FeedBurner statistics anyway, something which I’m not particularly fond of.) If you’re good with Apache and mod_rewrite, you may be able to edit FeedBurner’s code in your blog directory’s .htaccess. I personally couldn’t find a RewriteCond that worked (Flash sends the browser’s user agent as its own,) so I found an easier hack for us running FeedBurner: duplicate WordPress’s RSS generator.

From the server shell or your FTP client, duplicate wp-rss2.php and rename the duplicate to something random, such as xyzzy_flashrss2.php. Calling this PHP file will function the same as calling the original wp-rss2.php, where FeedBurner gets its feed, yet the user won’t stumble upon this duplicate file. I spent at least an extra hour trying to hack around FeedBurner to get this to work properly, and this is the easiest solution (although, like the rest of this reader, lacks quite a lot of elegance.)

Building the <embed> tag

Now that we have cross-domain XML restrictions freed up on our own server, it’s time to add the .swf <embed> tag into the MySpace profile. Upload your swf to your server. Your <embed> tag should be in this format:

<embed src=”your_uri/your_flash.swf?rssFeed=uri_to_rss.php” rssFeed=”your_uri/your_flash.swf?rssFeed=uri_to_rss.php”>

(where your_uri is the URI to your blog, your_flash.swf is the name of the RSS reader swf on your server, and uri_to_rss.php is the URI to your RSS feed / RSS generator page.)

Note that the GET query string (everything after the ? in the URL) is necessary for the Flash application to find and read your RSS file. Preview your <embed> in MySpace, and you should see your feed fade into place (see my profile page for an example.) If it doesn’t work, check your URIs and make sure you’ve followed all the applicable steps. (If you made edits to the code, make sure that you’ve looked over that, too; you can debug XML from remote sites without cross-domain restrictions if you set your computer’s Flash Player options properly.)

Once everything works, you’re done. You’ve built a custom profile from scratch and effectively redesigned MySpace to fit your own style. You have unrestricted music and your own blog posts. You have the freedom to link anywhere. It feels good, doesn’t it?

If you’re stuck, or if you need a base to start from, I’m releasing all of my code in a MySpace Hack Pack below, under a Creative Commons by-nc-sa licence. I’ve cut all of the images so you can’t just upload my profile to your own page without some heavy tweaking.

Since MySpacers seem to be a somewhat illiterate mass at times, I’ll say it here and delete comments or e-mails asking for help in the “hey, do this for me for free” way. Support for this is at my sole discretion, only via e-mail to eston@hyalineskies.com. If you post here saying you’re stuck, I will delete your comment. If you have improvements to the codebase (come on Flash coders, step up here!) or your own hackes, please do leave them as comments so I can take a look at them. Also, if you use these tricks and build something that has some design sensibility, add me as a friend on MySpace and I may showcase you as a good use of this tutorial. For now, however, it’s time to build. Show those MySpace “designers” what design really is.