28/07: Simple Webcam Page for Trendnet Cameras
Recently I bought a Trendnet wireless webcam (TV-IP110W to be exact), and I wanted a simple way to put the images online. I didn't want to use a service. I wanted the images to be on my own website. I searched Google and came up with nothing good, so I decided to write it from scratch.
In the camera admin I was able to easily setup the FTP info so the camera automatically uploads the images to my website. (If you have already done this just skip on down to the code) These setting are found under the tab called "Event Server". Just put in the host name, username, password, and enable passive mode. You'll probably use port 21 and the directory be default is set to "/". I set my photos to always upload in a folder called "images". You can do this by going to the "Event Config" tab and set the "Filename Prefix" to "images". You could also setup your FTP account to always filter to the "images" directory. Either way works.
You also need to set the frequency for the upload. This is also under the “Event Config” tab. Click on the item called “Schedule Trigger” and enter the settings for FTP. Check “enable”, set the schedule profile to “always” and the interval to 5 seconds.
Once you have all this setup make sure the uploads are working. The camera will automatically make folders based on the date in this format - yyyymmdd. It stores the images in these folders so you can easily manage your archives. You should get a new image every 5 seconds.
The next step is to create a really basic PHP page that will automatically refresh and show the latest image. I already did that for you!
Here is the code you'll need: webcam.zip.
Upload it to the root directory, browse the file, and you are all set! You can move things around if you like – just make sure to correct the pathing for the image.
If you wonder how the code works it is pretty simple. The meta tag refreshes the page every 5 seconds. (You can change this if you want.) The PHP creates the folder name based on today’s date, and then it pulls the last image in the directory – which is displayed on the page!
In the camera admin I was able to easily setup the FTP info so the camera automatically uploads the images to my website. (If you have already done this just skip on down to the code) These setting are found under the tab called "Event Server". Just put in the host name, username, password, and enable passive mode. You'll probably use port 21 and the directory be default is set to "/". I set my photos to always upload in a folder called "images". You can do this by going to the "Event Config" tab and set the "Filename Prefix" to "images". You could also setup your FTP account to always filter to the "images" directory. Either way works.
You also need to set the frequency for the upload. This is also under the “Event Config” tab. Click on the item called “Schedule Trigger” and enter the settings for FTP. Check “enable”, set the schedule profile to “always” and the interval to 5 seconds.
Once you have all this setup make sure the uploads are working. The camera will automatically make folders based on the date in this format - yyyymmdd. It stores the images in these folders so you can easily manage your archives. You should get a new image every 5 seconds.
The next step is to create a really basic PHP page that will automatically refresh and show the latest image. I already did that for you!
Here is the code you'll need: webcam.zip.
Upload it to the root directory, browse the file, and you are all set! You can move things around if you like – just make sure to correct the pathing for the image.
If you wonder how the code works it is pretty simple. The meta tag refreshes the page every 5 seconds. (You can change this if you want.) The PHP creates the folder name based on today’s date, and then it pulls the last image in the directory – which is displayed on the page!