1

I want to write a browser add-on that automatically upload file on the page. So this will be done in pure Javascript.

This is what I have / know:

  1. input#someId of the file upload input

  2. File name and location in the computer

I am trying to "hardcode" in the console for now as a "Proof of Concept" but I cannot get it to work.

I have tried these two methods:

  1. inputElement.click() as inputElement is the querySelector of that input.

  2. Use initMouseEvent from what's the equivalent of jquery's 'trigger' method without jquery? but gave me error Uncaught TypeError: Cannot read property 'dispatchEvent' of null

So my questions are:

  1. How to trigger click input of file upload element?

  2. Better: how to process the upload completely? Basically pass the filename+location for upload to start (like when user clicks OK to open the file from the dialog)

UPDATE 1:

I was reading this http://www.thecssninja.com/javascript/fileapi Maybe uploading file from File System is not possible. How about these alternatives:

  1. We can grab a file from url (http)

  2. The file is just image and in Javascript memory (base64)

Anyone of the above should be OK if they can be automatically upload and bypass the dialog box and search the file via local File System. I am thinking what if the image DOM or even canvas can be just dragged?

Improve this question
9
  • 2
    You actually can't do this, browsers will not let you programatically trigger file uploaders for security purposes. There must be user interaction Commented Oct 17, 2014 at 20:10
  • It would be a major security risk to upload a file from the user's machine automatically. File uploads require manual user interaction (therefore explicit consent). Would you like it if a website you visited automatically uploads your, say, browser settings, to a remote server? Commented Oct 17, 2014 at 20:12
  • stackoverflow.com/questions/15249185/… Commented Oct 17, 2014 at 20:13
  • possible duplicate of File upload with Javascript without user intervention Commented Oct 17, 2014 at 20:20
  • I've seen somebody doing it through jQuerys .click(). I never went to find out how it works, but it does. Commented Oct 17, 2014 at 20:44

1 Answer 1

Reset to default
1

As people commented, you cannot do that. For security reasons, you have absolutely no access to programmatic fill an file input. Think about it, some dude could add a simple script to steal files from your computer and you wouldn't even know!

As far as I know, can't be done.

Improve this answer
Sign up to request clarification or add additional context in comments.

6 Comments

Maybe can be done by java. Java can do any kind of sick stuff.
yes, because you need to allow the applet to run, and will be warned you should trust it ... so basically you are opening the door for it to do whatever yo want - but javascript runs ALWAYS so you don't get the chance to "allow" it, so it doesn't support such feature by default.
Yeah, I know. However I remember times when there were less warnings for java applets...
I updated the question. Any chance what my suggestion is possible?
a remote url is easy obviously, you just need to create an Image object (var myImage = new Image(); myImage.src = 'url';) and work with it. There are functions to read the pixel data in it if you want etc etc... you might want to add a callback for when the image is fully loaded to work with it though.
|

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.