質問をすることでしか得られない、回答やアドバイスがある。

15分調べてもわからないことは、質問しよう!

新規登録して質問してみよう
ただいま回答率
85.50%
Node.js

Node.jsとはGoogleのV8 JavaScriptエンジンを使用しているサーバーサイドのイベント駆動型プログラムです。

JavaScript

JavaScriptは、プログラミング言語のひとつです。ネットスケープコミュニケーションズで開発されました。 開発当初はLiveScriptと呼ばれていましたが、業務提携していたサン・マイクロシステムズが開発したJavaが脚光を浴びていたことから、JavaScriptと改名されました。 動きのあるWebページを作ることを目的に開発されたもので、主要なWebブラウザのほとんどに搭載されています。

Q&A

解決済

1回答

5633閲覧

JavascriptでのExcelファイルのダウンロードについて

---stax---

総合スコア148

Node.js

Node.jsとはGoogleのV8 JavaScriptエンジンを使用しているサーバーサイドのイベント駆動型プログラムです。

JavaScript

JavaScriptは、プログラミング言語のひとつです。ネットスケープコミュニケーションズで開発されました。 開発当初はLiveScriptと呼ばれていましたが、業務提携していたサン・マイクロシステムズが開発したJavaが脚光を浴びていたことから、JavaScriptと改名されました。 動きのあるWebページを作ることを目的に開発されたもので、主要なWebブラウザのほとんどに搭載されています。

0グッド

0クリップ

投稿2018/11/06 02:59

編集2018/11/06 06:28

表題の件で質問お願い致します。
サーバーサイド側で以下のコードからExcelファイルを出力しています。
流れとしてはひな形となるExcelファイルをコピーし、システムの日付を付与して新しいファイルとして出力。その後出力したファイルを読み込み、指定のセルに値を書き込むという流れです。

目的はサーバー側で作成、格納されているExcelファイルをクライアント側からもダウンロードさせたいと考えています。
その際にファイル名や保存先も任意で決めれるのが理想形です。

Excelファイル作成部分

javascript

1const fs = context.global.fs; 2const moment = context.global.moment; 3 4 5//年、月、日 情報取得 6var date = moment().format('YYYYMMDD') 7var year = moment().year(); 8var month = moment().month() + 1; 9var day = moment().date(); 10 11// コピー元ファイル(ひな形になるファイル) 12const src = 'C:\Users\Desktop\test\test_excel.xlsx'; 13 14//コピー先ファイル 15const dest = "C:\Users\Desktop\test\" + month + "月\" + date + ".xlsx"; 16 17//ファイル作成 18fs.copyFileSync(src, dest);

Excel書き込み部分

js

1const XlsxPopulate = context.global.xlsxpopulate; 2const moment = context.global.moment; 3 4//年、月、日 情報取得 5var date = moment().format('YYYYMMDD') 6var year = moment().year(); 7var month = moment().month() + 1; 8var day = moment().date(); 9 10//テスト用書き込み変数 11var test1 = '日本語'; 12var test2 = 'English'; 13var test3 = 100; 14var test4 = 0.5; 15var test5 = 2000; 16 17XlsxPopulate.fromFileAsync('"C:\Users\Desktop\test\" + month + "月\" + date + ".xlsx"') 18.then(book => { 19 const sheet1 = book.sheet("Sheet1") 20 sheet1.cell("A2").value(test1) 21 sheet1.cell("B4").value(test2) 22 sheet1.cell("A10").value(test3) 23 sheet1.cell("B11").value(test4) 24 sheet1.cell("D14").value(test5) 25 sheet1.cell("H4").value(2000) 26 book.toFileAsync('"C:\Users\Desktop\test\" + month + "月\" + date + ".xlsx"'); 27 }) 28

サイトを参考にさせて頂きコピペですが試しに以下のコードを記入しました
参考サイト
以下のコードでは出力する内容は変数contentに直接記述しており、ファイル名なども固定になっています。
的外れな質問なのですが、ダウンロードしたい内容を”Excelファイル”に指定することは可能でしょうか?
またその際にダウンロードされるパスやファイル名を任意で指定する方法はありますでしょうか?
もしこのやり方では不可能であれば他の案もアドバイスを頂きたいです。
知識も浅くそもそも出来るのかという事すら分からないので的外れな質問かと思いますが宜しくお願い致します。

