Fakepath при загрузке файла как исправить

03 нояб 2021 11:21 #19445
от zhukcbs

Пожалуйста Войти или Регистрация, чтобы присоединиться к беседе.

03 нояб 2021 13:09 — 03 нояб 2021 14:35 #19447
от Gvinpin

Спасибо сказали: zhukcbs

Пожалуйста Войти или Регистрация, чтобы присоединиться к беседе.

03 нояб 2021 17:02 — 03 нояб 2021 17:03 #19448
от FarWinter

Спасибо сказали: zhukcbs

Пожалуйста Войти или Регистрация, чтобы присоединиться к беседе.

03 нояб 2021 18:19 — 03 нояб 2021 18:32 #19449
от zhukcbs

Пожалуйста Войти или Регистрация, чтобы присоединиться к беседе.

04 нояб 2021 08:16 — 04 нояб 2021 08:37 #19450
от Alex67

Спасибо сказали: zhukcbs

Пожалуйста Войти или Регистрация, чтобы присоединиться к беседе.

04 нояб 2021 08:55 #19451
от zhukcbs

Пожалуйста Войти или Регистрация, чтобы присоединиться к беседе.

08 нояб 2021 12:16 #19458
от ranger

Пожалуйста Войти или Регистрация, чтобы присоединиться к беседе.

24 фев 2022 16:50 — 24 фев 2022 16:51 #20377
от Татьянка

Пожалуйста Войти или Регистрация, чтобы присоединиться к беседе.

24 фев 2022 17:37 #20378
от Alex_04

Спасибо сказали: Татьянка

Пожалуйста Войти или Регистрация, чтобы присоединиться к беседе.

<input type="file" id="file-id" name="file_name" onchange="theimage();">

Это моя кнопка загрузки.

<input type="text" name="file_path" id="file-path">

Это текстовое поле, в котором я должен показать полный путь к файлу.

function theimage(){
var filename = document.getElementById('file-id').value;
document.getElementById('file-path').value = filename;
alert(filename);
}

Это JavaScript, который решает мою проблему. Но в значении предупреждения дает мне

C:fakepathtest.csv

и Мозилла дает мне:

test.csv

Но я хочу местный полный путь к файлу. Как решить эту проблему?

Если это связано с проблемой безопасности браузера, каким должен быть альтернативный способ сделать это?

200

Некоторые браузеры имеют функцию безопасности, которая не позволяет JavaScript знать локальный полный путь вашего файла. Это имеет смысл — как клиент, вы не хотите, чтобы сервер знал файловую систему вашего локального компьютера. Было бы хорошо, если бы все браузеры сделали это.

146

использование

document.getElementById("file-id").files[0].name;

вместо

document.getElementById('file-id').value

52

Если вы зайдете в Internet Explorer, Сервис, Интернет, Безопасность, Пользовательский, найдите «Включить путь к локальному каталогу при загрузке файлов на сервер» (это довольно далеко) и нажмите «Включить». Это будет работать

37

Я использую объект FileReader на входе onchange событие для вашего типа входного файла! В этом примере используется функция readAsDataURL, и по этой причине у вас должен быть тег. Объект FileReader также имеет readAsBinaryString для получения двоичных данных, которые впоследствии можно использовать для создания того же файла на вашем сервере.

Пример:

var input = document.getElementById("inputFile");
var fReader = new FileReader();
fReader.readAsDataURL(input.files[0]);
fReader.onloadend = function(event){
var img = document.getElementById("yourImgTag");
img.src = event.target.result;
}

33

Я рад, что браузеры заботятся о том, чтобы спасти нас от навязчивых сценариев и тому подобного. Я не доволен тем, что IE помещает в браузер что-то, что делает простое исправление стиля похожим на хак-атаку!

Я использовал < span> для представления файла-ввода, чтобы я мог применить соответствующий стиль к < div> вместо < вход> (еще раз, из-за IE). Теперь из-за этого IE хочет показать пользователю путь со значением, которое гарантированно защитит его и в крайнем случае (если не полностью отпугнет?!) … БОЛЬШЕ IE-CRAP!

