Upload files from mobile on server using jquery - javascript

I have a mobile application which needs the user to attach some files from his mobile and upload it on the server.
Is there a way to upload files on the server from mobile using JQUERY/JAVASCRIPT ?
I found many doin it with PHP/ASP.NET-c#...but my need is HTML with JAVASCRIPT/JQUERY...!!
FURTHER INFO ON MY APP (Kindly neglect it if not needed):
I have my front-end in HTML/CSS..I have a WCF service running on my server that does the communication with the database..I use the WCF service by making ajax calls from my client side..
I achieved all the other operations such as insert/delete/update/retrieve data from DB using these services only..
I was wondering if there is any possibility to do the "upload files on the server" task also using these webservices...but didnt get any idea about it !!!
Here is another question exactly precise to my need !! File upload service using WCF along with jquery(AJAX) and html client
Sorry if i m wrong anywhere..This stuff is totally new to me and so i need all your guidance..

To save an uploaded file, you need an server side script (PHP, ASP e.g.) to move the uploaded file from the servers tmp directory, to your desired location.
Maybe can you edit your serves configuration so it writes the uploaded files automatic to your desired location, but I wouldn't suggest that due to security reasons.

Is this a native application? If it's just a website then you'll struggle as safari on iPhone doesn't support file uploads. If it's a phonegap application you could maybe hook into the file API...

Ok some of the points worth mentioning.
When you wanted to upload file to server you have to POST file with multipart content type of the form. For this you might need to write WCF service on server end accordingly. I am not having good experience of WCF but this post should help may be
<form method="POST" enctype="multipart/form-data" >
HTML5 file API and XHR Level 2 specification you can upload files to server. As they are new features and JS and DOM involved yes you can consum and do it in JQuery as well as long as your browser is supporting them.
With these things i am not sure if there should be any issue while uploading files to the server.

Related

How to download Image from browser & upload to Amazon S3

