Question

我有一个静态HTML页面，hello.html。如果我双击hello.html，它会在我的默认浏览器中打开，并正确显示HTML，但是在浏览器的搜索栏中，而不是具有主机名的URL，显示的是我的hello.html的本地文件路径计算机。

我使用express（node.js）在我的计算机上创建了一个简单的快速Web服务器。它设置为侦听端口8080，并具有简单的GET api。（API现在做的很简单，比如调用'ls'）。我希望能够从我的静态hello.html调用那个GET API。在我的静态HTML页面中，我使用jquery对此api进行ajax调用，将其称为http://127.0.0.1:8080/myapi。一旦我启动快速服务器并加载页面，查看控制台日志，当我在浏览器中加载静态HTML页面时，myapi的请求就会通过（ls响应会在控制台上记录），但是，jquery HTML页面中的ajax始终执行错误功能，即使我将响应设置为200。

我正在阅读很多关于为什么会发生这种情况的内容，并且阅读它可能是由于CORS问题。但是，我没有在服务器端指定的主机名，在这种情况下允许，因为实际上没有运行Web服务器，因此没有与我的静态HTML页面关联的实际主机名。

这甚至可以吗？（要在没有运行Web服务器的计算机上安装静态HTML页面，请使用API创建自己的快速服务器，并从静态网页调用这些API？）

示例：

hello.html的

<html>
<head>
<title>Hello World</title>
</head>
<body>
<script src"js/jquery.js"></script>
<script type="text/javascript">
$(document).ready(function() {
     $.ajax({
        type: "GET",
        url: "http://127.0.0.1:8080/myapi",
        contentType: 'application/json',
        success: function(response) {
               alert("success!");
        },
        error: function(jqXHR, textStatus, errorThrown) {
                alert("error");
        },
    });
});
</script>


<p>Hello World!</p>
</body>
</html>

myserver.js：

var express = require('express');
var shelljs = require('shelljs');
var app = express();

app.get('/myapi', function (req, res) {

      shellStr = shelljs.exec('ls');
      if ( shellStr ) {
            console.log("successful call on server side");
            res.status(200);
            res.json({ ls: shellStr });
      }
      else {
           console.log("failure status on server side");
           res.status(500).json({ error: "Could not do ls"});
      }
})

var server = app.listen(8080, function() {
     console.log("Listening on 8080");
})

我通过给'node myserver.js'启动服务器，然后在浏览器中打开静态HTML页面。当它加载时，正在进行API调用，因为我看到了服务器端控制台输出，并且它正在成功。但是，回到静态html中，总是执行ajax调用的'error'函数。

Answer 1

我得到了它的工作！

如果有其他人想知道，并且是像我这样的表达和网络服务器的新手。

关键是要快递服务hello.html。这样做很简单。

我的快递服务器在这样的目录中：

myserver / myserver.js＆lt; - 这是我的快递服务器

我将所有静态html文件移动到同一级别的目录中。

myserver / htmlfiles /＆lt; - 这个目录有'hello.html'。

现在，在myserver.js中，我在var app = express（）之后的顶部附近添加了以下行：

app.use(express.static('myhtml'))

这样做，是否会告诉express提供目录myhtml中的任何静态文件（将搜索该目录，相对于myserver.js所在的位置。）

如果我重新启动快速服务器（杀死当前的服务器然后再次运行'node myserver.js'），然后转到浏览器，如果我访问http://127.0.0.1:8080/hello.html - 页面会显示出来！

现在域名来源是相同的，当对api进行ajax调用时，它在浏览器中也是成功的！

（注意 - 在这些更改之后我确实遇到了问题，因为我在hello.html中的ajax网址正在调用http://localhost:8080/myapi，但我通过http://127.0.0.1:8080/hello.html在浏览器中显示了hello.html。一旦我将调用的ajax URL更改为http://127.0.0.1:8080/myapi - 一切正常。同样，如果我打开浏览器并转到http://localhost:8080/hello.html并以这种方式显示hello.html，如果调用的ajax URL是{{ 3}} - ajax调用将进入'error'函数。似乎你在HTML页面的ajax URL中使用的主机名必须与主机名相同（127.0.0.01 vs. localhost）用来在调用时访问浏览器中的html页面。）

从主机

1 个答案: