Facebook File Upload Using Ajax - javascript

Is it possible to upload file in facebook fbml (not iframe) using Ajax ? not a complicated one but just use simple input type="file" tag wrap in a form and post the from using facebook builtin ajax. If can, then how to accept it in server ? I'm using rails facebooker as my backend and paperclip plugin as my file upload system.
Thanx

When I was looking for AJAX uploads, the best I could find was only using iFrames. From this, I assume it's not possible?

client can=server can.

There is no easy way to do so in a fbml app. However what you can do is that you should create a normal file uploading script (non fbml) and submit your request to that script.
This script uploads the file and goes back to the original fbml page.
I have done that in following app:
apps.facebook.com/theaffinity

Shouldn't it be possible to do something like in Gmail (i.e. AJAX file uploader with loading bar and not having to refresh the page) on a FBML page? Probably with a hidden fb:iframe that would post directly to your own server (not facebook's)..
I'm afraid it would probably take me days, but if anyone has figured it out, please post back :)

Related

access local file with jquery in client side of a Django project

I need to access a local file on the client side of a Django project and read an xml file from the client's local disk. Like C:\\test.xml
I am doing this in a single html and script file and using Chrome --allow-file-access to get permission for this access and it works but when I move this code into my Django project and use this jquery script in my html templates, it does not work and shows cross origin request ... error.
Please help me. Why is this happening and what is the solution?
Thanks.
One viable option that would work and not set out security alarms all over the place, would be to use file form field on your page and ask an end user to give that file to you.
Then, you can use HTML5 File API and do whatever you need in javascript or send it to your server.

Upload files using angularjs without php script

just want to ask if it is possible to upload files (images, docs, pdf, etc.) using angularjs without actually using php script, instead all file uploads will use angularjs or javascript codes?. With this method i will be able to lessen the server load. Thanks
That is not possible.
AngularJS is solely a frontend framework. In order to upload something, you need to communicate with a server.

How is that jQuery-File-Upload plugin works without Flash or Silverlight?

The jQuery-File-Upload claims to work with IE6+ and there are no open issues about it at https://github.com/blueimp/jQuery-File-Upload
So I am wondering how it accomplishes this when other polyfils to the file API have needed add-ons to access the file system.
As far as I can tell without looking deeply into the code, it will use a iframe.
Look here:
https://github.com/blueimp/jQuery-File-Upload/blob/master/js/jquery.iframe-transport.js#L70
The thing is that if you can't do it without ajax/websockets or whatever... then the only possible way to achieve this is to do the request into an iframe.
Inside the iframe, there will be a form with a file input. It will do a request to the server as usual and when the iframe reloads, the javascript code should be able to update the user with the file being uploaded. The iframe could contain something like an id to the file attachement to add to the main form... then on the server it should be possible to link the file attachement to the form.
That's pretty much like that. This method has some disadvantages though because it works within an iframe. Iframes are getting much more restricted for security reasons than they were before.

PhantomJS - Upload a file without submitting a form

Is it possible to upload a file to a certain page using PhantomJS without submitting manually the form? I think something is possible using the Content-Type: multipart/form-data.
The example on https://github.com/ariya/phantomjs/blob/master/examples/imagebin.js is working fine, but I want to send directly the file in the POST request without interacting with any element.
Any suggestion?
Thank you very much
File uploads can be done over AJAX (as of xhr2 - if you need to support older browsers, use something like jQuery-File-Upload; there is a good tutorial here on using it just to do the upload part, and not using Blueimp's UI.) That is related to the "without manually submitting the form" part of your question. You will still need to interact with a file upload element to choose the file, and that is where you use page.uploadFile().
To do it solely from JavaScript, without "interacting with any element on the page", you could use page.evaluate() to run some custom JavaScript. It could then use the File Reader API to find the file on local disk, store it in a blob, then upload that blob over AJAX. The WebKit in PhantomJS (roughly equivalent to Chrome 13) should work, as apparently the FileReader API has been there since Chrome 6.
(BTW, if all you wanted to do is upload a file to a server using a headless script, PhantomJS is overkill, and you could use curl. But I'm assuming you want to use PhantomJS for some other reason!)
The solution I've used at the end is a mix of NodeJS and PhantomJS, in case I need to upload something I fork a process and upload the file(s) using the NodeJS "request" module and then send back to PhantomJS the output of the page, which need to be manually processed.

Is it possible to use the File JavaScript api to load a server side file?

A quick question, I recently checked out the new html5 File api for javascript. See it here. Is it possible to use it to pull in a server side file without ajax? I know there's a File object in JavaScript, could I do a "new File("serverSideStuff.xml");" with that?
From the API description -
Using the File API added to the DOM in HTML5, it's now possible for
web content to ask the user to select local files, then read the
contents of those files.
So no, you can't select server side files
No, it is only for local files, as I know.
It is not possible because the user must be aware of what your are loading, and is the user who can tell you what you can load or not.

Categories

Resources