HTML 文件和 Javascript 文件与 AJAX 不能相互工作

Question

For seven years I have been programming small websites for offline and private use.七年来，我一直在编写供离线和私人使用的小型网站。 Each of these projects consists of an html file, linking to a css file, and a javascript file.这些项目中的每一个都包含一个 html 文件，链接到一个 css 文件，以及一个 javascript 文件。 The latter uses AJAX to load content from a.txt file and displays it flexibly on the html site.后者使用AJAX从a.txt文件加载内容，灵活显示在html站点。 The files (.html, .css, .js, .txt) are in the same folder on my local hard disk and I open the html file locally in my browser.这些文件（.html、.css、.js、.txt）位于我本地硬盘上的同一文件夹中，我在浏览器中本地打开 html 文件。 I have been using this setting successfully for writing own small encyclopedias, vocabulary trainers, games etc.我一直在成功地使用这个设置来编写自己的小型百科全书、词汇训练器、游戏等。

However, it does not work any longer.但是，它不再起作用了。 AJAX does not load the text file contents. AJAX 不加载文本文件内容。 (I know that because I inserted the Javascript/AJAX code directly in the html file and it still didn't work.) Moreover, HTML does not connect with the.js file. （我知道，因为我直接在html文件中插入了Javascript/AJAX代码，但还是不行。）而且，HTML没有连接.js文件。 (I know that because I inserted the text contents directly as variable in the Javascript file and it still didn't work.) Only if I combine both steps (ie inserting Javascript code in the html file and inserting the text contents as variable), it works. （我知道，因为我直接将文本内容作为变量插入到 Javascript 文件中，但它仍然不起作用。）只有当我结合这两个步骤时（即在 html 文件中插入 Javascript 代码并将文本内容作为变量插入），有用。 Then, all but CSS is in one html file.然后，除 CSS 之外的所有内容都在一个 html 文件中。 This is however not feasible as the file gets very confusing and editing the text contents is hardly possible.然而，这是不可行的，因为文件变得非常混乱并且几乎不可能编辑文本内容。

The problem started about half a year ago when I updated my Firefox. First, I thought the browser has changed some security settings in order not to allow an html file to link to a javascript. But I didn't find respective settings.大约半年前，当我更新我的 Firefox 时，问题开始了。首先，我认为浏览器更改了一些安全设置，以不允许 html 文件链接到 javascript。但我没有找到相应的设置。 Then, I tried with other browsers.然后，我尝试使用其他浏览器。 Chrome, Edge and the old IE reacted the same way. Chrome、Edge 和旧版 IE 的反应相同。 I confess that I didn't try Opera, Safari and other browsers, however, the ones I tried already represent a certain variety.我承认我没试过Opera、Safari等浏览器，但是我试过的已经代表了一定的多样性。 I tried different computers, but my once succesfull web sites failed.我尝试了不同的计算机，但我曾经成功的 web 站点失败了。 It felt like as the setting had never worked, but it has worked perfectly for many years.感觉就像这个设置从来没有奏效过，但它多年来一直运作良好。 As such code is taught in popular courses such as W3 Schools, it should work.由于此类代码在 W3 Schools 等热门课程中有教授，因此它应该可以工作。 I had not changed anything of the code.我没有更改任何代码。 So, I wondered whether this feature had been removed globally for any security reasons.因此，我想知道是否出于任何安全原因在全球范围内删除了此功能。 But if so, the most simple processes of the world wide web would not work any longer.但如果是这样，世界范围内最简单的流程 web 将不再有效。 This is obviously not the case.显然不是这样。 A simple html file linked to a javascript code using AJAX is one of the most basic features of web programming, isn't it?使用 AJAX 链接到 javascript 代码的简单 html 文件是 web 编程的最基本功能之一，不是吗？ Thus, there seems to be an error or cause which I cannot find.因此，似乎存在我找不到的错误或原因。

I have been waiting and trying all solutions I could think of, but it seems there is only one way to get out of this dead end: Asking you, dear programmers.我一直在等待并尝试所有我能想到的解决方案，但似乎只有一种方法可以走出这个死胡同：问问你，亲爱的程序员。 I think many of you have much more experience than me, as I know only very basic issues of web design.我认为你们中的许多人比我更有经验，因为我只知道 web 设计的非常基本的问题。 I would be thankful if you can let me know in case you can think of any cause and/or solution for my problem.万一您能想到我的问题的任何原因和/或解决方案，如果您能告诉我，我将不胜感激。

For easier understanding, I give here the basic sample code which is almost the same in all my projects:为了便于理解，我在这里给出了在我所有项目中几乎相同的基本示例代码：

This is the address (please look at the last two characters):这是地址（请看最后两个字符）：

file:///C:/MyProgrammes/SampleProgramme/Site.html?1

This is the Site.html file:这是 Site.html 文件：

<!DOCTYPE html>
<html>

<head>
<link href="Design.css" rel="stylesheet"/>
<script src="Programme.js"></script>
</head>

<body>
<div id="ShowResult"></div>
</body>

</html>

This is the Programme.js file:这是 Programme.js 文件：

var List;                                           // this variable is defined globally here
var GetContent = new XMLHttpRequest();              // start of AJAX, receivinig contents of the txt file
GetContent.open('GET','Contents.txt',true);
GetContent.send();
GetContent.onreadystatechange = function () {
    if (GetContent.readyState == 4) {
        List = GetContent.responseText.split("\n");
    }
}                                                   // end of AJAX

document.getElementById('ShowResult').innerHTML = List[1];

This is a sample of the Contents.txt file:这是 Contents.txt 文件的示例：

Grass is green.
The sky is blue.
Clouds are white.

Furthermore, there is a Design.css file which still works the usual way.此外，还有一个 Design.css 文件仍然可以正常工作。

Now, I expect the screen to display "The sky is blue.".现在，我希望屏幕显示“天空是蓝色的”。 It worked perfectly, but now it doesn't.它工作得很好，但现在不行了。 Please help me if you know a solution!如果您知道解决方案，请帮助我！

Best regards,最好的祝福，

Johannes约翰内斯

Answer 1

This looks like it is probably a result of security fix referenced at the below:这看起来可能是以下引用的安全修复的结果：

https://www.mozilla.org/en-US/security/advisories/mfsa2019-21/#CVE-2019-11730 https://www.mozilla.org/en-US/security/advisories/mfsa2019-21/#CVE-2019-11730

A disussion on the subject at:关于该主题的讨论：

https://bugzilla.mozilla.org/show_bug.cgi?id=1566051 https://bugzilla.mozilla.org/show_bug.cgi?id=1566051

suggests you now need to explictly enable reading of local files by setting:建议您现在需要通过设置明确启用本地文件的读取：

privacy.file_unique_origin preference

HTML 文件和 Javascript 文件与 AJAX 不能相互工作

问题描述

1 个解决方案

解决方案1
0 已采纳 2020-10-07 16:27:27

HTML 文件和 Javascript 文件与 AJAX 不能相互工作

问题描述

1 个解决方案

解决方案1 0 已采纳 2020-10-07 16:27:27

解决方案1
0 已采纳 2020-10-07 16:27:27