使用JavaScript讀取服務器端文件

我在我的Web服務器上有一個JS腳本，我希望能夠讀取文件。我的文件系統是這樣的：使用JavaScript讀取服務器端文件

> Root 
index.html 
read.js 
> files 
    file.txt

在這個例子中，文件「file.txt的」將包含簡單的單詞「Hello」

使用JavaScript，我希望能夠做一個功能，例如：

function read (path) { 
    //Stuff to read the file with specified path 
    var content = //whatever the content is 
    return content; 
}

，然後可以與調用它：

var file = read("/files/file.txt")

然後當我做

alert(file)

它會彈出與/提醒你「你好」，file.txt的內容。

有沒有什麼辦法可以做到這一點？

來源

2016-04-28 Gabriel Dunn

您要找的是XMLHttpRequest。

來源

2016-04-28 17:51:52

你能告訴/告訴我如何使用XMLHttpRequest來實現這個嗎？ –

字面上，https://developer.mozilla.org/en-US/docs/Web/API/XMLHttpRequest/Using_XMLHttpRequest上的第一個代碼示例幾乎就是您要求的。只需將URL替換爲您的網址即可。 –

它不像聽起來那麼簡單，你將不得不對服務器和客戶端做一些研究。

除非與服務器建立連接，否則無法通過Javascript讀取服務器端數據。無論在客戶端瀏覽器上運行的任何Javascript代碼將僅保留在其瀏覽器上，即使兩者都在同一臺計算機上運行。你需要的是一種使客戶端（在這種情況下，HTML + JavaScript網站）與服務器通信的方式。

有無數的方法可以做到這一點，但最簡單的方法是通過GET請求到服務該文本文件的服務器。

嘗試用NGINX或者像NodeJS這樣的東西尋找服務靜態文件，具體取決於滿足您的需求。從那裏，創建一個GET端點，您的Javascript將通過XMLHttpRequest連接到（如@MattW。所述）。

來源

2016-04-28 17:54:24 SamuelN

如果您使用JQuery，這是一個非常簡單的任務 - 下面的示例將執行HTTP GET請求（使用上面引用的XMLHttpRequest.as），並將內容放入HTML DOM對象，其ID爲「result」。一旦加載完成，它也會拋出一個警戒框。

$("#result").load("files/file.txt", function() { 
    alert("Load was performed."); 
});

來源

2016-04-28 18:03:56 AutomationNation

你想使用XMLHttpRequest，就像Gabriel建議的那樣。

您需要仔細閱讀它，因爲它非常易於配置，您需要了解工作流程才能實現它。如果您是跨源腳本，您最初會遇到問題。

下面是一個例子，我嘲笑了你：

<span id="placeholder"></span> 
 
<script> 
 
    var xhr = new XMLHttpRequest(); 
 
    xhr.onreadystatechange = function() { 
 
     if (xhr.readyState == 4 && xhr.status == 200) { 
 
      document.getElementById('placeholder').innerHTML = xhr.responseText; 
 
     } 
 
    } 
 
    xhr.open('GET', 'test.html'); 
 
    xhr.send(); 
 
</script>

來源

2016-04-28 18:30:46

我能否以與設置#placeholder的innterHTML相同的方式設置內容的變量？ –

是的，將它附加到'window'對象。 'window.myVar = xhr.responseText' –

這是假定文件'file.txt'實際上是由某些東西服務的。 XHR沒有辦法訪問這個文件，如果它甚至沒有被打開到「外部世界」 – SamuelN

下面是一個簡單的Web頁面對您：

http://sealevel.info/test_file_read.html

這裏的javascript代碼：

// Synchronously read a text file from the web server with Ajax 
// 
// The filePath is relative to the web page folder. 
// Example: myStuff = loadFile("Chuuk_data.txt"); 
// 
// You can also pass a full URL, like http://sealevel.info/Chuuk1_data.json, but there 
// might be Access-Control-Allow-Origin issues. I found it works okay in Firefox, Edge, 
// or Opera, and works in IE 11 if the server is configured properly, but in Chrome it only 
// works if the domains exactly match (and note that "xyz.com" & "www.xyz.com" don't match). 
// Otherwise Chrome reports an error: 
// 
// No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'http://sealevel.info' is therefore not allowed access. 
// 
// That happens even when "Access-Control-Allow-Origin *" is configured in .htaccess, 
// and even though I verified the headers returned (you can use a header-checker site like 
// http://www.webconfs.com/http-header-check.php to check it). I think it's a Chrome bug. 
function loadFile(filePath) { 
    var result = null; 
    var xmlhttp = new XMLHttpRequest(); 
    xmlhttp.open("GET", filePath, false); 
    xmlhttp.send(); 
    if (xmlhttp.status==200) { 
    result = xmlhttp.responseText; 
    } 
    return result; 
}

來源

2016-12-14 01:11:29

使用JavaScript讀取服務器端文件

回答

相關問題