How can I allow the client to upload an image in the browser, and then I upload it to Amazon S3? I have been looking around a lot and have found no resources explaining how to do this.
Are there any tutorials that I could follow?
Are there any libraries that I should use for this?
I am using AngularJS on the frontend and Node.js on the backend.
In short, look for two different tutorials. One for uploading from a client to a server, one for uploading from a server to S3.
StackOverflow discourages linking to specific tutorials, but there are lots of them out there, so it shouldn't be too tricky to track down.
For the client-to-server, you'll want to do a basic HTML form upload up to the server, then snag the data. You can temporarily write it to your file system (if you're on Linux, the /tmp directory is a good place to stash it).
After that, just upload from your server to S3. Amazon itself has some good documentation on that. The s3 package for Node also has good examples: https://www.npmjs.com/package/s3
It's also possible to go straight from the browser to S3, which may be better depending on your use case. Check this out: http://docs.aws.amazon.com/sdk-for-javascript/v2/developer-guide/s3-example-photo-album.html
You're going to need the AWS SDK for node. Then they have a pretty comprehensive developper guide. You may have to read up on credential management, too.
the procedure would be as follows
user uploads the image from browser to your server (I'd recomend plain form upload, unless you feel ok with uploading via ajax)
then your server uses the SDK to save to S3
you display back info to the user (link to the image, upload status ?).
you could also use pre-signed posts but that seems more advanced and I haven't seen info on it for Node.

Write PDF files from Web-App to USB-Stick

I am concerned with the feasibility of this:
On a pre-configured machine I will have a Web-Application pre-installed, next to an Apache-Suite. So client and server are the same!
In this Web-Application Users can drag and drop PDF-Files to an USB-Icon.
Then the Web-App should write the dropped PDF to an attached USB-Stick.
I have never done something like this (writing to USB), so I am fairly insecure.
And I am well aware of the browser-restrictions concerning JavaScript and Filesystem-Access, but...
after researching a bit I found out, that there might be some possible and
relevant (I'm a Web-Platform-Guy) solutions to this:
Make a "Chrome App" with USB-Permission (does this really work?)
Use PHP to find the USB and then write to it (how would that work under Windows?)
Use some Flash as middle man (not preferred)
Now I'd like to know:
Has anyone some good experience with before mentioned possibilities?
Has anybody ever done something similar? Did it work? Which path did you choose?
How would I know which drive the USB is mounted, and how would I get sure?
What other possible solutions to this problem are there?
You have a website ('client-side' user interface) and a back-end server ('server-side') running on the same machine. This gives you 2 options:
Client-side: Download a file through the browser via HTTP GET and let the user choose where they save it.
Server-side: Build your USB interactions into the back-end (Node.js) code, as #mcgraphix suggests.
Interacting with the USB on the server-side provides the most flexibility. Furthermore, there are a number of libraries that you can leverage. Head to npmjs.org and consider, among others, the following Node.js server-side packages:
usb-detection
usb
With the server-side approach, initiate a Webservice request when the user completes the drag & drop action on the client, and implement the USB interaction within the server (Express.js or similar) method which services the request.
If the letter of the stick is known then writing a file from PHP will be simple
file_put_contents( 'E:\\folder\\file.pdf', $data );
Update
You can read a list of drives into a dropdown and allow a user to select a default drive to write to
https://stackoverflow.com/a/8210132/696535
Your question is more an architecture question than a code specific question.
Your web app (if you insist on a web app) should have two major components, a server side component that can be given arbitrary commands, and a client side component (javascript using XMLHttpRequest) that can make requests to the server side component to execute said arbitrary commands.
So your server side component, the component that serves your web page should have some server side code that can write your pdf to the file system, it should probably generate the pdf file as well rather than doing that on the web browser.
Which technology you use is up to you, whether that's PHP, .Net, Node.js etc...
The general gist is you want a server side framework that deals with HTTP requests, in your case probably a post request from the client side containing the encoded pdf, and responds accordingly. Bind a particular http route to trigger your save logic.
Your http post request to the server will contain your payload which is the pdf file to a particular path, e.g. http://localhost/savepdf that whichever technology stack http listens to (you'll need to configure that)
Your server side component should read the incoming data, decode it as appropriate then make a file system request to write the received payload to disk.

Can I create a directory in client PC?

I have multiple questions
Can we create a directory in client machine ?
Can we check the running browser's default download path?
My requirement is that the user will download a BLOB data from my DB that time I want to create a folder in client machine and use that folder to save the blob data.
Can this be done using javascript,jquery,ajax,php,angularjs ?
You can't create a folder in client PC using JS.(don't even bother looking with HTML and CSS)
The best way you could accomplish something as you describe is to give a .zip to your client, so while extracting it, it creates his own container (the folder). But you must be sure that the people who intend using your web application knows how a .zip works.
Using PHP you can't do anything in the client PC. PHP is a server side programming language. So, it is running only in the server. When you make any request to the server then only PHP performs. In the browser end or client side only HTML, CSS and JS works.

Can AngularJS save/write file to server without any server side technology?

I would like to know if AngularJS can save some file without need of NodeJS, PHP, Java or similar server side technology. Just pure JavaScript. I have seen many examples of AngularJS upload scripts. But it did not fully understood if AngularJS alone can do it. In those examples, files seem to be uploaded as blob, and then represented automaticly in browser when upload occurs. But that file or image is never saved on server, I mean on the disc of the server. I would like to achieve that.
I have checked this links:
File Upload using AngularJS
AngularJS: how to implement a simple file upload with multipart form?
But seems or mentioned blob technique is used, or it is some server side technology involved. I would like to have upload script where I would not have to worry about server-side handling, so if possible, upload would be done all via AngularJS/JavaScript.
So can it be done, with pure AngularJS/JavaScript?
I would appreciate the example..really don't know how to do this?
AngularJS is client side code only. By it self it has no power over the server from which it served. After the code is sent to your browser it has no connection or reference to the server side environment.
So the short answer is no.
The long answer is that you need a script/program running on your server which can handle the file input from a request. That request can be simple multi-part upload or a two way web socket connection, but anyway you need a logic which handles on the server side the request. Because Node.js server is written in JavaScript, you can write a full JavaScript implementation of file upload, but that's no longer just a simple AngularJS code.

How to ftp a file over to a server from PhoneGap/webapp?

Is it possible to connect to a server and FTP a file from within PhoneGap application? Basically I suppose - is there a way to open an FTP connection with Ajax/JQuery somehow?
I don't think you will be able to FTP a file from PhoneGap however they do provide an API for transferring a file to a server using HTTP multipart encoding:
http://docs.phonegap.com/en/1.0.0/phonegap_file_file.md.html#FileTransfer
You would need a script on the server in your chosen technology to receive the file however you should then be able to do whatever you like with it, including move it to the directory you are trying to FTP to
Ftp program for phone gap is here please see this bellow link.
https://github.com/macdonst/FtpClient

Categories

Resources