如何从客户端计算机的绝对路径显示.json文件内容

时间:2015-03-14 11:46:07

标签: json html5

我遇到了以下html5代码,它从本地文件系统中选择.json并显示其内容。      但是我需要帮助从预定义的绝对路径“C:\ data.json”中选择json文件(没有文件上传对话框)

<!DOCTYPE html>
<html>
<head>
  <meta http-equiv="content-type" content="text/html; charset=UTF-8">
  <title>On loaded file + AngularJS</title>
  <script type='text/javascript' src="https://ajax.googleapis.com/ajax/libs/angularjs/1.3.12/angular.min.js"></script>
</head>
<body ng-app="myapp">
  <div ng-controller="MainCtrl" class="container">
  <h1>Select text file</h1>
    <input type="file" on-read-file="showContent($fileContent)" />
    <div ng-if="content">
        <h2>File content is:</h2>
        <pre>{{ content }}</pre>
    </div>
</div>

<script type='text/javascript'>//<![CDATA[ 

var myapp = angular.module('myapp', []);

myapp.controller('MainCtrl', function ($scope) {
    $scope.showContent = function($fileContent){
        $scope.content = $fileContent;
    };
  });

myapp.directive('onReadFile', function ($parse) {
    return {
        restrict: 'A',
        scope: false,
        link: function(scope, element, attrs) {
            var fn = $parse(attrs.onReadFile);

            element.on('change', function(onChangeEvent) {
                var reader = new FileReader();

                reader.onload = function(onLoadEvent) {
                    scope.$apply(function() {
                        fn(scope, {$fileContent:onLoadEvent.target.result});
                    });
                };

                reader.readAsText((onChangeEvent.srcElement || onChangeEvent.target).files[0]);
            });
        }
    };
});
//]]>  

</script>


</body>


</html>

1 个答案:

答案 0 :(得分:1)

您有效要求的是在没有客户端明确许可的情况下读取本地文件(选择一次不计算),这已被设计所避免因为它显然引入了多种威胁。 ; - )

似乎不可能以任何正式方式完成。如果你能解释一下你的实际目标,我们可能会提出不同的建议。