【问题标题】：Javascript, Typescript, Angular 5 - Open and read fileJavascript、Typescript、Angular 5 - 打开和读取文件
【发布时间】：2018-06-10 12:12:18
【问题描述】：

我正在使用 Angular 5，我有一个应用程序，我需要在其中读取 AMP HTML 文件作为文本。该文件包含在一个组件中，只能从该组件访问。

我希望能够通过提供文件名以只读方式打开文件。

我实际上正在寻找这样的东西：

let file = open('amp.html');

有可能吗？如果没有，我该怎么做才能做到这一点？

【问题讨论】：

在什么环境下？从浏览器？节点JS？ Windows Metro 应用程序？还有什么？
在浏览器中，由于存在安全问题，您无法使用 JS 访问文件系统。如果您使用的是 Node，则可以使用内置的 fs 模块来读取和写入文件。
我使用 Angular 进行开发，我在组件中有一个我想阅读的文件

标签： javascript angular file typescript

【解决方案1】：

如果我理解你的正确，你可以把它读成这样的文字：

function readFile(file){
    var raw = new XMLHttpRequest(); // create a request
    raw.open("GET", file, false); // open file
    raw.onreadystatechange = function (){ // file is ready to read
        if(raw.readyState === 4){
            if(raw.status === 200 || raw.status == 0){
                var allText = raw.responseText;
                alert(allText); // can be also console.logged, of course.
            }
        }
    }
    raw.send(null); // return control
}

用法：

readFile('link.html')

感谢this question，我解决了这个问题。

【讨论】：

我在使用 XMLHttpRequest 时收到此消息：[弃用] 主线程上的同步 XMLHttpRequest 已弃用，因为它对最终用户的体验产生不利影响。
这个解决方案在 v5 上适用于我，我可以给你一个项目示例的链接。否则，请提供更多信息，例如模块和组件文件。 dropbox.com/sh/js39skue1sz1ovq/AAAbBGStl6gn9nLfkHD_oAVna?dl=0

【解决方案2】：

如果你正在编写浏览器端 JS

您不能只是简单地读取文件。 JS 正在您的浏览器上运行，您需要考虑从哪里获取该文件。

如果文件在服务器上，您需要先从服务器上fetch 向该文件发出请求。

如果您正在读取用户计算机上的文件，您将在浏览器上使用File API 来允许用户选择该文件。

如果你正在编写后端 JS

假设您使用的是 NodeJS，您可以像使用其他编程语言一样执行文件操作。查看fs 模块

【讨论】：