Jak mogę wyeksportować tabele do programu Excel ze strony internetowej [zamknięte]


97

Jak mogę wyeksportować tabele do programu Excel ze strony internetowej. Chcę, aby eksport zawierał całe formatowanie i kolory.


9
Najłatwiejszym sposobem jest prawdopodobnie wyeksportowanie dokumentu HTML, który można otworzyć w programie Excel.
Pekka

@Pekka Próbowałem, traci całe formatowanie / css / rozmiar kolumny itp.
kod511788465541441

3
@user, gdzie deklarujesz rozmiary kolumn i takie tam? Nie jestem zbyt zaznajomiony z eksportowaniem danych do Excela, ale może być konieczne zadeklarowanie ich w tekście, np.<td style="background-color: ...
Pekka

@user - są tu co najmniej dwa różne problemy: 1) formatowanie danych tak, aby były poprawnie wyświetlane w Excelu oraz 2) eksportowanie danych za pomocą Javascript, aby poprawnie ustawił typ MIME, zachęcając użytkownika do zapisania pliku . Czy próbujesz rozwiązać oba te problemy?
nrabinowitz

10
Dlaczego uznano to za „oparte na opiniach”? To bardzo proste pytanie techniczne.
brandizzi

Odpowiedzi:


75

Najczystszym i najłatwiejszym eksportem z tabel do Excela jest wtyczka Jquery DataTables Table Tools. Otrzymujesz siatkę, która sortuje, filtruje, porządkuje i stronuje dane, a dzięki zaledwie kilku dodatkowym wierszom kodu i dwóm małym plikom, możesz eksportować do Excela, PDF, CSV, do schowka i na drukarkę.

To jest cały wymagany kod:

  $(document).ready( function () {
    $('#example').dataTable( {
        "sDom": 'T<"clear">lfrtip',
        "oTableTools": {
            "sSwfPath": "/swf/copy_cvs_xls_pdf.swf"
        }
    } );
} );

Tak więc, szybkie wdrożenie, brak ograniczeń przeglądarki, brak języka po stronie serwera, a przede wszystkim bardzo ŁATWA do zrozumienia. To wygrana-wygrana. Jedyną rzeczą, na którą ma ograniczenia, jest ścisłe formatowanie kolumn.

Jeśli formatowanie i kolory są absolutnymi przełomami, jedyną w 100% niezawodną metodą między przeglądarkami, jaką znalazłem, jest użycie języka po stronie serwera do przetwarzania odpowiednich plików Excela z twojego kodu. Moim wyborem jest PHPExcel. Jest to jedyne, jakie do tej pory znalazłem, które pozytywnie obsługuje eksport z formatowaniem do NOWOCZESNEJ wersji Excela z dowolnej przeglądarki, jeśli dajesz tylko HTML. Pozwólcie mi jednak wyjaśnić, że zdecydowanie nie jest to tak łatwe, jak pierwsze rozwiązanie, a także jest trochę kłopotliwe. Jednak z drugiej strony może również wyświetlać bezpośrednio w formacie PDF. A po skonfigurowaniu po prostu działa za każdym razem.

AKTUALIZACJA - 15 września 2016 r .: TableTools zostało wycofane na korzyść nowej wtyczki o nazwie „ przyciski ”. Narzędzia te pełnią te same funkcje, co stare rozszerzenie TableTools, ale są DUŻO łatwiejsze w instalacji i wykorzystują pliki HTML5 do pobrania dla nowoczesnych przeglądarek, z możliwością powrotu do oryginalnego pobierania Flasha w przeglądarkach, które nie obsługują standardu HTML5. Jak widać z wielu komentarzy od czasu, gdy opublikowałem tę odpowiedź w 2011 roku, główna słabość TableTools została naprawiona. Nadal nie mogę polecić DataTables wystarczająco do obsługi dużych ilości danych, zarówno dla programisty, jak i użytkownika.


2
DataTables jest w pełni JavaScript. Tylko element TableTools używa Flasha i jest on malutki. NIGDY nie użyłbym dobrowolnie Flasha w żadnym z moich produktów!
bpeterson76

16
Rozumiem i zgadzam się. Ale nadal - choćby malutki - jest tam obiekt .swf, który nie może działać bez Flasha.
magma

