Javascript переименовать файл при загрузке

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

Ex: Файл: http://<server>/<site>/test.txt

и когда я нажимаю, чтобы загрузить файл, откройте диалоговое окно загрузки с именем файла: test001.txt.

Как я могу это достичь?

Ответ 1

Как предлагает InviS, теперь есть атрибут download в ссылках.

Пример:

<a href="http://server/site/test.txt" download="test001.txt">Download Your File</a>

спецификация
статья
поддержка браузера (Chrome, FF, Opera, Android Browser >= 4.4.4 на момент написания)

Ответ 2

Этот эффект достигается путем отправки дополнительного заголовка. Например, вы можете использовать PHP, чтобы достичь этого:

URL-адреса можно переписать с помощью .htaccess (внутренне) перенаправления запроса в файл PHP. Я покажу простой пример с жестким кодом, как настроить заголовок:

<?php
    header('Content-type: text/plain');
    header('Content-Disposition: attachment; filename="test001.txt"');
    readfile('files/test.txt');
     //assuming that the files are stored in a directory, not in a database
?>

Ответ 3

Используйте атрибут download ссылки. Но он работает только в браузере Chrome:)

Ответ 4

Вы не можете сделать это в Javascript. Диалоговое окно "Сохранить в" открыто браузером, и вы не можете получить доступ к нему через JS, это стандартный диалог из ОС.

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

Какая причина, по которой вы хотите переименовать загруженный файл?

Ответ 5

Если вы хотите вернуть непрерывный тип имени файла, вам нужно написать script, который будет отслеживать это и предоставлять этот файл пользователю. Один из способов - использовать простой PHP или что-то более продвинутое, если это несколько файлов за раз, возможно, вызов cURL в php, чтобы он мог генерировать несколько разных файлов. Я предполагаю, что это то, что вы ищете, но вы не можете динамически изменять имя файла в поле сохранения в этом смысле, вы возвращаете имя файла savename.txt.

Ответ 6

Вы можете использовать атрибут загрузки в теге ссылки <a href="#" onclick="location.href='http://server/site/test.txt'; return false;" download="test001.txt">Download Your File</a>

Однако, когда заголовок размещения содержимого установлен в ответе сервера, он будет игнорировать атрибут загрузки, а в качестве имени файла будет указано имя файла в заголовке ответа размещения содержимого

Вы можете сделать это с помощью axios или любой другой выборки, выполнив это:

const downloadAs = (url, name) => {
  Axios.get(url, {
    headers: {
      "Content-Type": "application/octet-stream"
    },
    responseType: "blob"
  })
    .then(response => {
      const a = document.createElement("a");
      const url = window.URL.createObjectURL(response.data);
      a.href = url;
      a.download = name;
      a.click();
    })
    .catch(err => {
      console.log("error", err);
    });
};

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

downloadAs('filedownloadlink', 'newfilename');

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