Javascript Window.history API-404，因为我在URL上/

我正在学习使用window.history.pushState

我有三个链接：

 <a href="/">Home</a>
 <a href="/skills">Skills</a>
 <a href="/experiences">Experiences</a>

这是我的密码：

(function() {
function loadHtml(url, cb) {
    var xhttp = new XMLHttpRequest();
    xhttp.onreadystatechange = function() {
        if (this.readyState == 4 && this.status == 200) {
            cb(this.responseText);
        }
    };
    xhttp.open("GET", url, true);
    xhttp.send();
}

function setHrefEvents() {
    var links = document.getElementsByClassName('menu')[0].getElementsByTagName('li');

    for (i = 0; i < links.length; i++) {
        links[i].getElementsByTagName('a')[0].addEventListener('click', function(e) {
            e.preventDefault();
            window.history.pushState({
                    urlPath: 'views/' + (e.target.pathname.match(/\/([a-z]*)/)[1] || 'home') + '.html'
                },
                e.target.pathname.match(/\/([a-z]*)/)[1], e.target.pathname);
            loadHtml(window.history.state.urlPath, function(html) {
                document.getElementsByTagName('main')[0].innerHTML = html;
            });
        });
    }
}

function setUrl() {
    window.history.pushState({
        urlPath: 'views/' + (window.location.pathname === '/' ? 'home' : window.location.pathname) + '.html'
    }, 'Title', window.location.pathname);
    loadHtml(window.history.state.urlPath, function(html) {
        document.getElementsByTagName('main')[0].innerHTML = html;
    });
    return;
}

function setFooter() {
    document.getElementsByClassName('footer-date')[0].innerHTML = new Date().getFullYear();
}

setFooter();
setUrl();
setHrefEvents();
})();

（函数（）{
函数loadHtml（url，cb）{
var xhttp=newXMLHttpRequest（）；
xhttp.onreadystatechange=函数（）{
if（this.readyState==4&&this.status==200）{
cb（this.responseText）；
}
};
xhttp.open（“GET”，url，true）；
xhttp.send（）；
}
函数setHrefEvents（）{
var links=document.getElementsByClassName（'menu'）[0].getElementsByTagName（'li'）；
对于（i=0；i

当我点击一个链接时，历史状态被很好地推送，我的内容被正确加载。但是，例如，当我在

localhost/skills

上重新加载页面时，我有404

我的问题是，我如何才能不拥有404

localhost/skills

我不知道这是否有帮助，但我在nginx服务器上运行我的网站。 很明显，我错过了一些东西，我不知道是什么

谢谢你的帮助

我找到了解决办法

这是关于我的web服务器的配置

在这里：

这是nginx+JavaScript历史API的工作配置

希望这会有帮助