Question

这个问题应该很简单，我不好意思问，但我不明白它发生了什么。

我有一个非常简单的html文件，它只通过脚本标记引用一个javascript文件。当这个html文件从域的根目录提供时，它可以完美地运行。但是，当它从子路径提供时，它不起作用。

原因是因为浏览器要求脚本标记到域的根目录，这显然是错误的。

html文件如下：

<!DOCTYPE html>
<html lang="en">
    <head>
        <meta charset="utf-8">
        <meta name="viewport" content="width=device-width,initial-scale=1">
        <link rel="manifest" href="manifest.json">
        <meta name="mobile-web-app-capable" content="yes">
        <title>Licenses manager</title>
    </head>
    <body>
        <noscript>
            If you're seeing this message, that means <strong>JavaScript has been disabled on your browser</strong>
            , please <strong>enable JS</strong>
            to make this app work.
        </noscript>
        <div id="app"></div>
        <script type="text/javascript" src="main.82f885da14b87d36c0f1.js"></script>
    </body>
</html>

如您所见，脚本标记没有任何前面的斜杠/，因此它应该被解释为相对于当前域。但是，如果我检查网络选项卡，我可以看到浏览器询问域的根https://example.com/main.82f885...js

为什么会这样？

**编辑以澄清**

我很抱歉没有明确说两个文件都处于同一级别。子路径由负载均衡器添加。公用文件夹上的文件是这样的：

| - index.html | - main.82f885da14b87d36c0f1.js

负载均衡器有一条规则将请求发送到/licenses到特定服务器。因此，如果浏览器要求http://example.com/licenses/main.js，则会提供正确的文件。但是，浏览器不是将请求保留在同一子路径下，而是询问域的根目录。

Answer 1

对于所有资产的引用都是如此。你误以为的是相对路径（没有前导/）是它与根域不相关。它与您所在页面的当前URL有关。例子：

一个文件夹深

http://domain/first/page.html

正确的相对路径：

<script type="text/javascript" src="../main.82f885da14b87d36c0f1.js"></script>

正确的绝对路径（也可以考虑相对于域名）：

<script type="text/javascript" src="/main.82f885da14b87d36c0f1.js"></script>

以上两者的翻译绝对路径：

<script type="text/javascript" src="http://domain/main.82f885da14b87d36c0f1.js"></script>

两个文件夹

http://domain/first/second/page.html

正确的相对路径：

<script type="text/javascript" src="../../main.82f885da14b87d36c0f1.js"></script>

正确的绝对路径（也可以考虑相对于域名）：

以上两者的翻译绝对路径：

<script type="text/javascript" src="http://domain/main.82f885da14b87d36c0f1.js"></script>

没有前面斜杠的脚本标记将转到root

1 个答案: