ローカルテキストファイルを開き、ブラウザにコンテンツを表示するにはどうすればよいですか？

Question

自分のウェブページにリンクを張って、ローカルのテキストファイルを開き、その内容を表示するつもりです。これは私がこれまでにしようとしているものです：/// F：/folder1/abc.txt

のXMLHttpRequestは、ファイルをロードすることはできません。

<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); 
} 

これは私が取得していますエラーです。クロスオリジン リクエストは、http、データ、クロム、 クロム拡張、https、chrome-extension-resourceのプロトコルスキームでのみサポートされています。

マイウェブページがローカルサーバ上でローカルに実行されています。

ローカルファイルを開いたり読み込んだりすることは可能でしょうか？おそらくブラウザでは許されないもののようです。

Answer 1

新しい回答：

それはまだ可能です。

1. 使用クロムは、それがローカルファイルにアクセスすることができようにする]チェックボックスをオンにtampermonkey延長
2. をインストールします。
3. 以下のようにそれにスクリプトを追加します。

---

// ==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"に変更します。

Answer 2

"いいえ、あなたのマシンにローカルに配備されたサーバーからファイルを読み取ることはできません。"任意のリソースにアクセスするには、リソースをサーバー上で利用可能にする必要があります。あなたの現在のページが提供されている場所。

Answer 3

ファイルは、Webアプリケーションにリンクする必要があります。 javascriptがアプリケーション外のマシンにアクセスできるようにすることはセキュリティ上のリスクであり、許可されていません。 バックエンドプロセスがファイルを読み取って結果を得ることができますが、javascriptからマシンのファイルに直接読み取ることはできません。

Answer 4

HTML5準拠のWebサイトでは、HTML5で利用可能な新しいAPIを使用できます。

HTML5 FileReaderインターフェイスは、使い慣れたJavaScriptイベント処理を使用してファイルを非同期で読み取るために使用できます。これは、次の機能を提供します。

• readAsText
• readAsDataURL
• readAsArrayBufferをreadAsBinaryString
• を

従ってください。このtreehouse blog（あまりにもデモが含まれています）と、あなたの参考のためにもthis。