8
Takie świetne rozwiązanie, ale szkoda, że ​​potrzebuje Flasha.
jnthnclrk

Witam, czy możesz pokazać kompletny przykład, jestem zbyt noobem, aby to działało bez przykładu!
NoobTom

1
@PramodGaikwad, nie, Datatables zastąpiłoby NG-table. W rzeczywistości mają tę samą funkcjonalność, ale Datatables są DUŻO bardziej dojrzałe i mają wiele, wiele więcej funkcji. Istnieje spinoff Datatables stworzonych specjalnie dla Angular: l-lin.github.io/angular-datatables/#/welcome
bpeterson76

42

Dawno temu odkryłem, że Excel otworzy plik HTML z tabelą, jeśli wyślemy go z typem zawartości Excel. Rozważ powyższy dokument:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
  <title>Java Friends</title>
</head>
<body>
  <table style="font-weight: bold">
    <tr style="background-color:red"><td>a</td><td>b</td></tr>
    <tr><td>1</td><td>2</td></tr>
  </table>    
</body>
</html>

Uruchomiłem na nim następującą bookmarklet:

javascript:window.open('data:application/vnd.ms-excel,'+document.documentElement.innerHTML);

i faktycznie mam go do pobrania jako plik Excel. Jednak nie uzyskałem oczekiwanego rezultatu - plik był otwarty w OpenOffice.org Writer. To jest mój problem: nie mam Excela na tym komputerze, więc nie mogę go lepiej wypróbować. Ponadto ta sztuczka działała mniej więcej sześć lat temu w starszych przeglądarkach i starszej wersji MS Office, więc naprawdę nie mogę powiedzieć, czy zadziała dzisiaj.

W każdym razie w powyższym dokumencie dodałem przycisk, który teoretycznie ściągałby cały dokument jako plik Excel:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
  <title>Java Friends</title>
</head>
<body>
  <table style="font-weight: bold">
    <tr style="background-color:red"><td>a</td><td>b</td></tr>
    <tr><td>1</td><td>2</td></tr>
    <tr>
      <td colspan="2">
        <button onclick="window.open('data:application/vnd.ms-excel,'+document.documentElement.innerHTML);">
            Get as Excel spreadsheet
        </button>
      </td>
    </tr>
  </table>    
</body>
</html>

Zapisz go w pliku i kliknij przycisk. Ja kocham wiedzieć, czy to działa, czy nie, więc proszę was, aby skomentować nawet do stwierdzenia, że to nie działa.


11
Udało się dodać zamiennik na końcu: window.open ('data: application / vnd.ms-excel,' + document.getElementById ('table'). ExternalHTML.replace (/ / g, '% 20')) ;
VSP

6
Alternatywny sposób (zalecany): window.open ('data: application / vnd.ms-excel,' + encodeURIComponent (document.getElementById ('table'). ExternalHTML));
VSP

5
Działa doskonale w przeglądarce Firefox, zawiń tabelę w element div, a następnie wywołaj identyfikator, document.getElementById('id').innerHTMLaby wybiórczo pobrać tylko tabelę, w przeciwnym razie wszystkie twoje rzeczy zostaną wyeksportowane do arkusza kalkulacyjnego. Nie działa jednak w starym IE, po prostu otwiera nowe okno z całym html w tytule
Abraham Brookes.

1
To proste rozwiązanie działa dobrze. Spójrz na to zduplikowane pytanie, aby móc ustawić nazwę pliku, a także ustawić nazwę arkusza roboczego. Ten sam rodzaj rozwiązania; stackoverflow.com/questions/17126453/…
Espen Schulstad

2
To już nie działa w Office 365 ze względu na bardziej rygorystyczne środki bezpieczeństwa. Plik Excel musi być PRAWDZIWYM dokumentem Excel, w przeciwnym razie podczas otwierania będzie wyświetlany błąd.
Phil

12

