I'm using eel to create a simple but clean GUI to my project. In this project, I have a custom database which I pickle/update/unpickle when needed. From local webserver, I select the file and click the submit button. Then I pass the file directory to later read in python script. The structure I have is as follows;
HTML
I have two simple elements, one button and one input
<input type="file" id="file-upload">
<input class="btn btn-success" type="submit" onClick="get_input_directory()" value="Send">
JS
function get_input_directory() {
var data = document.getElementById("file-uploader").value
eel.get_input(data)
}
Python
And for the moment I just print the directory If I got it right.
#eel.expose
def get_input(data):
print(data)
And what I planned to do later was to use the script down to unpickle database into my program:
with open(file_dir, "rb") as f:
mdl = pickle.load(f)
return mdl
But my database file is printed as:
C:/fakepath/database.file
I searched the web and found out that this is a security measure that browser implemented but I tried FileReader method to pass the file directly into the unpickling function but that also failed saying that no such file exists.
What should I use for this problem, or is there a way to pass the directory into the python script which would be much easier since the backend is pretty much done for project. Any help is appreciated. Thanks in advance!
This has to do with JS not having full exist to your computer.
Best to do is add the file handler in python/eel.
Because python does has full access to the path of your computer:
#eel.expose
def btn_ResimyoluClick():
root = Tk()
root.withdraw()
root.wm_attributes('-topmost', 1)
folder = filedialog.askdirectory()
return folder
Copied from:
https://github.com/samuelhwilliams/Eel/issues/86
Related
I recently made a Python app where I take an Excel file, convert it to a CSV file, and then shoot it out with an Email. I tried turning this application into a Web App and here is where issues arose. In order to send the a file using Email, I need to get the full file path and I am not sure how to get it. In order to let the user pick out the file, I used <input type="file">, but this only supplies me with the name of the file and not the actual file path. Any suggests on what I should do to fix this issue?
Use the os module in python.
import os
os.path.abspath('/path/to/file')
I'm trying to make a simple webpage that you can input a directory path in and it lists all the files in that directory. Is there a way I can do that directly in the .html file with js script? I have the path as a variable.
I'm very new to these programmin languages and don't know much about these.
A webpage does not have access to a client's file system. No website can see your files.
However, if you're talking about server side javascript, that's different. Server side javascript file listing can be achieved through this:
var fs = require('fs');
var files = fs.readdirSync('/assets/photos/');
Reference: Get list of filenames in folder with Javascript
Hope that helps
EDIT 1 (upload files with html):
You need to be more specific. But i will supose that you want to navigate into files for upload some file on your webpage:
You could do this and when you press the button you will can navigate in your files and select as you want:
<input type="file" name="" id="">
EDIT 2 (using server languages for working with files):
First step: you need a lenguage server as php or nodejs (it use internally javascript chromev8). I recomend you to use nodejs becose its easier for people who already know javascript.
If you wanna nodejs, install it:
https://nodejs.org/en/ .
If you wanna php you can install apache xampp that also install a version of mysql database:https://www.apachefriends.org/index.html
Second step: working with files:
php https://www.php.net/manual/en/intro.dio.php
nodejs: https://nodejs.org/api/fs.html#fs_file_system (you will need to know about synchronous and asynchronous programming).
I want to move a file I select from input to a folder "uploads" without using php. I just want to use JQuery or JS.
I have this HTML code:
<input id="attachmentFile" name="attachmentFile" type="file">
<button type="button" id="btnUpload" name="btnUpload">UploadAttachment</button>
The JQuery Function is:
$('#btnUpload').on('click', function() {
var file = $("#attachmentFile")[0].files[0];
files.Move("/uploads");
});
Can someone help me out?
You will need a server side system. If you would want to stay in JS, Node.js (on the server side!!!) would give you great possibilities. It provides a core module for Filesystem operations and a Core HTTP Module for handling Requests. Sorry for my English, but I hope that will give you a direction.
I want to create a SignalR client in JavaScript. Am not using any HTML files(its not a web application).My intention is to create ".js" file and connect to the SignalR hub and subscribe to the events,and when the events got triggered I want to output the data to a console.
So how can I refer "signalR-2.1.0.min.js" in my plain .js file.
<script src="Scripts/signalR-2.1.0.min.js"></script>
The above way of reference works only with HTML files.This is working fine in my web application.
But if I want to run a ".js" file for the same purpose (as a SignalR client without html files)how can I add reference to this "signalR-2.1.0.min.js" file?
Thanks In Advance
Susmitha
If you your using Node.js, you can just use require:
const myFile = require('./myScript.js');
I am trying to Upload several files at once to Google Drive using Google app script.
I have created an upload.html page that contain -
<input type="file" name="myFile" id="file-select" multiple/>
But I need to change more stuff in the JavaScript part either, and i got no idea what to change and i haven't find a documentation about the issue.
I need to deal with each file separately in the 'Code.gs' file.
For example:
In the .gs file I got
var file = form.myFile;
But unfortunately this refers to the first file I uploaded and not to all of them.
How do i refer all of them?
The question is still relevant.
Thanks in advance to anyone that can help!
I'm wondering if Caja is somehow not allowing the multiple file ability for the Input element. Caja is a sanitation program used on the HTML.
Google Caja Developers Page
If you look at this documentation:
Mozilla Documentation - File List
You should be able to access all the file name in the INPUT element, and iterate the contents.
Loop through all the files in the INPUT element using client side code instead of Google .gs server side code.
// Get all the files out of the INPUT element
var fileInput = document.getElementById("file-select");
console.log('fileInput: ' + fileInput);
// files is a FileList object (similar to NodeList)
var files = fileInput.files;
console.log('files: ' + files);
But, I'm getting an error msg in the console log that files variable is undefined.
The HTML <input> tag, configured to be a file picker, puts the names of the files into an object. The information in the object needs to somehow get passed to the .gs file. Because the file picker can choose multiple files, the code needs to process multiple files. You could upload the files one after the other, looping through all of them one at a time, or somehow run asynchronous code. A .gs script can start uploading a second file before the first one is done. It's faster to be uploading multiple files at the same time rather than having the code wait to upload the next file before the current one is done.
You can run a .gs script directly from a submit button:
<input type="button" value="Submit"
onclick="google.script.run.withSuccessHandler(gsFunctionName).processForm(this.parentNode)" />
Or run JavaScript in an HTML tag, which then runs the .gs server side code:
<form onsubmit="fncMyClientSideCode(this)" id="idUploadForm">
<input>
<button type="submit" id="btnUpload">Upload Now!</button>
</form>
<script>
window.fncMyClientSideCode = function(objArgPassed) {
//my statements here
google.script.run.withFailureHandler(onUploadFail)
.withSuccessHandler(onRegSccss)
.fncUploadFiles(objArgPassed);
}
</script>
I'm showing a couple different ways to use the HTML just for general information. You need to modify it for your use, test and debug it.
That's just the beginning. You need to know how to access the information in the object, write code to loop through each file, save it to a specific folder maybe. There are lots of questions dealing with saving files to Google Drive with Apps Script.