В любом случае, спасибо тем, кто разместил объяснение здесь: IE Browser Security: добавление «fakepath» к пути к файлу во входных данных [type = «file»], Я собрал небольшой верхний фиксатор …

Приведенный ниже код выполняет две вещи: он исправляет ошибку IE8, из-за которой событие onChange не срабатывает, пока в поле загрузки не отображается onBlur, и обновляет элемент с очищенным путем к файлу, который не пугает пользователя.

// self-calling lambda to for jQuery shorthand "$" namespace
(function($){
// document onReady wrapper
$().ready(function(){
// check for the nefarious IE
if($.browser.msie) {
// capture the file input fields
var fileInput = $('input[type="file"]');
// add presentational <span> tags "underneath" all file input fields for styling
fileInput.after(
$(document.createElement('span')).addClass('file-underlay')
);
// bind onClick to get the file-path and update the style <div>
fileInput.click(function(){
// need to capture $(this) because setTimeout() is on the
// Window keyword 'this' changes context in it
var fileContext = $(this);
// capture the timer as well as set setTimeout()
// we use setTimeout() because IE pauses timers when a file dialog opens
// in this manner we give ourselves a "pseudo-onChange" handler
var ieBugTimeout = setTimeout(function(){
// set vars
var filePath     = fileContext.val(),
fileUnderlay = fileContext.siblings('.file-underlay');
// check for IE's lovely security speil
if(filePath.match(/fakepath/)) {
// update the file-path text using case-insensitive regex
filePath = filePath.replace(/C:\fakepath\/i, '');
}
// update the text in the file-underlay <span>
fileUnderlay.text(filePath);
// clear the timer var
clearTimeout(ieBugTimeout);
}, 10);
});
}
});
})(jQuery);

11

Я столкнулся с той же проблемой. В IE8 это можно обойти, создав скрытый ввод после элемента управления вводом файла. Заполните это значением предыдущего брата. В IE9 это было исправлено.

Причиной, по которой я хотел узнать полный путь, было создание предварительного просмотра изображения javascript перед загрузкой. Теперь мне нужно загрузить файл, чтобы создать предварительный просмотр выбранного изображения.

6

Если вам действительно нужно отправить полный путь к загруженному файлу, вам, вероятно, придется использовать что-то вроде подписанного Java-апплета, поскольку нет способа получить эту информацию, если браузер не отправляет ее.

3

99

Manwal
22 Сен 2015 в 13:08

60

Komal12
10 Авг 2017 в 08:08

36

saikiran1043
26 Окт 2011 в 11:49

вместо (еще раз, из-за IE). Теперь из-за этого IE хочет показать пользователю путь со значением, которое гарантированно защитит его и, по крайней мере, напугает (если не полностью отпугнет?!) … БОЛЬШЕ IE-CRAP!

В любом случае, спасибо тем, кто разместил объяснение здесь: Безопасность браузера IE: добавление «fakepath» к пути к файлу в input[type=»file»], я собрал небольшое исправление-верхнее…

Приведенный ниже код выполняет две вещи: он исправляет ошибку IE8, из-за которой событие onChange не срабатывает, пока в поле загрузки не появляется onBlur, и обновляет элемент с очищенным путем к файлу, который не пугает пользователя.

// self-calling lambda to for jQuery shorthand "$" namespace
(function($){
    // document onReady wrapper
    $().ready(function(){
        // check for the nefarious IE
        if($.browser.msie) {
            // capture the file input fields
            var fileInput = $('input[type="file"]');
            // add presentational <span> tags "underneath" all file input fields for styling
            fileInput.after(
                $(document.createElement('span')).addClass('file-underlay')
            );
            // bind onClick to get the file-path and update the style <div>
            fileInput.click(function(){
                // need to capture $(this) because setTimeout() is on the
                // Window keyword 'this' changes context in it
                var fileContext = $(this);
                // capture the timer as well as set setTimeout()
                // we use setTimeout() because IE pauses timers when a file dialog opens
                // in this manner we give ourselves a "pseudo-onChange" handler
                var ieBugTimeout = setTimeout(function(){
                    // set vars
                    var filePath     = fileContext.val(),
                        fileUnderlay = fileContext.siblings('.file-underlay');
                    // check for IE's lovely security speil
                    if(filePath.match(/fakepath/)) {
                        // update the file-path text using case-insensitive regex
                        filePath = filePath.replace(/C:\fakepath\/i, '');
                    }
                    // update the text in the file-underlay <span>
                    fileUnderlay.text(filePath);
                    // clear the timer var
                    clearTimeout(ieBugTimeout);
                }, 10);
            });
        }
    });
})(jQuery);

