CODEWITHSUNDEEP
javascripthtmlupload
schlingel
schlingel

Reputation: 8575

File-Upload via local file path

Is there a way for enabling file upload via file path?

The default HTML file upload control displays a disabled textbox and a button. Is it possible via JS or something to upload a file when the user pastes the path to the file into a textbox?

This webpage is within a corporate intranet.

Upvotes: 4

Views: 6825

Answers (3)

DevXtranet
DevXtranet

Reputation: 39

I have done the file uploading using below code in electron app

  if (window.FormData !== undefined) {
              var formData = new FormData();
              let response = await fetch(path); // give local file path stored at appdata folder
              let data = await response.blob();          
              formData.append("file", new File([data], "YourfileName"))
              let _url = "api/webservice url";
              $.ajax({
                type: "POST",
                url: _url,
                contentType: false,
                processData: false,
                data: formData,
                success: function (result) {              
                  console.log(result);
                },
                error: function (xhr, status, p3, p4) {                  
                  var err = "Error " + " " + status + " " + p3 + " " + p4;
                  if (xhr.responseText && xhr.responseText[0] == "{")
                    err = JSON.parse(xhr.responseText).Message;
                  console.log(err);
                }
              });
            } else {
              alert("This browser doesn't support HTML5 file uploads!");
            }

At server side (C# Code)

var provider = new MultipartMemoryStreamProvider();
await Request.Content.ReadAsMultipartAsync(provider);
    
// extract file name and file contents
var fileNameParam = provider.Contents[0].Headers.ContentDisposition.Parameters
                    .FirstOrDefault(p => p.Name.ToLower() == "filename");
string fileName = (fileNameParam == null) ? "" : ileNameParam.Value.Trim('"');
var divs = fileName.Split('.').ToList();
var ext = divs.LastOrDefault();
byte[] file = await provider.Contents[0].ReadAsByteArrayAsync();
// Here you can use EF with an entity with a byte[] property, or
// an stored procedure with a varbinary parameter to insert the
// data into the DB
var fileVM = new FileViewModel
{
 AttachmentType = AttachmentTypeEnum.File,
 FileName = fileName,
 FileExtension = ext,
 ContentType = MimeMapping.GetMimeMapping(fileName),
 ContentLength = file.Length,
 ContentByte = file,
};

Upvotes: 0

Sascha Galley
Sascha Galley

Reputation: 16091

There are some small possibilities to do that within a trusted network. Not exactly the same, but still a very similar question: Local file access with javascript

Upvotes: 1

Shadow Wizard
Shadow Wizard

Reputation: 66389

No, such thing is not possible in web application using ordinary HTML/JavaScript - period.

The one and only way for user to choose file is via the file dialog opened by clicking the browse button of the <input type="file" /> element.

The only shortcut possible is that JS can open the file dialog automatically, but still - that's the only way for user to choose what file to upload.

Upvotes: 3

Related Questions