ローカルサーバ上のブラウザからパス指定でファイル出力したい

chromeブラウザでHTML5のfile apiを使用してもファイル出力ができず困っております。

動作環境は、Macです。
ウェブサーバをpythonで起動し、localhostアクセスして動作させています。
（python 3.6 ：実行コマンド　python -m http.server 8000）

HTMLのoutputlogボタンを押した後、outputLogFile()がコールされ、
エラーにはならず、onwriteendコールバックが呼ばれているため、
成功していると思っておりますが、実際にファイル出力ができていません。

何かやり方がまずいのでしょうか？

javascript
1    function outputLogFile() {
2      function error(e) {
3        alert("ERR!: " + e.name);
4      }
5
6       function writeFile(fs) {
7        fs.root.getFile('/log.txt', {create: true}, function(fileEntry) {
8          fileEntry.createWriter(function(fileWriter) {
9            fileWriter.onwriteend = function(e) {
10              console.log('Write completed.');
11            };
12
13            fileWriter.onerror = function(e) {
14              console.log('Write failed: ' + e.toString());
15            };
16
17            var output = new Blob(["this is log data"], {type: "text/plain"});
18            fileWriter.write(output);
19          }, error);
20        }, error);
21      }
22      window.webkitRequestFileSystem(window.TEMPORARY, 1024*1024, writeFile, error);
23    }

HTML
1<HTML>
2<head></head>
3<body>
4  <input type="button" value="outputlog" onclick="outputLogFile()" >
5</body>
6</HTML>

行動規範の内容に同意します

回答1件

サンプルのコードをASP.NETでHTML実行してみましたが、想定のデータが書き込まれています。
何をどう確認し、**実際にファイル出力ができていません。**と言っていますか？

HTML
1<!DOCTYPE html>
2<html>
3<head>
4    <meta charset="utf-8" />
5    <title>TestPage</title>
6</head>
7<body>
8<script type="text/javascript">
9    function outputLogFile() {
10        function error(e) {
11            alert("ERR!: " + e.name);
12        }
13
14        function writeFile(fs) {
15            fs.root.getFile('/log.txt', { create: true }, function (fileEntry) {
16                fileEntry.createWriter(function (fileWriter) {
17                    fileWriter.onwriteend = function (e) {
18                        console.log('Write completed.');
19                    };
20
21                    fileWriter.onerror = function (e) {
22                        console.log('Write failed: ' + e.toString());
23                    };
24
25                    var output = new Blob(["this is log data"], { type: "text/plain" });
26                    fileWriter.write(output);
27                }, error);
28            }, error);
29        }
30        window.webkitRequestFileSystem(window.TEMPORARY, 1024 * 1024, writeFile, error);
31    }
32</script>
33    <input type="button" value="outputlog" onclick="outputLogFile()" >
34</body>
35</html>

FileSystem APIのローカルファイルはどこに保存されているか？

私の環境では以下の場所に「this is log data」を書かれたファイルが作成されました。
C:\Users\shikatech\AppData\Local\Google\Chrome\User Data\Default\File System\047\t\00\00000000

投稿2018/03/20 03:03

ShikaTech

総合スコア468

k.Natsu

2018/03/20 06:14

ご回答ありがとうございます。 sandboxに作られるのですね。 macの場合はどこになるのでしょうか？

ShikaTech

2018/03/20 06:17

Windowsの特殊フォルダであるAppDataが、Macにおけるどこに位置するかを調べれば良いと思います。例えば https://apple.stackexchange.com/questions/28928/what-is-the-osx-equivalent-to-windows-appdata-folder ブラウザの実装次第だと思いますが、似たような機構でTemp領域に作られていると考えられるので。 ※すみません、今手元にmac無いので探せなくて

k.Natsu

2018/03/20 07:58

ShikaTechさんご回答有難うございます。はい、ご指摘いただいた通り、キャッシュやテンポラリの部分など色々とmacで調べたのですが作成されていないのです・・・。（検索もしました。） windowsではAppDataのChrome以下に作成できることは確認しましたが、OSに依存せず動作させたいのでmacで行方不明の現状で困っています。

行動規範の内容に同意します