Можно ли использовать любую причудливость HTML5 для экспорта локального хранилища в Excel?

Этот вопрос аналогичен, но не указывает на какие-либо возможности для экспорта< /em> данные. Мысли?


person Alex Mcp    schedule 20.07.2010    source источник


Ответы (2)


Я думаю, вы неправильно понимаете ответ на вопрос, на который вы ссылаетесь, он предлагает вам использовать URI данных для экспорта.

Excel — довольно сложная цель, поскольку сам формат файла является двоичным (или OOXML). Если вам просто нужно что-то, что открывается в Excel, вы можете экспортировать более простой CSV-файл в виде URI данных. Следующий код немного грубый и готовый, он был протестирован только в Firefox:

function exportData() {
    var data = '';
    for (var i=1;i<=2;i++) {
        var sep = '';
        for (var j=1;j<=4;j++) {
            data +=  sep + document.getElementById(i + '_' + j).value;
            sep = ',';
        }
        data += '\r\n';
    }
    var exportLink = document.createElement('a');
    exportLink.setAttribute('href', 'data:text/csv;base64,' + window.btoa(data));
    exportLink.appendChild(document.createTextNode('test.csv'));
    document.getElementById('results').appendChild(exportLink);
}

Вот разметка страницы:

<input type="number" id="1_1" value="2">,
<input type="number" id="1_2" value="1">,
<input type="number" id="1_3" value="4">,
<input type="number" id="1_4" value="3">
<br>
<input type="number" id="2_1" value="1">,
<input type="number" id="2_2" value="2">,
<input type="number" id="2_3" value="3">,
<input type="number" id="2_4" value="4">
<br>
<button onclick="exportData()">Export as CSV</button>
<div id="results"></div>

Демо здесь. Нажимаешь кнопку получаешь ссылку, нажимаешь ссылку и получаешь файл. Измените значения, нажмите ссылку еще раз, и вы получите другой файл. Firefox заставлял меня каждый раз выбирать Excel, чтобы открыть его, но я не знаю, моя ли это конфигурация или общая проблема.

CSV в Excel 2007
(источник: boogdesign.com)

Как я уже сказал, тестировался только в Firefox и будет работать только в браузерах, поддерживающих URI данных. . Вам также понадобится функция window.btoa(). или реализовать собственный кодер base64.

person robertc    schedule 20.07.2010
comment
Интересный. Когда я открываю результат в Excel, я получаю две ячейки: A1 («2,1,4,3») и A2 («1,2,3,4»). Таким образом, он распознает строки, но не столбцы. Спасибо за начало (и вы правы насчет связанного вопроса, это не совсем правильный ответ для экспорта) - person Alex Mcp; 20.07.2010
comment
@AlexMcp Может быть, это зависит от того, какую версию Excel вы используете? Я добавил скриншот того, что я вижу в Excel 2007 - person robertc; 20.07.2010
comment
Хорошая концепция, кажется, я помню, как читал об атрибутах, имеющих довольно низкий лимит символов в спецификациях SGML/HTML. sharovatov.wordpress.com/2008/05/13/data -uri-browser-issues содержит некоторую важную информацию, но стоит отметить: разные браузеры имеют разную максимальную длину поддерживаемых значений dataURI. - person Chris Farmiloe; 25.02.2011
comment
Работает и в Google Chrome в Windows 7, но браузер не знает, что тип файла CSV, поэтому не связывает его автоматически с Excel, вам нужно поискать и указать, какой программой открыть файл. - person hippietrail; 08.08.2012
comment
Вы можете использовать data:text/csv;charset=utf-8,content_encoded_as_url, чтобы избежать зависимости от window.btoa, а также добавить к ссылке download="test.csv", используя exportLink.setAttribute('download', 'test.csv');, чтобы указать имя файла в браузере. - person Sujay; 18.12.2012

Я не знаю ни одной библиотеки Javascript, которая может создать файл Excel. Но вы можете просто экспортировать его как HTML или CSV — обратите внимание, что Javascript не может создавать файлы (пока), но рабочий проект HTML позволяет это сделать: http://www.w3.org/TR/file-Writer-api/

Excel довольно хорошо читает таблицы, созданные в HTML, поэтому вы можете просто сделать это и открыть HTML-файл в Excel.

Вы можете создать файл для загрузки с помощью Downloadify: https://github.com/dcneiner/Downloadify

person Vincent McNabb    schedule 20.07.2010
comment
Я думаю о том, чтобы пользователь просто копировал/вставлял. Это не коммерческий продукт, а просто утилита, так что, может быть, можно спросить у людей. Я надеялся на крутой HTML5 API, который... не знаю, творил чудеса или что-то в этом роде... - person Alex Mcp; 20.07.2010
comment
Если вы переместите свое внимание на серверную сторону, вы можете вывести пользовательский тип MIME по вашему выбору. CSV — это простой способ экспорта данных в Excel. - person Rob Gibbons; 20.07.2010
comment
Да, это частично эксперимент, чтобы пользователям не требовался локальный сервер для получения данных из Интернета. Очевидно, это тривиально в PHP или что у вас... - person Alex Mcp; 21.07.2010