有没有办法从与网页相同的服务器上的文本文件加载数据？答案

【问题标题】：Is there a way to load data from a text file on the same server as the web page?有没有办法从与网页相同的服务器上的文本文件加载数据？
【发布时间】：2015-12-01 03:12:54
【问题描述】：

最近我开始开发一个简单的基于自上而下的瓷砖程序，您可以在其中移动玩家角色在地图上移动并放大和缩小地图。

进展顺利，我画了一个背景，现在我想开始画一些瓷砖。

目前我有一些看起来像这样的东西：

var tileset1 = new Image();
tileset1.src = "Images/Tileset1.gif";
var tx = [];
var ty = [];
var txo = [];
var tyo = []; //Background tile x and y on the map and the x and y offset in the image for drawing
var tilesize = 32; //constant for each tiles width and height in pixels.

function map1data() {
    "use strict";
    tx[0] = 0;
    ty[0] = 0;
    txo[0] = 0;
    tyo[0] = 0;
    tx[1] = 32;
    ty[1] = 0;
    txo[1] = 32;
    tyo[1] = 0;
}
map1data();
ctx.drawImage(tileset1, txo[i], tyo[i], tilesize, tilesize, tx[i], ty[i], tilesize, tilesize);

这很好用，但我的主要问题是使用数组来绘制图块，并且必须通过将每个图块的属性硬编码到脚本中来给出每个图块的属性。

如果我的地图有 100 个图块，我将不得不手动编写 400 行代码，并不理想。

所以我想知道有没有办法在网页托管的实际服务器上获取纯文本文件（例如，在与索引页面相同的根文件系统中？）并将变量设置为内容，就像我对图像所做的那样？而不是必须使用 DOM 从特定的服务器 url 请求它？

【问题讨论】：

是的，这就是Ajax的基本思想。获取文档并处理文件并将其存储到变量中。
我认为发帖人不想发出 ajax 请求。他们说“而不必使用 DOM 从特定的服务器 url 请求它”
如果你不想使用 ajax，你可以在你的服务器上有另一个 javascript 文件，并在该文件中将你的数据分配给一个全局变量。然后将该 js 文件包含在脚本标记中。当页面加载时，脚本将运行并将数据分配给 var。
您可以使用 ajax 在客户端执行此操作，正如 epascarello 指出的那样，或者在服务器端使用某种服务器端模板或脚本技术，例如 NodeJS (JavaScript)、PHP (PHP )、ASP.Net（各种语言）或其他几十种语言中的任何一种。
另请注意，DOM 与 ajax 无关。 DOM 是内存中文档的模型。

标签： javascript

【解决方案1】：

您是否有不想使用 ajax 的原因？您可以按如下方式使用 PHP（假设以下文件名为 myscript.php）：

//place any opening javascript code here if necessary.
<?php
     // open a file using the fopen function
     // read each line of the file using the fgets function
     // convert each line into your appropriate javascript code such as an array etc.
     // echo the javascript code
//place any closing javascript code here if necessary.

然后你可以像包含任何其他 javascript 文件一样包含它：

<script src="myscript.php"></script>

此外，由于它在 PHP 脚本中，您可以引用文件，无论它们是在 Web 根目录中还是在 Web 根目录之外。

【讨论】：

【解决方案2】：

您可以使用XMLHttpRequest API。它的作用是告诉浏览器从服务器请求指定的文件，而无需加载新页面并将其呈现给用户。然后，您可以将返回的数据分配给代码中的变量并从那里使用它。

如果你不介意使用 jQuery，你可以使用 .get() method，它的语法更简单：

$.get( "tiles.txt", function( data ) {
  // assign 'data' to an existing variable or pass into a function
});

您可能希望考虑将数据存储为 JSON 或其他类似格式而不是纯文本（这样会更容易操作）。

【讨论】：