Możliwe jest użycie starego formatu XML programu Excel 2003 (przed OpenXML) do utworzenia ciągu zawierającego żądany XML, a następnie po stronie klienta można użyć identyfikatora URI danych do otwarcia pliku przy użyciu typu MIME XSL lub wysłania pliku do klienta przy użyciu typu MIME programu Excel „Content-Type: application / vnd.ms-excel” po stronie serwera.

  1. Otwórz program Excel i utwórz arkusz z żądanym formatowaniem i kolorami.
  2. Zapisz skoroszyt programu Excel jako „Arkusz kalkulacyjny XML 2003 (* .xml)”
  3. Otwórz wynikowy plik w edytorze tekstu, takim jak notatnik, i skopiuj wartość do ciągu znaków w aplikacji
  4. Zakładając, że korzystasz z podejścia po stronie klienta z identyfikatorem URI danych, kod wyglądałby następująco:
    
    <script type="text/javascript">
    var worksheet_template = '<?xml version="1.0"?><ss:Workbook xmlns:ss="urn:schemas-microsoft-com:office:spreadsheet">'+
                 '<ss:Styles><ss:Style ss:ID="1"><ss:Font ss:Bold="1"/></ss:Style></ss:Styles><ss:Worksheet ss:Name="Sheet1">'+
                 '<ss:Table>{{ROWS}}</ss:Table></ss:Worksheet></ss:Workbook>';
    var row_template = '<ss:Row ss:StyleID="1"><ss:Cell><ss:Data ss:Type="String">{{name}}</ss:Data></ss:Cell></ss:Row>';
    </script>
    
    
  5. Następnie możesz użyć zastępowania ciągów, aby utworzyć kolekcję wierszy do wstawienia do szablonu arkusza
    
    <script type="text/javascript">
    var rows = document.getElementById("my-table").getElementsByTagName('tr'),
      row_data = '';
    for (var i = 0, length = rows.length; i < length; ++i) {
    row_data += row_template.replace('{{name}}', rows[i].getElementsByTagName('td')[0].innerHTML);
    }
    </script>
    
    
  6. Po zebraniu informacji utwórz końcowy ciąg i otwórz nowe okno, używając identyfikatora URI danych

    
    <script type="text/javascript">
    var worksheet = worksheet_template.replace('{{ROWS}}', row_data);

    window.open('data:application/vnd.ms-excel,'+worksheet); </script>

Warto zauważyć, że starsze przeglądarki nie obsługują schematu URI danych, więc może być konieczne utworzenie strony serwera plików dla tych przeglądarek, które go nie obsługują.

Może być również konieczne wykonanie kodowania base64 na zawartości identyfikatora URI danych, co może wymagać biblioteki js , a także dodanie ciągu „; base64” po typie MIME w identyfikatorze URI danych.


Chociaż przyjemnie jest używać OpenXML, to rozwiązanie nie będzie działać na tabelach z colspans lub rowspans bez dużej ilości pracy na generatorze javascript
Eduardo Molteni

1
Dziękuję, że mnie czegoś nauczyłeś, a nie kazałeś mi używać wtyczki, bardzo cenione. Warto wspomnieć, że to podejście do dziś działa dobrze.
Benjamin Gruenbaum

Ciekawe, wypróbowałem to podejście. Po prostu otrzymuję cały <? Xml version = "1.0"?> <Ss: Workbook xmlns: ss = "urn: schemas-microsoft-com: office: spreadsheet"> '+' <ss: Styles> <ss: Style ss : ID = "1"> <ss: Font ss: Bold = "1" /> </ ss: Style> </ ss: Styles> <ss: Worksheet ss: Name = "Sheet1"> '+' <ss: Tabela> wartości z moimi ciągami zapisanymi w jednej komórce, w tym wszystkie wiersze w jednej komórce. czego mi brakuje?
CromeX

6

Excel ma mało znaną funkcję zwaną „kwerendami sieci Web”, która umożliwia pobieranie danych z prawie każdej strony internetowej bez dodatkowego programowania.

Kwerenda sieci Web zasadniczo uruchamia żądanie HTTP bezpośrednio z programu Excel i kopiuje niektóre lub wszystkie otrzymane dane (i opcjonalnie formatowanie) do arkusza.

Po zdefiniowaniu zapytania internetowego możesz je odświeżyć w dowolnym momencie, nawet bez opuszczania programu Excel. Nie musisz więc faktycznie „eksportować” danych i zapisywać ich w pliku - wolisz raczej odświeżyć dane, tak jak z bazy danych.