Я столкнулся с той же проблемой. В IE8 это можно обойти, создав скрытый ввод после контроля ввода файла. Заполните это значением предыдущего брата. В IE9 это было исправлено.

Причиной, по которой я хотел узнать полный путь, было создание предварительного просмотра изображения javascript перед загрузкой. Теперь мне нужно загрузить файл, чтобы создать предварительный просмотр выбранного изображения.

Если вам действительно нужно отправить полный путь к загруженному файлу, вам, вероятно, придется использовать что-то вроде подписанного Java-апплета, поскольку нет способа получить эту информацию, если браузер не отправляет ее.

Используйте программы для чтения файлов:

$(document).ready(function() {
        $("#input-file").change(function() {
            var length = this.files.length;
            if (!length) {
                return false;
            }
            useImage(this);
        });
    });

    // Creating the function
    function useImage(img) {
        var file = img.files[0];
        var imagefile = file.type;
        var match = ["image/jpeg", "image/png", "image/jpg"];
        if (!((imagefile == match[0]) || (imagefile == match[1]) || (imagefile == match[2]))) {
            alert("Invalid File Extension");
        } else {
            var reader = new FileReader();
            reader.onload = imageIsLoaded;
            reader.readAsDataURL(img.files[0]);
        }

        function imageIsLoaded(e) {
            $('div.withBckImage').css({ 'background-image': "url(" + e.target.result + ")" });

        }
    }

В приложениях на основе Chrome/Chromium, таких как электрон, вы можете просто использовать target.files:

(в этом примере я использую React JS)

const onChange = (event) => {
  const value = event.target.value;

  // this will return C:fakepathsomefile.ext
  console.log(value);

  const files = event.target.files;

  //this will return an ARRAY of File object
  console.log(files);
}

return (
 <input type="file" onChange={onChange} />
)

File object, о котором я говорю выше, выглядит так:

{
  fullName: "C:UsersmynameDownloadssomefile.ext"
  lastModified: 1593086858659
  lastModifiedDate: (the date)
  name: "somefile.ext"
  size: 10235546
  type: ""
  webkitRelativePath: ""
}

Итак, вы можете просто получить fullName, если хотите получить путь.

Обратите внимание, что это будет работать только в браузерах Chrome/Chromium, поэтому, если вам не нужно поддерживать другие браузеры (например, если вы создаете электронный проект), вы можете использовать это.

Вы сможете получить хотя бы временно созданную копию пути к файлу на вашем компьютере. Единственным условием здесь является то, что ваш элемент ввода должен находиться в форме. Что вам нужно сделать еще, так это ввести в форму атрибут enctype, например:

<form id="formid" enctype="multipart/form-data" method="post" action="{{url('/add_a_note' )}}">...</form>

вы можете найти строку пути внизу. Он открывает поток в файл, а затем удаляет его.

Здесь, в моем случае, я использую среду разработки asp.net, поэтому я хотел загрузить эти данные в асинхронном ajax-запросе, в [webMethod] вы не можете перехватить загрузчик файлов, так как он не является статическим элементом, поэтому мне пришлось сделайте оборот для такого решения, исправив путь, затем преобразуйте искомое изображение в байты, чтобы сохранить его в БД.

Вот моя функция JavaScript, надеюсь, она вам поможет:

function FixPath(Path)
         {
             var HiddenPath = Path.toString();
             alert(HiddenPath.indexOf("FakePath"));

             if (HiddenPath.indexOf("FakePath") > 1)
             {
                 var UnwantedLength = HiddenPath.indexOf("FakePath") + 7;
                 MainStringLength = HiddenPath.length - UnwantedLength;
                 var thisArray =[];
                 var i = 0;
                 var FinalString= "";
                 while (i < MainStringLength)
                 {
                     thisArray[i] = HiddenPath[UnwantedLength + i + 1];
                     i++;
                 }
                 var j = 0;
                 while (j < MainStringLength-1)
                 {
                     if (thisArray[j] != ",")
                     {
                         FinalString += thisArray[j];
                     }
                     j++;
                 }
                 FinalString = "~" + FinalString;
                 alert(FinalString);
                 return FinalString;
             }
             else
             {
                 return HiddenPath;
             }
         }

Здесь только для тестирования:

 $(document).ready(function () {
             FixPath("hakounaMatata:/7ekmaTa3mahaLaziz/FakePath/EnsaLmadiLiYghiz");
         });
// this will give you : ~/EnsaLmadiLiYghiz

В некоторых браузерах есть функция безопасности, которая не позволяет JavaScript узнать полный локальный путь к вашему файлу. Это имеет смысл — как клиент вы не хотите, чтобы сервер знал файловую систему вашей локальной машины. Было бы неплохо, если бы это делали все браузеры.

Дополняя использование ответа Сардеша Шармы:

document.getElementById("file-id").files[0].path

Для полного пути.

Столкнулся со следующей проблемой:

Когда пользователь загружает файл с вводом файла HTML, а затем я хочу получить сам путь к файлу. У меня, например, есть только C:/fakepath/filename.txt.

Я понимаю, что браузеры должны знать точный путь к файлу в целях безопасности. Поэтому мне было интересно, возможно ли это с помощью какого-то взлома, каким-то образом в .net или с дополнительным плагином jquery / js, чтобы получить полный путь к файлу.

Почему?

Мы не хотим загружать сам файл ни в файловую систему нашего сервера, ни в базу данных. Мы просто хотим сохранить локальный путь в базе данных, чтобы, когда тот же пользователь открывает сайт, он может щелкнуть по этому пути, и его локальная файловая система откроется.

Любые предложения или рекомендации по этому подходу?

Если это действительно невозможно, например

Как разрешить путь C: fakepath?

Как получить реальный путь к файлу с помощью JQuery

Я думаю, нам нужно было бы придумать другую идею. Но поскольку некоторые ответы действительно старые, я подумал, что, может быть, к настоящему времени есть решение. Спасибо всем

Перейти к ответу
Данный вопрос помечен как решенный

Для этого вам понадобится ваш собственный код, работающий вне окна браузера, поскольку браузеры не допускают этого.

Я имею в виду что-то уродливое, например ActiveX, flash, COM-объект, настраиваемое расширение браузера или другое причудливое нарушение безопасности, которое может открыть собственный OpenFileDialog и вставить это значение в поле ввода.

Вы не можете этого сделать.

И если вы найдете способ, это большая уязвимость системы безопасности, которую производитель браузера исправит при обнаружении.

Поскольку моей целью было сделать имя загруженного файла видимым для конечного пользователя, а затем отправить его с помощью функции php mail (), все, что я сделал, чтобы решить эту проблему, было:

В вашем js файле

Old function:

var fileuploadinit = function(){
    $('#career_resume').change(function(){
        var pathwithfilename = $('#career_resume').val();
        $('.uploadedfile').html("Uploaded File Name :" + pathwithfilename).css({
            'display':'block'
        });
    });
};

Corrected function:

var fileuploadinit = function(){
    $('#career_resume').change(function(){
        var pathwithfilename = $('#career_resume').val();
        var filename = pathwithfilename.substring(12);
        $('.uploadedfile').html("Uploaded File Name :" + filename).css({
            'display':'block'
        });
    });
};
$(document).ready(function () {
fileuploadinit();
});

Старый результат:

Uploaded File Name :C:fakepathCoverpage.pdf

Новый результат:

Uploaded File Name :Coverpage.pdf

Надеюсь, поможет