Javascript upload file from web page to specific google drive account - javascript

I'm developing an web application right now.
What I have so far in the app is this:
<input type="text" id="textToSendToMyGoogleDrive"/>
<button id="upload file to google drive"> Send </button>
This application has a domain, so every one can go to this application from their computer.
What I want to do is when any user put text in the input, and clicks the button, it will make a txt file and send it into my google drive account.
So I have two problems here:
How to take the text and make from it a txt file.
Send the file to specific google drive account.
Problem number 2 is a problem because I have looked every where in the google drive API, and all I could found is some methods to upload files to the user's google drive, and not to mine. So I tried to search out how to "sign in" the user when he is in the application to my google drive, and I could not find a solution.
If I was not clear on the problems, comment me.
Thank you!

I'am not a expert but correct me if I'am wrong. I think there is a problem with your approach. how about sending your text content as a request parameter to the backend and save it as a .txt from there.
I am suggesting this because,
let say you save your file with text content in users computer as described in here.
next step would be to access it from the browser and save it in the google drive. if you planning to do it from the front end without a backend, you have to expose your google credentials to every user.
Before that you wont be able to access a local file from users computer directly from the browser. because most browsers wont allow you to do that. so please change your approach to this.

Related

How to edit pdf stored in a server by a webapp client?

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...

Transfer files between google-drive and one drive

I have more than 10TB of content in my google shared drive I want to copy all that content in my onedrive account. I tried mover.io but it's not working for me. What should I do. Also tried google colab but I couldn't find great code of python
It's been 2nd day and I couldn't find anything that works properly and fast.
I don't want to use any 3rd-party mover like multi-cloud ...
Create a temporary RDP through GitHub action, in that RDP you will get a high-speed internet connection, download the file in it, and upload it to onedrive.
you can also use rabb.it

Can Google Picker API be used to save file from a URL to Google Drive?

I would like to create a website which enables users to save a web file to their Google Drive Account. User has to paste the URL of the file and upon submitting the file will be saved to user's Google Drive account. This website offers such a functionality (not necessarily from Picker API). I would like to replicate it. How it could be done?
Not necessarily the Google Picker API but you may want to try the Save to Drive Button feature of Google Drive API. This feature enables your web site to allow users to save files to their Drive account from an arbitrary URL via their browser. The button is configured with a few attributes in a div tag in the HTML markup, similar to how the +1 button is created.
The simplest way to display a Save to Drive button on your page is to include the necessary JavaScript resource and to add the Save to Drive button tag:
<script src="https://apis.google.com/js/platform.js" async defer></script>
<div class="g-savetodrive"
data-src="//example.com/path/to/myfile.pdf"
data-filename="My Statement.pdf"
data-sitename="My Company Name">
</div>
For more detailed information and examples, please try going through the given link.
Hope that helps! Cheers!

How can my web app user click a button to play a locally stored mp3 file?

I'd like to allow my users to click a button in a list of tunes on a page to open a simple mp3 player (the HTML5 Player is fine) that can play a downloaded mp3 track for that song that is stored on the user's hard drive. Is that even possible? Every attempt I've tried - using HTML and/or JS, JQ - fails.
I can copy the local mp3 file path/filename into my Chrome address bar. With no code at all it helpfully opens an HTML5 player in a new tab that allows me to play the tune just fine. Why is it so difficult to allow the user to do the same thing by simply clicking a button inside my app?
I have been able to get an mp3 player to appear on the page. But no matter how I specify the file path it refuses to play the tune - occasionally telling me my code is not allowed to access local files.
For security reasons, Javascript does not have the privilege to modify files, or even open files on the client machine.
If that is absolutely what you want to accomplish, try to use a JAVA Applet.
Thanks Lyes Ben. Over the last few days thinking about your comments has helped me understand that what I was attempting was not the right approach - and why. After some research I now believe that using the DropBox api I can code a simple 'drop-in-saver' function that would not only automatically save the files locally that my user would generate through the app, but would at the same time, provide another feature that was on my list - it would give the user offline access to those files. As a bonus the files would be synced on all the user's devices, with no additional code or complexity in the app.
Sometimes I get so focused on solving a particular technical problem that I fail to step back and ask if it is the right problem to solve in the first place.
It's not done yet but I'm now working on that DropBox interface to my app. I'll update this answer when (if) I get there as I suspect this could be a solution in some cases for others facing a similar problem.

Script that uploads users file from an exact location

Working on a project where we're using an XML of a user's iTunes tracks and play lists to integrate into other services. On Mac, this file is stored in the default location at /Users/username/Music/iTunes/iTunes Library.xml . Since we need users to be able to upload their own XML file, is there a way to write a script that pulls the file from that location as soon as they click an upload button (saving them from having to search and find it each time)? If so, is this something that can be done through Javascript (or through Rails, since we're using that as well)?
Thanks!
If you mean on a browser, no, you can't. The user has to select the file, you can't pre-select it for them. It's a security measure. If a web page could pre-select the file in an input type="file", it would be trivial to auto-submit that form, or hide the input and trick the user into submitting the form, or read the file via the File API and send it to a server — in all cases, stealing a file from the user's machine without their knowledge or consent.

Categories