How can I customize the file explorer window when I try to upload files?
Or maybe something that can get the files from the user side. I'm thinking of doing the same with the Share It app that can display all files from user side.
You can provide specific folder for the file explorer window to open when you try to upload files. You can refer and try one. This has several security concerns and works fine for local. You will have no idea about the specified directory when on server and hence my suggestion would be to leave it up to the user to explore and choose one.
Or maybe something that can get the files from the user side
You can try drag and drop approach to provide a convenient file upload user experience.
Other than these, you cannot perform any other customization like design changes.
Related
The use case of this problem is very simple but i struggle to find a good solution for it.
I want to allow my users (through a webapp) fill some pdf files stored in server (pdf with forms, which begin more and more popular).
Actually, app like chrome or acrobat reader are able to fill them perfectly whe its open locally.
I already allow this functionnality for docx and xlsx files, for that i use Webdav and the custom protocols ms-word ad ms-excel. It works perfectly.
For pdf, I didnt found equivalent. Its look the mains pdf reader/editor doesn't implement this protocol. Whe we open distant file with these tools, they failed for write permission when save or they try to save the file locally) .
Another option i take a look was the new file system access api (https://web.dev/file-system-access/). But again i wasn't able to make it working properly. The main problem here is how we can edit the file.? Im able with this api to dowload the file locally and keep the filehandler to retrieve the updates, but i blocked on how i can edit the file ? like an option on the fileHandler to say "Open this file with default editor on the OS". this would be perfect. But for now to edit the file i have to manually open it on the eplorer. i can't ask my end user to do that there is too many risk they edit the wrong file.
Another option on the table is the different javascript library for editing PDF, but these last one looks all very expensive, usually very heavy on the client side, with advanced features definitively i don't need. I just want to fill the forms and retrieve the pdf completed. So i would like to avoid this option.
Last option i take a look, i already use pdf.js (from mozilla) and pdf-lib.js in my app for some drawing features. I was thinking
rendering the pdf with pdf.js
retrieve all the forms fields (id, type, size, position) of the pdf with pdf-lib
generate html input write on the top of the pdf with the informations given by pdf-lib
i let the users fill the input and click on a save button whe he finished
on the save, i edit my pdf with pdf lib, i set the value of all my forms fields by taking value of the corresponding html input, and i retrieved the pdf updated.
This solution look for me the more "feasible". But im afraid of the volume of development, on how it will render, deal with zoom, rotation, etc. i would like to not have my custom solution.
I precise my webapp target chrome so it make me crazy to not be able to use the chrome pdf viewer/editor to do what i want.
PS : i struggle to post this question on stackoverflow. the previous one was deleted witout i had precise reasons. i try to be more specific on this one, but please if its such a dumb question, please answer it
I feel your pain, this is currently not possible. Adobe acrobat can open PDFs from webdav locations (simply call acrobat.exe and pass in the WebDAV UNC and it will work) but there is no way to trigger this from the browser.
If you are able to deploy software to your customers machines, you could create a custom URL scheme to do this...
I want to make a local file editor. To open some files edit them and save them back. It's ok if it only works in Chrome. Using
<input type="file" id="filepicker" name="fileList" webkitdirectory multiple />
I can read all the files and draw the file tree but I want to also be able to edit and save to these files. Even create new files and folders.
Is there any way to do it. I'm also ok with hacks that use Java or Flash or simply any other hack if HTML5 does not offer any solution.
Thanks
I do not believe what you are suggesting is possible; however, there is a different approach that should solve your problem.
If you take Microsoft's Online Word for example... They have it setup so you save document to the cloud and then can edit them with an online copy of Microsoft Word.
In otherwords, the user would upload a file. Your server would then take the file, display it and allow the user to edit the file. The user would then save the changes to the file. You can then provide an option to re-download the file.
To more closely emulate editing a file on the local file system, you can also setup a "temporarily" save on the server.
Essentially, the user uploads a file. The server would allow the user to view and edit the file. When the user wishes to save it, instead of saving the file on the server, give it back as a download to the user.
After the user leaves your site you can delete the copy of the file that is saved on your server.
I'm relatively new to this
We have a requirement to save a file with out the use of the dialog box.
I was wondering if I can use AJAX or some other JavaScript to "Push" the file from the client PC being viewed in a browser to to some web service the client is running and have it save the file.
Do I get into cross site scripting issues or an issue I don't know about at present?
Thanks
With valums uploader script, users can drag and drop files (in certain browsers) to a button on the page.. so, yes, no dialog box, but it still requires user interaction. (I also know IE10 should be able to handle drag/drop functionality from one of their demos; so this kind of functionality is gaining ground).
I don't think you can upload a file without a dialog box. That would remove the user interaction, so it would be the same thing as allowing a webpage to select any file it wanted and upload it without user interaction - an obvious security flaw.
Generally, without a dialog box, no it can't be done.
HTML5 has a file API where the web app can store files on the local machine. But this access to the filesystem is sandboxed, so you get to access files only under your directory.
Why can't you do without a dialog box? Imagine you visit some site and it "uploads" files without your permission. That's a security FAIL. The dialog box is the user's authentication for the file to be uploaded.
I'm developing a web app that needs some sort of filesystem access. Ideally I'd want to be able to "Open..." a file into the app and then "Save" the file back to local filesystem at the location that the user opened it from.
Currently, we use a java applet to achieve this functionality, but since java is going out of style, we're needing to do this with javascript and html5.
Obviously, this can't be done because of security reasons built into browsers, so I'm trying to somewhat emulate it.
I'm using the html5 file api to successfully import/open the files, so that's half the battle. The hard part is getting the saving feature. I'm getting close using an iframe and content-disposition, but problems arise when browsers are set to automatically download the files to a downloads folder... users may get confused and be unable to locate the file they just downloaded.
So, my question is this: is there some sort of onSave event or some kind of way for the browser's "Save As..." window to return at least the filename that the user saved the file under?
Also, I've looked into the filesystem/fileWriter html5 apis, but from my understanding they're limited to only a sandboxed area of the local filesystem and only available in chrome dev releases.
Any help would be appreciated!
No, there is no way to do that with pure JavaScript. You can manage to trigger a download with data URIs or an iframe with some headers but you can't circumvent the browsers' download managers.
You can either use a Flash or Java applet to handle the saving for you, or ask the user to right click on the link and do save as, then he might be able to choose the destination.
One popular option using Flash is Downloadify.
I need to have my user send the file path to the webserver. For this i'm trying to use input file type so that user can select the file. Please note that I don't want do uploading the file. I just need the location of some file. So user should be able to do that using browse option. I know that due to some security reasons in browsers, full path is not sent to server. But can we acheive this some way. I've observed that using input type=file after user selects some file using browse option (as it is not possible to select folder), the Firefox sends the server just the filename and IE sends fullpath of file including file name.
Please note that this website is used internally so it is not a security problem at all, so don't bother about security and all.
is there anyway we can acheive this?
Thanks in advance,
Sreed
You need to use something that has access to the filesystem. BY DESIGN javascript/html cannot do this. You need to use flash, java or a browser plug-in.
No, sadly I don't think there is.
All modern browsers will send a C:\Fakepath path. To my knowledge, this behaviour can not be changed for local networks in any browser.
I'm not sure what the state of things is for Flash-based uploaders like SWFUpload or Uploadify. Flash traditionally gives more control over such data than the native browser controls. (Edit: Uploadify seems to give you the file path. See this question: How can I get the uploaded file details from uploadify after completion however, this of course is after a completed upload, which is not what you want.)
A Java applet based solution will be able to do this, but I expect the effort to implement this is huge.
I would consider using a normal text file, and asking the user to just copy+paste the correct path.
Browsers do not let you save or even see the full file path to a selected file from the <input type="file" /> form element. I would recommend Flash or Java for your needs. You could also have the user manually type in the full path...just a thought.