Możesz nawet skorzystać z parametrów adresu URL, wyświetlając monit programu Excel o określone kryteria filtrowania itp.

Jednak wady, które do tej pory zauważyłem, to:

  • dynamicznie ładowane dane nie są dostępne, ponieważ JavaScript nie jest wykonywany
  • Długość adresu URL jest ograniczona

Oto pytanie dotyczące tworzenia zapytań sieci Web w programie Excel. Zawiera łącze do witryny pomocy firmy Microsoft dotyczącej pobierania danych zewnętrznych ze strony sieci Web


To nie zadziała, jeśli adres URL znajduje się za ścianą logowania.
Achshar

Działa z uwierzytelnianiem podstawowym i opartym na formularzu, ale w przypadku tego ostatniego może być konieczne kliknięcie „edytuj zapytanie”, aby ponownie wprowadzić dane uwierzytelniające i uzyskać nowy plik cookie od czasu do czasu
HAL 9000

5

To jest php, ale możesz zmienić go na javascript:

<?php>
$colgroup = str_repeat("<col width=86>",5);
$data = "";
$time = date("M d, y g:ia");
$excel = "<html xmlns:o=\"urn:schemas-microsoft-com:office:office\" xmlns:x=\"urn:schemas-microsoft-com:office:excel\" xmlns=\"http://www.w3.org/TR/REC-html40\">
<!DOCTYPE html PUBLIC \"-//W3C//DTD XHTML 1.0 Transitional//EN\" \"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd\">
<html>
<head>
<meta http-equiv=\"Content-type\" content=\"text/html;charset=utf-8\" />
<style id=\"Classeur1_16681_Styles\">
.xl4566 {
color: red;
}
</style>
</head>
<body>
<div id=\"Classeur1_16681\" align=center x:publishsource=\"Excel\">
<table x:str border=0 cellpadding=0 cellspacing=0 style=\"border-collapse: collapse\">
<colgroup>$colgroup</colgroup>
<tr><td class=xl2216681><b>Col1</b></td><td class=xl2216681><b>Col2</b></td><td class=xl2216681 ><b>Col3</b></td><td class=xl2216681 ><b>Col4</b></td><td class=xl2216681 ><b>Col5</b></td></tr>
<tr><td class=xl4566>1</td><td>2</td><td>3</td><td>4</td><td>5</td></tr>
</table>
</div>
</body>
</html>";
  $fname = "Export".time().".xls";
  $file = fopen($fname,"w+");
  fwrite($file,$excel);
  fclose($file);
  header('Content-Type: application/vnd.ms-excel');
  header('Content-Disposition: attachment; filename="'.basename($fname).'"');
  readfile($fname);
  unlink($fname); ?>    

5

Po pierwsze, nie polecałbym próbować eksportować HTML i mam nadzieję, że wystąpienie Excela użytkownika je odbierze. Z mojego doświadczenia wynika, że ​​to rozwiązanie jest pełne problemów, w tym niekompatybilności z klientami Macintosh i zgłaszania użytkownikowi błędu, że dany plik nie ma określonego formatu. Najbardziej niezawodnym i przyjaznym dla użytkownika rozwiązaniem jest rozwiązanie po stronie serwera, w którym używa się biblioteki do tworzenia rzeczywistego pliku Excela i wysyłania go z powrotem do użytkownika. Kolejnym najlepszym i bardziej uniwersalnym rozwiązaniem byłoby użycie formatu Open XML. Napotkałem kilka rzadkich problemów ze zgodnością ze starszymi wersjami programu Excel, ale ogólnie powinno to dać rozwiązanie, które będzie działać na każdej wersji programu Excel, w tym na komputerach Mac.

Otwórz XML


4

Mozilla nadal obsługuje podstawowe 64 identyfikatory URI. Pozwala to na dynamiczne komponowanie zawartości binarnej za pomocą javascript:

<a href="data:application/vnd.ms-excel<base64 encoded binary excel content here>"> download xls</a>

jeśli twój plik Excela nie jest zbyt wyszukany (bez diagramów, formuł, makr) możesz zagłębić się w format i skomponować bajty dla swojego pliku, a następnie zakodować je za pomocą base64 i wstawić do href

