如何模擬本地站點的SSI

Question

我在一個本地站點上有一個導航欄代碼，而沒有要在很多頁面上使用的Web服務器。 我想有一個單獨的文件，其中包含所有頁面引用的導航欄的HTML。 這樣，每當需要對導航欄進行更新時，只需進行一次即可。

我正在使用此Bootstrap模板： https : //bootstrapmade.com/demo/Regna/

多年前，使用其他類型的導航欄系統，我能夠使用Javascript實現此目的。 我只是在想要導航欄的地方引用了文件，如下所示：

<script type="text/javascript" src="js/menu3.js"></script>

menu3.js是這樣的：

document.write("<div style='float: left' id='my_menu' class='sdmenu'>");

document.write("<div id='section1' class='collapsed'>");
document.write("<span class='menuheader'>SECTION 1</span>");
document.write("<a href='page1.html#anchor1'>Option 1</a>");
document.write("<a href='page1.html#anchor2'>Option 2</a>");
document.write("<a href='page1.html#anchor3'>Option 3</a>");
document.write("</div>");

document.write("<div id='section1' class='collapsed'>");
document.write("<span class='menuheader'>SECTION 2</span>");
document.write("<a href='page2.html#anchor1'>Option 1</a>");
document.write("<a href='page2.html#anchor2'>Option 2</a>");
document.write("<a href='page2.html#anchor3'>Option 3</a>");
document.write("</div>");

實際上效果很好。 現在，我正在使用其他導航欄設置，但該技術無效。 頁面上沒有任何顯示。 由於它是本地站點，因此無法使用PHP或SSI或其他我所熟悉的東西。

如何從本地站點上的外部文件中提取代碼？

Answer 1

如果未正確設置CORS，則在本地站點上使用外部資源將觸發相同的原始策略警告 ，並且也可能被外部頁面禁止。

由於它是您自己的本地頁面，因此建議您僅使用iframe並加載外部托管的header.html因為它可以為您提供最快的速度。

否則，我建議您使用npmjs模塊（例如local-webserver）設置本地網絡服務器，並配置CORS和上述鏈接文檔中概述的原始策略