如何打开本地文本文件并在浏览器中显示内容？

我打算在我的网页上有一个链接，它会打开一个本地文本文件并显示它的内容。这是我到目前为止已经试过：如何打开本地文本文件并在浏览器中显示内容？

<a href='#' onclick='readTextFile("file:///F:/folder1/abc.txt")' title='Summary'><h3>Summary</h3></a> 

function readTextFile(file) 
{ 
    var rawFile = new XMLHttpRequest(); 
    rawFile.open("GET", file, false); 
    rawFile.onreadystatechange = function() 
    { 
     if(rawFile.readyState === 4) 
     { 
      if(rawFile.status === 200 || rawFile.status == 0) 
      { 
       var allText = rawFile.responseText; 
       alert(allText); 
      } 
     } 
    } 
    rawFile.send(null); 
}

这是我收到的错误：

的XMLHttpRequest无法加载文件：/// F：/folder1/abc.txt。交叉源请求仅支持协议方案：http，data，chrome， chrome-extension，https，chrome-extension-resource。

我的网页在本地服务器上本地运行。

它甚至可以打开和读取本地文件？好像浏览器应该不允许的东西。

来源

2017-03-07 karansabhani

oooh，no ...只是重新阅读这个问题......你不能这样做，哦，上帝请让它在任何浏览器中永远不可行！ –

在大多数浏览器中，只有页面所在文件夹或子文件夹中的资源才有可能。 –

@Pekka웃 - 他想从'http：//'开启'file：///'！ –

新的答案：

它仍然是可能的。

使用Chrome
安装tampermonkey扩展
选中该复选框，使其可以访问本地文件。
添加脚本到它如下：

// ==UserScript== 
// @name   read localfile 
// @namespace http://tampermonkey.net/ 
// @version  0.1 
// @description read localfile 
// @author  blackmiaool 
// @match  http://stackoverflow.com/* 
// @match  https://stackoverflow.com/* 
// @grant  GM_getResourceText 
// @resource  b file://C:\Users\blackmiaool\the-path-of-the-file 
// ==/UserScript== 

(function() { 
    'use strict'; 
    var a=GM_getResourceText("b"); 
    console.log("The file's content is ",a); 
})();

记住要更正文件路径，并测试其在此页上。

老答案：

当然这是可能的。如果您的index.html文件位于“/some-path/index.html”处，请将您的abc.txt放在“/some-path/abc.txt”处。然后将“file：/// F：/folder1/abc.txt”更改为“./abc.txt”。

来源

2017-03-07 12:32:02 blackmiaool

看到他说的地方*网页在本地服务器上本地运行*** –

@JaromandaX我认为本地服务器意味着服务器运行在他自己的电脑上。 – blackmiaool

我认为本地服务器意味着本地服务器 –

简单地说：“不，您无法读取本地部署在本机上的任何文件。”为了访问任何资源，您必须拥有可用的资源。您的当前页面来自哪里。

来源

2017-03-07 12:36:21

该文件需要在您的Web应用程序中链接到它。允许javascript在应用程序外部访问您的计算机是一种安全风险，不允许。后台进程可以读取文件，然后给出结果，但不能直接从JavaScript读取到计算机上的文件

来源

2017-03-07 13:05:47

对于符合HTML5的网站，您可以使用HTML5提供的新API。

HTML5 FileReader接口可用于通过熟悉的JavaScript事件处理异步读取文件。它提供了以下功能：

readAsText
readAsBinaryString
readAsDataURL
readAsArrayBuffer

请点击此treehouse blog（包括演示过），也this供大家参考。

来源

2017-03-07 13:08:25

如何打开本地文本文件并在浏览器中显示内容？

回答

相关问题