zobacz https://developer.mozilla.org/en/data_URIs


2

W rzeczywistości jest to prostsze niż myślisz: „Po prostu” skopiuj tabelę HTML (to znaczy: kod HTML tabeli) do schowka. Excel wie, jak dekodować tabele HTML; będzie nawet próbował zachować atrybuty.

Najtrudniejsze jest „skopiowanie tabeli do schowka”, ponieważ nie ma standardowego sposobu dostępu do schowka z JavaScript. Zobacz ten wpis na blogu: Dostęp do schowka systemowego za pomocą JavaScript - Święty Graal?

Teraz wszystko, czego potrzebujesz, to tabela w formacie HTML. Proponuję jQuery i metodę html () .


2

Ten kod to tylko IE, więc jest przydatny tylko w sytuacjach, w których wiesz, że wszyscy twoi użytkownicy będą używać IE (na przykład w niektórych środowiskach korporacyjnych).

<script Language="javascript">
function ExportHTMLTableToExcel()
{
   var thisTable = document.getElementById("tbl").innerHTML;
   window.clipboardData.setData("Text", thisTable);
   var objExcel = new ActiveXObject ("Excel.Application");
   objExcel.visible = true;

   var objWorkbook = objExcel.Workbooks.Add;
   var objWorksheet = objWorkbook.Worksheets(1);
   objWorksheet.Paste;
}
</script>

Próbowałem użyć tego kodu, który otworzył tabelę w programie Excel, ale nieprawidłowy format wygląda tak, jakby po prostu skopiował kod HTML do tabel. w ten sposób: <TD class = "" bgColor = # ed9fff> SARTIN, DAN </TD> <TD class = "" bgColor = # ed9fff> BALAEZ, BARBARA </TD> Jakieś sugestie?
Fahad

To dlatego, że użył innerHTML. Element, który dostaje, JEST tabelą, więc powinien to być zewnętrzny HTML.
Dokonałem

Pojawia się błąd: „Serwer automatyzacji nie może utworzyć obiektu” podczas tworzenia obiektu ActiveXObject. Jak mogę to naprawić?
Nk SP

2

Założenia:

  1. podany adres URL

  2. konwersję należy przeprowadzić po stronie klienta

  3. systemy to Windows, Mac i Linux

Rozwiązanie dla systemu Windows:

kod Pythona, który otwiera okno ie i ma do niego dostęp: zmienna url zawiera adres url ('http: //')

ie = Dispatch("InternetExplorer.Application")
ie.Visible = 1
ie.Navigate(theurl)

Uwaga: jeśli strona nie jest dostępna bezpośrednio, ale zaloguj się, będziesz musiał sobie z tym poradzić, wprowadzając dane formularza i emulując działania użytkownika za pomocą Pythona

oto przykład

from win32com.client import Dispatch
ie.Document.all('username').value=usr
ie.Document.all('password').value=psw

ten sam sposób w przypadku pobierania danych ze strony internetowej. Powiedzmy, że element o identyfikatorze „el1” zawiera dane. pobrać tekst elementu do zmiennej

el1 = ie.Document.all('el1').value

wtedy, gdy dane są w zmiennej Python, możesz otworzyć ekran programu Excel w podobny sposób, używając pythona:

from win32com.client import Dispatch
xlApp = Dispatch("Excel.Application")
xlWb = xlApp.Workbooks.Open("Read.xls")
xlSht = xlWb.WorkSheets(1)
xlSht.Cells(row, col).Value = el1

Rozwiązanie dla komputerów Mac:

tylko wskazówka: użyj AppleScript - ma proste i podobne API jak win32com.client Dispatch

Rozwiązanie dla systemu Linux:

java.awt.Robot może działać w tym przypadku ma kliknięcie, naciśnięcie klawisza (można użyć klawiszy skrótu), ale żaden API dla Linuksa, o którym wiem, nie działa tak prosto jak AppleScript


1

proste wyszukiwanie google okazało się takie:

