Как я могу иметь кнопку «Экспортировать как CSV» в расширении Chrome?

Question

Я создал расширение Chrome, которое сканирует страницу и создает список тегов h1-h6 текущей страницы во всплывающем окне. Вот как выглядит этот список для главной страницы StackOverflow:

h1 | All Questions
h3 | XmlElement has a list as attribute but its items aren't separated by comma
h3 | Eclipse, Easily remove/fix all @Override due to Java version change
...

Я хотел бы иметь кнопку «Экспорт», которая дала бы мне возможность сохранить этот отчет в формате CSV. Возможно ли это?

Answer 1

Вы можете использовать схему URI данных , чтобы создать URI, хранящий содержимое CSV. Затем вы можете создать элемент A с атрибутом загрузки , установленным на желаемое имя файла.

Если ваш CSV действительно большой, вы должны использовать BlobBuilder и webkitURL.createObjectURL вместо схемы URI данных для создания ссылки href.

Вот пример использования схемы URI данных:

var link = document.createElement("a");
link.textContent = "Save as CSV";
link.download = "file.csv";
link.href = "data:text/csv,h1;All Questions\n"
document.body.appendChild(link);

Когда пользователь нажимает на ссылку, файл «file.csv» автоматически сохраняется в папке загрузки по умолчанию.