イメージ説明

html

1<!doctype html> 2<html lang="ja"> 3 <head> 4 <meta charset="utf-8"> 5 <title>Download Sample</title> 6 </head> 7 <body> 8 <script type='text/javascript'> 9 function handleDownload() { 10 var content = 'あいうえお'; 11 var blob = new Blob([ content ], { "type" : "text/plain" }); 12 13 if (window.navigator.msSaveBlob) { 14 window.navigator.msSaveBlob(blob, "test.txt"); 15 16 // msSaveOrOpenBlobの場合はファイルを保存せずに開ける 17 window.navigator.msSaveOrOpenBlob(blob, "test.txt"); 18 } else { 19 document.getElementById("download").href = window.URL.createObjectURL(blob); 20 } 21 } 22 </script> 23 <a id="download" href="#" download="test.txt" onclick="handleDownload()">ダウンロード</a> 24 </body> 25</html>

また、以下の例でも試したのですが画像のようなエラーとなり成功しませんでした
(ブラウザはFireFoxです)

html

1<a href="C:\Users\Desktop\test\test_excel.xlsx" download="downloadtest.xlsx">ダウンロード</a>

イメージ説明

追記
上記の記述方法ではなく以下のように書き換えてみましたがリンクを押しても反応なしでした
しかしfile:///C:/sample/test_excel.xlsx←この部分をアドレスバーに入力するとファイルのダウンロードのダイアログが出ます
htmlでの記述内容が足りないのでしょうか?

html

1<a href="file:///C:/sample/test_excel.xlsx" download="downloadtest.xlsx">ダウンロード</a>

気になる質問をクリップする

クリップした質問は、後からいつでもMYページで確認できます。

またクリップした質問に回答があった際、通知やメールを受け取ることができます。

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

m.ts10806

2018/11/06 03:28

サーバーではなくローカルでは >C:\\Users\\Desktop\\
---stax---

2018/11/06 03:51

回答ありがとうございます。サーバーやクライアントを意識しなければいけない物を作るのが今回初めてで知識がなく本当に申し訳ないのですが、自分の解釈としては自分のPCをサーバーに見立てて作っています。自分の環境(ローカルPC)で作成したwebアプリを他のPCからhttp〜を叩いてアクセスしてページを開いてボタンを押したりするとExcelファイルをダウンロード出来るようにしたいと思っています。(クライアント側はnode.jsなどが入っていないPC)サーバー側としてファイルの格納場所は何か共有ファイルのようなものに入れるべきという事でしょうか?知識がなく的外れな質問で大変申し訳ありません。
m.ts10806

2018/11/06 07:17

結局Node.jsは使うのでしょうか、使わないのでしょうか。
guest

回答1

0

ベストアンサー

「サーバー」と仰っていますが見立ても何もローカルアクセスにしかなっていません。
ちなみに「ローカルファイル」とした場合、JavaScriptなどクライアント側の言語からアクセスすることは基本出来ません。
やはりローカルでもWebサーバーを立てて(XAMPPなどでApacheを入れる)ダウンロード処理自体はPHPなどサーバー側の言語に任せるべきかと。
ファイルもその立てたWebサーバーとしてアクセスできる箇所に置くべきですね。
「他のPCからhttp~叩いて」となると尚更、ローカルアプリとして動かしていては実現は出来ません。
「他のPCから」を社内や同じLAN内ではない、本当に外部のPCからブラウザで実行となると、ローカルWebサーバーでも基本的には出来ませんので、レンタルサーバー借りるか何かする必要があります。

投稿2018/11/06 07:16

m.ts10806

総合スコア80765

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

---stax---

2018/11/06 07:56

回答ありがとうございます。 確かにファイルが置いてある場所は自分のローカルなので他PCからアクセスできないですよね・・・。 例えばwebで”javascript html ダウンロード”などのキーワードで調べるとサンプルが置かれていてそのボタンを押すとダウンロードが開始できるようなものもサーバーを立てているという理解でよろしいでしょうか? 今回は同じ社内ネットワーク内での使用を想定していますが現状のままでは使えないですね。 例えば共有フォルダなどに格納しておいて、ユーザー側はボタンを押すとそのフォルダからファイルを取ってくる、のようなことをしようとした場合はwebサーバーは不要ですか?(手動で取ってきた方が早いのでわざわざそんな事やる必要はないですが・・・) どのようなケースでwebサーバーが必要になるのかという理解が出来ていないので的外れな質問で申し訳ありません。 また今回はnpmでインストールしたモジュールを用いているのでnode.jsも利用しています。(質問の回答として意味不明かもしれません。すいません・・・。)
m.ts10806

2018/11/06 08:03

> 例えばwebで ご自身で「Webで」と書かれている通りです。 何かしらのWebサーバー(公開・WorldWideWeb)にないと外からは見れません。 試しにその自身が作ったファイルに携帯などからアクセスしようとしてみてください。 どのようなURLでアクセスしていいかわかりませんよね?それと同じです。 インターネット環境からどこからでもアクセスできるような場所に置く必要があります。 「共有フォルダ」とはどういう位置づけのものなのでしょうか。 Node.jsはどこにどう置いたものなのでしょうか。 (※当方、Node.jsについてはあまり詳しくはありません) 社内ネットワーク内であればWebサーバ立てて(もしかしたらファイアウォールの設定とかいるかもしれませんが)きちんと設定すれば良いかもしれません。 Node.jsも一応サーバー環境で動作するものではありますが、それが「Webサーバー」で例えばhttp://自身のPCのIP/~でアクセスできるものなのかを確認する必要があります。
---stax---

2018/11/06 15:19

返答遅くなり申し訳ありません。 今の自分の認識と状況なのですが、自分に知識がない状態でダウンロードなら出来るでしょ、という指示を受けたのでダウンロードならwebアプリを介して他のPCから自分の作ったファイルを受け取れるものだと思っていました。 サイトなどを調べるとhtmlのダウンロード属性を使ったり、javascriptのblob?を使ったりするサンプルを見かけて、そのサンプル内に配置されたボタンを押すとダウンロードのダイアログが出せていることからもサーバー側に置いてあるファイルのダウンロードは可能かと認識していました。 ただ、そのダウンロード対象のファイルがどこに配置されているかはわかりませんでした(サーバー側のデスクトップに置いてあるのか違う場所に置いてあるのかなど) 頂いた回答から今自分がやろとしていることはそもそもが間違っていて、webサーバーを立てて公開しておかないと他PCからはどうやってもアクセスすることは出来ないという理解でよろしいでしょうか? 何度も同じような質問をしてすいません。 また共有フォルダに関しては社内のネットワークにつながっていればアクセス出来るようなフォルダがあるのでそこにあらかじめファイルを格納しておき、webアプリからボタンなどが押されたらそのフォルダの中にあるファイルをダウンロードさせることは可能なのかなと思って質問しました。ただ、だれでも見れるフォルダなのでわざわざダウンロードなんかしないで欲しい人が手動でコピーしてこれば良いっていうそもそもな所はあります。 Node.jsもjavascriptも今回初めて触れるのでは私も知識はゼロなので申し訳ないのですが、今は自分のローカルPCのCドライブ以下に配置しており、その自分の環境でwebアプリを作成しています。 他のPCからhttp://自身のPCのIP/~でwebアプリにアクセスしてもらえる事までは確認済です。 丁寧に回答頂いているのに理解力が足りなくて本当に申し訳ありません。
m.ts10806

2018/11/06 16:19 編集

そもそも「サーバー上のデスクトップ」という表現があまりよくありません。 デスクトップというのはあくまでローカルの概念です。概念のところが正しくないと間違った方向性のまま進みます。 他のPCからネットワーク越しに確認できるのはあくまでサーバーのドキュメントルートからの情報であり、デスクトップなどではありません。 file://やC://となっている時点でサーバーのパスではなくアクセスしているPCからのパスとなります。 絶対パスを指定するならドキュメントルートを基準にしなければなりませんし、他のPCからはドキュメントルート以上の階層は直接アクセスできません。できたら大事ですよね。 ドキュメントルート以上にはサーバーなりなんなりの設定情報が入っているものです。 今提示されている情報からドキュメントルートがなにかは他人にはわかりません(私にはPHPとかの知識はあってもNode.jsについての知識はないので) http://自身のPCのIP/ でのアクセスが確認できてるならそのURLでアクセスしているディレクトリがルートディレクトリになりますので、直接開かせたければ、その配下に置くことになります。 アクセスも http://自身のPCのIP/からそのファイルまでのパスになりますね。http://自身のPCのIP/が見ているパスが C://example/htdocs で ファイルが C://example/htdocs/download/test.xlsx なら http://自身のPCのIP/download/test.xlsx または /download/test.xlsx 上記が基本です。 ※ただしPHPなどサーバー側の言語から読み込んでheader機能からattachmentでダウンロードさせるならドキュメントルート配下でなくてもできます。要件次第ですしNode.jsにも同等の仕組みはあるんじゃないかなとは思いますがまずは直接ダウンロードを実現させてから考えてください
---stax---

2018/11/08 01:41

回答遅くなり申し訳ありません。 <a href="file:///C:/sample/test_excel.xlsx" download="downloadtest.xlsx">ダウンロード</a> このようなコードが動かないのも配置している場所が悪いためですね まずは教えて頂いたとおり、URLでアクセスされているディレクトリに配置してみてダウンロードが実行できるかを確認してみます。
m.ts10806

2018/11/08 06:08

配置してる場所ではなくリンクのさせかたですよ。
---stax---

2018/11/08 06:15

回答ありがとうございます。 色々教えて頂いているのに理解できていなくてすいません <a href="file:///C:/sample/test_excel.xlsx"~ この部分のパスがローカルに置かれている為に参照出来ないと思ったのですがそういう意味とは違うのでしょうか・・・
m.ts10806

2018/11/08 06:16

file:/// と指定するとブラウザからアクセスしているPCのファイルを見に行きます
m.ts10806

2018/11/08 06:23

AさんのPCのブラウザから見たらAさんのPCの BさんのPCのブラウザから見たらBさんのPCの ファイルが置いてあるのがサーバーなのに、サーバー上のパス指定になっていないということです。 だから、ファイルの置場所ではなくパスの指定の仕方であるとずっと言っています。 解決済みとしていますが本当ですか?今の理解状況で解決として良いかどうかは一考いただきたく。 質問新しく立てられてますが、ちょっと危ういですね。
---stax---

2018/11/08 07:05

ありがとうございます。 ご指摘の通り理解出来ておりません・・・ パスの書き方は ① Webサーバ記述例: http://www.tagPage/ ② パソコンの記述例: file:///c:/www.tagPage/ の2種類があると解釈してます(この時点で間違えていたらすいません) Node.jsは自分のローカルPCのCドライブ以下に配置しており、その自分の環境でwebアプリを作成して、現在は自分のブラウザで動作確認しています。 ①の記述方法を使う場合はサーバー側にアクセスできるフォルダなどを用意してあればそこにアクセスできる。②の記述方法では回答頂いたようにブラウザからアクセスしているPCのファイルを見に行ける、と認識しています。 今回は自分のPCで開いたブラウザでwebアプリを確認しているので②の記述方法でいけると思ったのですが間違っているでしょうか・・・
m.ts10806

2018/11/08 07:12

ブラウザからアクセスしているPCのファイルを見に行ける という考え方はとりあえず捨ててください。
m.ts10806

2018/11/08 07:14

自身のPCのファイルへのアクセスならわざわざブラウザ介す意味ないですよね
guest

あなたの回答

tips

太字

斜体

打ち消し線

見出し

引用テキストの挿入

コードの挿入

リンクの挿入

リストの挿入

番号リストの挿入

表の挿入

水平線の挿入

プレビュー

15分調べてもわからないことは
teratailで質問しよう!

ただいまの回答率
85.50%

質問をまとめることで
思考を整理して素早く解決

テンプレート機能で
簡単に質問をまとめる

質問する

関連した質問