Jeśli dane są w rzeczywistości stroną HTML i NIE zostały utworzone przez ASP, PHP lub inny język skryptowy, a używasz przeglądarki Internet Explorer 6 i masz zainstalowany program Excel na swoim komputerze, po prostu kliknij stronę prawym przyciskiem myszy i zobacz poprzez menu. Powinien pojawić się komunikat „Eksportuj do programu Microsoft Excel”. Jeśli wszystkie te warunki są spełnione, kliknij element menu i po kilku pytaniach zostanie zaimportowany do programu Excel.

jeśli nie możesz tego zrobić, podaje alternatywną metodę „przeciągnij i upuść”:

http://www.mrkent.com/tools/converter/



0

Istnieją praktyczne dwa sposoby zrobienia tego automatycznie, podczas gdy tylko jedno rozwiązanie może być używane we wszystkich przeglądarkach. Przede wszystkim do zbudowania arkusza Excela należy użyć specyfikacji open xml. Dostępne są bezpłatne wtyczki firmy Microsoft, które udostępniają ten format również dla starszych wersji biurowych. Otwarty xml jest standardem od Office 2007. Te dwa sposoby są oczywiste po stronie serwera lub po stronie klienta.

Implementacja po stronie klienta wykorzystuje nowy standard CSS, który pozwala na przechowywanie danych zamiast tylko adresu URL do danych. To świetne podejście, ponieważ nie potrzebujesz żadnego połączenia z serwerem, tylko dane i trochę javascript. Morderczym minusem jest to, że Microsoft nie obsługuje wszystkich jego części w obecnych wydaniach IE (nie wiem o IE9). Microsoft ogranicza dane do obrazu, ale będziemy potrzebować dokumentu. W firefox działa całkiem dobrze. Dla mnie IE był punktem śmierci.

Innym sposobem jest użycie implementacji po stronie serwera. Powinno być wiele implementacji otwartego XML dla wszystkich języków. Musisz tylko jednego złapać. W większości przypadków będzie to najprostszy sposób zmodyfikowania modelu widoku w celu uzyskania dokumentu, ale na pewno można wysłać wszystkie dane z witryny klienta z powrotem na serwer i zrobić to samo.


Czy ten, kto przegłosował, może skomentować, jaki jest powód tego głosowania?
śra

0
   function normalexport() {

       try {
           var i;
           var j;
           var mycell;
           var tableID = "tblInnerHTML";
           var drop = document.getElementById('<%= ddl_sections.ClientID %>');
           var objXL = new ActiveXObject("Excel.Application");
           var objWB = objXL.Workbooks.Add();
           var objWS = objWB.ActiveSheet;
           var str = filterNum(drop.options[drop.selectedIndex].text);
           objWB.worksheets("Sheet1").activate; //activate dirst worksheet
           var XlSheet = objWB.activeSheet; //activate sheet
           XlSheet.Name = str; //rename


           for (i = 0; i < document.getElementById("ctl00_ContentPlaceHolder1_1").rows.length - 1; i++) {
               for (j = 0; j < document.getElementById("ctl00_ContentPlaceHolder1_1").rows(i).cells.length; j++) {
                   mycell = document.getElementById("ctl00_ContentPlaceHolder1_1").rows(i).cells(j);

                   objWS.Cells(i + 1, j + 1).Value = mycell.innerText;

                   //                                                objWS.Cells(i + 1, j + 1).style.backgroundColor = mycell.style.backgroundColor;
               }
           }

           objWS.Range("A1", "L1").Font.Bold = true;
           //                objWS.Range("A1", "L1").Font.ColorIndex = 2;
           //                 objWS.Range("A1", "Z1").Interior.ColorIndex = 47;

           objWS.Range("A1", "Z1").EntireColumn.AutoFit();

           //objWS.Range("C1", "C1").ColumnWidth = 50;

           objXL.Visible = true;

       } catch (err) {
           alert("Error. Scripting for ActiveX might be disabled")
           return
       }
       idTmr = window.setInterval("Cleanup();", 1);

   }


   function filterNum(str) {

       return str.replace(/[ / ]/g, '');
   }
Korzystając z naszej strony potwierdzasz, że przeczytałeś(-aś) i rozumiesz nasze zasady używania plików cookie i zasady ochrony prywatności.
Licensed under cc by-sa 3.0 with attribution required.