使用NGINX服务静态网站和SPA(node.js)

时间:2019-01-29 13:52:47

标签: nginx

我需要一种使用NGINX服务静态html网站和SPA的方法。

因此,如果存在适当的静态html路由,则应将其与NGINX一起使用,而其他任何路由都应由node.js网络服务器提供。

例如

https://website.com/about->由NGINX提供服务,因为其中包含about.html https://website.com/register->由node.js服务,因为该路由没有合适的静态页面(没有register.html)。

我创建了以下配置,但似乎无法正常工作。

//This function will run all of the next questions
function ProcessNextQuestion(allQuestions, startingIndex = 0, dpObj = {}, questionNum = 1) {
    try {
        //create deep copy of Obj
        let copyDpObj = JSON.parse(JSON.stringify(dpObj))

        //Loop through all of the remaining questions
        for (let i = startingIndex; i < allQuestions.length; i++) {
            let question = allQuestions[i];

            for (let answerNum = 0; answerNum < question.potentialAnswers.length; answerNum++) {
                let answer = question.potentialAnswers[answerNum];

                //Determine if the current potential answer fits with the values already in the dpObj
                if (doesAnswerFitInCurrentDPObject(answer, copyDpObj)) {

                    //Add the new datapoints to the doObj if there are any new dps
                    let tempDPObj = addValuesToDpObj(answer, dpObj);

                    //if this is the final question then we have a valid path
                    if (questionNum === allQuestions.length) {
                        return tempDPObj;
                    } else {

              //******************
              // This is what I needed to add
              //******************
                        //recurively run on remaining questions
                        let processingResultFound = ProcessNextQuestion(allQuestions, i + 1, tempDPObj, questionNum + 1);
                        if (processingResultFound !== 'No matching values found') {
                            return processingResultFound;
                        }
              //******************

                    }
                }
            }
        }
        return 'No matching values found'

    } catch (err) {
        throw new Error(err)
    }
}

2 个答案:

答案 0 :(得分:2)

您的配置可能会简化为:

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.2.1/css/bootstrap.min.css" integrity="sha384-GJzZqFGwb1QTTN6wy59ffF1BuGJpLSa9DkKMp0DgiMDm4iYMj70gZWKYbI706tWS" crossorigin="anonymous">


<script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.14.6/umd/popper.min.js" integrity="sha384-wHAiFfRlMFy6i5SRaxvfOCifBUQy1xHdJ/yoi7FRNXMRBu5WHdZYu1hA6ZOblgut" crossorigin="anonymous"></script>
<script src="https://stackpath.bootstrapcdn.com/bootstrap/4.2.1/js/bootstrap.min.js" integrity="sha384-B0UglyR+jN6CkvvICOB2joaf5I4l3gm9GU6Hc1og6Ls7i6U/mkkaduKaBhlAXv9k" crossorigin="anonymous"></script>


<div id="demo">
  <p class="one" data-toggle="tooltip" data-placement="top" title="test">This is for testing.</p>
  <span class="two"></span>
  <span class="three"></span>

</div>

答案 1 :(得分:1)

您可以尝试类似

location / {
    try_files $uri $uri.html $uri/ @backend;
}

为您分解。 try_files指令

  

按指定顺序检查文件是否存在,并将找到的第一个文件用于请求处理;

所以

$uri-查找路径中定义的确切文件。对于诸如CSS,图像,js等静态文件有用。

$uri.html查找扩展名为.html的确切文件。这将使您的about.html

$uri/-将其查找为目录,然后使用index指令查找indexindex.html

@backend-发送到代理的应用程序将负责返回404

相关问题