Upload files, particularly large files, safely and with progress indication
May 2018
A Modern File Uploader
John Ince
Why Do We Need a 'NEW' File Uploader?
With our live CMS (Content Management System) we've a need to upload images for everything from a user photo to our slick sliding image headers. We let our users upload whatever image content they want. Our existing solution was perfectly adequate for smallish images and is based around a PHP script. Basically it's old school with very little feedback. Then someone asked the question that turned out to be the straw that broke the camels back. Can we upload video files too? So there we are...
Our New Video Control Drove This Feature
As part of our work with DBD International we created a new control that could host video content. It's designed to work like those slick Wordpress websites that everyone seems to love. You open the home page and it hits you, a full page playing video to grab attention. Initially, in the first cut of this page control, content was changed by pasting an URL to a video file on the web. Hence if you have a video file on your own computer you need to upload it somewhere and then paste the URL. What if you don't have any web storage? Wouldn't it be great if you could simply upload it to our cloud and set the URL to our own hosting. Hence the need for a much better uploader is born.
A Modern File Uploader
Landing page video reduces bounce. Instant engagement. We added this new control at our client's request. We're all about function here at Project Peach but who says it doesn't have to look good too...
How's It Work?
It's pretty simple really. We already have a bi-directional connection between our in browser front end and our cloud hosted native code web application. Why do we need to go through the traditional web server via a PHP script like we currently do? We don't. We already have a better, safer and much more secure constant connection. We already have coding components that can decompose a binary file into manageable sized chunks, push the data to our app in the cloud and reconstruct the binary file on the server. Best of all the connection is both ways so we can push files back and continue to process other messages, like progress indication, from both client and server components. Other messages continue to flow normally so there's no degradation in usability of the browser user interface. We've also perfect control over granularity and frequency of the messages to optimise slower upload during busy periods, throttling in other words. Just add a nice little progress pop up and we've excellent upload feedback.
A Modern File Uploader
We've cool feedback of progress via our two way smart connection. A nice comfort for bigger video files. Have a look at the progress bar.
So the New Video Upload Process
So there's a video file on your local computer or network. You want it as your home page video for today. Login as an administrator to enable our CMS system. Right click the home page video, select edit, click the little upload button (in preference to an URL pointing at a web hosted video file) and up it goes. On upload completion the video is changed. And because our CMS is live, anyone looking at the home page is updated live without any refresh. It's so simple.
A Modern File Uploader
Just select your video using the standard file open dialog and upload to change. It's all fully automatic. Swap your home page video every day of the week. We even added a fallback image in case your user's browser doesn't support playing video content, simply select and upload. We'd normally put the first frame of the video here.
What's Next for our New Uploader?
We've used our simple PHP uploader in quite a few places. We've nailed down the security issues associated with this type of scripted mechanism by obfuscation, minification, client side checking and server side security however it remains a common security vunerability and a common source of attack. We've a commitment, where possible, to remove any PHP scripting that's not an essential bridge between the web server world and our web application world. We're working towards only glue PHP code with little functionality. So, onwards we'll replace the current PHP uploader with our new, modern and secure websockets uploader which provides better feedback with progress bars. Anywhere you can post an image or a file we will refactor and remove the PHP uploader.
Doing it differently since 2012. We're simply 10 years ahead. Our software is designed, coded, maintained, supported & hosted in the United Kingdom.
Why Project Peach?
The Hawthorn Gallery
DBD International
Knot 2b Missed
Monero Mine
About Us
Contact Us
Pay Us
Copyright 2020 Project Peach