Archived from the Transloadit support forum. Originally posted on August 30, 2013; details may be outdated, see our docs for current behavior. Original thread
Hi,
I’m having trouble getting any upload form to work. I appreciate this is me, but if you could maybe spell out some of the obvious things I’m missing, it would help a lot.
I’m under the impression .php files need a proper .php server to do their job? My sites run on s3 with no php/mysql etc. So does that prevent me from using your forms or do you host the files?
The Template in the demo section of Transload it, I take it I don’t copy that code?
What do I use as the Action url? My s3account doesn’t work, is there a Transloadit address I need to be using?
Are there any full examples knocking about? Piecing bits of code together is fine when you know what your doing but this is day two for me and I’m more confused than yesterday
Yes for php files you need an intelligent server. ‘Flat’ html such as hosted on s3 does not get processed on the serverside, and ends up in the browser as-is.
Although you can do more and more with JavaScript, some things like having a central database, accounts, security is not really possible to do well with pure html/js.
You can get Transloadit to work, you could save your S3 credentials in your Transloadit account, and then we could receive any upload, and store it for you in a bucket.
It will be hard to show an index to your users without keeping track of all the files in a database though. The browser probably doesn’t have access to S3 to index the files either.
One more concern is that you cannot use signatures. We use signatures to enhance security (mostly so that others can’t copy your site and also use your bucket for storage).
Let me know if this makes sense and if you want to go through with it, then we can help you further.
Thank you for your reply and all the info. I do have all my s3 credentials saved in my Transloadit account as a template. That’s why I figured I wouldn’t need to copy the template to a web page, I assumed something in the code would ‘call home’ for that, so it isn’t obvious in the site code?
Yes I’m up for trying anything really. Security is a concern but clients seeing the files isn’t. Initially I’m looking to use it to just upload audio files to s3 from my site, but I can make loads of use of video encoding.
I’ve just created an instance on EC2 which I believe is for all php, myseql etc. Not too sure what i’m doing with that though to be honest.
Thanks for you help. If you have any suggestions my eyes/ ears are open.
Now create the HTML page and refer to the template_id that contains the encoding instructions:
<!doctype html>
<html>
<head>
<meta charset="UTF-8">
<title>Transloadit Demo</title>
<link href="//netdna.bootstrapcdn.com/twitter-bootstrap/2.3.1/css/bootstrap-combined.min.css" rel="stylesheet" />
</head>
<body>
<div class="container">
<h1>Transloadit Demo</h1>
<p>
This method works without any serverside code, so you could also just store a flat
HTML page on S3. However, please note that this is <strong>note very secure</strong>.
</p>
<form id="transloadit" action="" enctype="multipart/form-data" method="POST">
<input type="file" name="my_file" />
</form>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.9.0/jquery.min.js"></script>
<script type="text/javascript" src="//assets.transloadit.com/js/jquery.transloadit2-v2-latest.js"></script>
<script type="text/javascript">
$(function() {
$('form#transloadit').transloadit({
wait: true,
triggerUploadOnFileSelection: true,
params: {
auth: {key: "TRANSLOADIT_AUTH_KEY"},
template_id: "TRANSLOADIT_TEMPLATE_ID"
}
});
});
</script>
<script src="//netdna.bootstrapcdn.com/twitter-bootstrap/2.3.1/js/bootstrap.min.js"></script>
</div>
</body>
</html>
That’s excellent. Thank you very much for your help. It works perfectly apart from after upload, the page redirection goes to an Aws fail page:
Error>
<Code>MethodNotAllowed</Code>
<Message>
The specified method is not allowed against this resource.
</Message>
<ResourceType>OBJECT</ResourceType>
<Method>POST</Method>
<RequestId>45A99338474F144B</RequestId>
<HostId>
WvcsVvvp/4Oj0emXyrq94iCV0xMvJpxP7HhzC+lbCajLQkzKflFF/kdlwki/ejgR
</HostId>
</Error>
Despite the error listed, it has actually worked. Uploaded files are in my transloadit account and the correct s3 bucket. Do you know why it might be displaying the error? Or is it perhaps possible for me to re-direct them to a success page?
I’m not sure which file name you mean. The file name of the file to upload? That would surely be different each time? Anyway, I’ve viewed the source from the example forms to see what you guys use. Obviously they’re set up for Transloadit, but it seems to work fine filling my sites name in there. (There’s a certificate warning but it still redirects to the address I enter in the form action. Maybe an AWS certificate will fix that). So I’m guessing I can create a ‘success’ page and include it there.
You’re a gent, thanks very much for your help. I appreciate what I’ve asked is basic for you guys, but you’ve really helped me out. Much appreciated.
Yes, in your case, I would recommend creating a separate success.html file with a nice message in the same directory as your index.html, and then changing the action="" to action="success.html".
Then Transloadit will forward the user to that page once the upload completes, and the flow should be ok for your users.
