loading
Apple’s iPad is a wonderful device for watching video, but the limited space on the cheaper 16GB device can limit your selection. There are solutions, such as Netflix’s great app, but that requires a subscription. There are commercial apps that can stream video from your computer to the iPad, but why spend money when you can do the same thing for free with an old computer (Windows, Mac, Linux) and a local network.

This instructable takes advantage of HTML5 video, witch allows you to stream H.264 video to your apple product. I will be using an iPad, but this should work for any device that supports H.264 video in HTML5, even the Chrome browser.

Anyone with some basic computer knowledge and basic networking knowledge should be able to follow these instructions. Some HTML/PHP knowledge can be useful for customizing the web UI, but none is needed.

Step 1: Parts

Computer
H.264 video (not DRM iTunes videos)
Wi-Fi network
Apache Server (part of Xampp)
PHP (optional)(part of Xampp)
Filezilla server (optional)(part of Xampp)


I set up the server software on an old PIII computer, but this will work on any computer. I used PHP to create a better user interface, and Filezilla to remotely add videos to the server, which is running next to my router with no monitor.

You can choose to run Apache and PHP on your main computer. You will need to leave your computer on to stream videos, though. I had an old computer, so I chose to use it. It is an old Pentium III 500mhz with 128MB of ram running windows XP. I find that I am bandwidth bound and not processor bound. The external drive I’m using to store videos on is connected via USB 1.1, so that plays a big part of it, yet I am able to stream standard def video fine.

Step 2: Setup Xampp

I used windows XP as my server, but any operating system will work. First you need to download and install Apache and PHP. I used xampp (xampp.org), as it simplified setup. They have versions for Windows, OS X, and Linux.

Download the correct version off of the website (xampp.org), and start the installation process. If you will be using an external drive to store the videos, be sure to install xampp onto the external drive. I’m installing mine to I:\. The extractor automatically creates a directory called xampp. On a slow drive, it can take many minutes to extract all the files.

Once done, the startup script will run.
My install settings:
Should I add shortcuts? n (I’m not using a monitor, so no point)
Should I proceed? Y
Use drive Letters? Y (very important, as you want to set up apache as a service)

Next answer the questions about the time zone, then enter 1 to start the control panel, and x to exit the startup script.

Step 3: Configure Xampp/FileZilla

In the Control Panel, next to apache and FileZilla (optional), check the Svc checkbox. This will allow apache and FileZilla to run without logging in, which is important for a headless computer. Then Click the two start buttons next to Apache and FileZilla.

To configure FileZilla, click the Admin button. This will launch the FileZilla admin window. It may ask you for a server and password. Just use 127.0.0.1 for the server and blank for the password.

In the admin panel, click Edit -> Settings, then Admin Interface Settings. Here you have the option to change the Admin password, if you want. Click OK when your done.

Next, you need to add users by clicking Edit-> Users. I’ve only created one user, but you can add more. Type the name of the user, add a password if wanted, and then click on Shared folders. Click Add, and then browse to your xampp\htdocs folder. Once the folder is added, be sure to select the folder permissions. I’ve allowed full access, but you can limit the rights, but you will need at least Read and Write. Click OK to save the settings.

Your ftp server should be setup. To test it, navigate to ftp://My_Name@127.0.0.1, or whatever your new user is. If it works, FileZilla is setup. You should be able to see some files like xampp and index.php.

Now, open up a command prompt, and type ipconfig to find out your local ip address. Mine happens to be 192.168.1.3. You can configure your router to fix that ip address, so you don’t have to guess later on what ip address you need to connect to.

Step 4: Transferring Video to the Server

You can use any ftp client you like to send the video files to the server. I use filezilla client. Connect to the ip address you found earlier, and log in with the account you made. Place the files in a single video folder on the root of your ftp server. For faster transfers, you can just copy the files using explorer to xampp\htdocs. Once you are done, you can unplug the monitor, keyboard, and mouse if you want, as we are done with the server.

Step 5: Code the UI

Next we will setup the web interface where you will browse your files and watch the videos. You can use my code, or make your own, using the basic concept. The code to display a HTML5 video is:

<video src=”video.m4v” controls=”controls” width=”600px” >Alt Text</video>
Change video.m4v to the file and change the 600px to your liking, but leave the part controls=”controls”.

I wrote a php file that reads an xml file and then displays a list of videos, which then enables you to watch the video. It’s not the best code, but it works. Create a file called index.php, and send it via FTP to the video folder, along with the files style.css and movies.xml

You can download the files here: stream.zip


There is no limit to the number of videos you have in your database.

Step 6: Enjoy

If everything worked out, you should be able to watch videos on your HTML5 compatible browser. Navigate to http://192.168.1.3/video (or whatever the ip address of your server is) and, if it works, you should see a list of all your movies. Click on a movie, and you should see a black rectangle. It may take a while, but a play icon should appear, and you should be able to watch your H.264 videos on your iPad/iPhone.
<p>This is complicated for users who don't have much experience with computer, especially for server side. I am here offering a simplified version. First, locate the videos and check whether is in MP4 or MOV format. If yes, then you can stream them directly to iPad via Wi-Fi; If no, you should convert the video first, then stream it via wifi. Here is the step by step tutorial:<br>http://www.imoresoft.com/video-converter-ultimate.html</p>
<p>thanks helpful i fix my problem keep going </p>
<p>Thanks Great work...!!</p>
<p>The link to stream.zip says &quot;Not Found, Error 404&quot;. Can you send me the zip?</p>
Hi, thats an awsome idea, but I would use php's readdir command. <br>Look at this: http://www.php.net/manual/en/function.readdir.php
I use AirVideo, but I really like your idea. I'm sure it can be used also to stream music as well. I think the iPad is a great device except the lack of memory, so its best use is to be a streamable pad, only the streamers they have now cost money.<br><br>Will it stream videos to the Safari browser? <br>For AVI, MKVs, I won't have to transcode?<br>Thanks<br>Dan
I haven't tested music, but in theory it is no different. This same concept works with desktop browsers that support h.264 HTML5 video, so all current generation browsers except firefox. Though, there are better solutions for streaming to a desktop. VLC integrates easily into this system.<br><br>However, you WILL need to transcode your video in to format supported by mobile safari. I don't know what container formats are supported, but the video needs to be H.264<br><br>Aaron
I choose xammp because when I tried simply sharing the files over a network, I couldn't play the videos. I wanted something free, so air video and other services were out of the question, and all of my videos are in the proper format, so transcodeing isn't a problem, but if it is, then $3 isn't to much to pay, but I doubt that I could transcode video realtime on my old pIII computer.
Instead of installing xampp and all that, how about just using something like HFS? http://www.rejetto.com/hfs/ It's small, lightweight, and serves files easily. I currently use it to connect my pc files to my iPod Touch, and can stream video thru it efficiently. You could also use Air Video ( http://www.inmethod.com/air-video/index.html ) to stream videos, but you have to pay for it. I highly recommend it because it'll transcode just about any video you can throw at it to something iPhone compatible. Note: You'll have to run the server software also, which does all the transcoding. It's fairly small, my system shows it only using 40MB when idle. And you can connect your device to multiple computers running the server software.

About This Instructable

57,900views

26favorites

License:

More by acrog2:Stream video to an iPad/iPhone for Free 
Add instructable to: