簡體   English   中英

我無法重定向到 Node.js API 中的 HTML 頁面

[英]I am unable to redirect to a HTML page in Node.js API

我有幾個 API 端點 /auth/register 和 /auth/login 和 /auth 是基礎 URL 並且在 /register 和 /login 上有端點。

我的文件夾結構是:

在此處輸入圖像描述

我正在從 app.js 重定向注冊頁面,它可以工作:

app.get('/', (req, res, next) => {
  res.set({ 'Access-Control-Allow-Origin': '*' })
  return res.redirect('signup.html')
  // res.status(200).send('Yes, working')
})

但是當我點擊注冊頁面上的提交按鈕時,它不會重定向到登錄頁面。 這是注冊頁面:

<!DOCTYPE html>
<html>
    <head>
        <title>Signup</title>
        <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" integrity="sha384-BVYiiSIFeK1dGmJRAkycuHAHRg32OmUcww7on3RYdg4Va+PmSTsz/K68vbdEjh4u" crossorigin="anonymous">
        <link rel="stylesheet" type="text/css" href="style.css">
    </head>
    <body>
        <br>
        <br>
        <br>
        <div class="container" >
            <div class="row">
                <div class="col-md-3">
                </div>
                <div class="col-md-6 main">
                    <form action="/auth/register" method="post">
                        <h1> Signup form </h1>
            <input class="box" type="text" name="firstName" id="firstName" placeholder="Enter your First Name"  required /><br>
            <input class="box" type="text" name="lastName" id="lastName" placeholder="Enter your Last Name"  required /><br>
                        <input class="box" type="email" name="email" id="email" placeholder="Enter your E-Mail " required /><br>
                        <input class="box" type="password" name="password" id="password"  placeholder="Enter your Password " required/><br>
                        <input class="box" type="text" name="role" id="role"  placeholder="Enter your Role " required/><br>
                        <br>
                        <input type="submit" id="submitDetails"  name="submitDetails" value="Submit Your Details" /><br>
                    </form>
                </div>
                <div class="col-md-3">
                </div>
            </div>
        </div>
    </body>
</html>

我的 /auth/register API

router.post('/register, (req, res, next) => {
res.redirect('signin.html')
//also tried ../public/signin.html
//also tried sendFile but it unable to load css file
})

因此,我似乎犯了與路徑相關的錯誤,因為當我從 app.js 加載時它可以工作,但是當 /auth/register 運行駐留在 auth 文件夾中時,它無法重定向。

 return res.redirect('signup.html')

 redirect(url)

您將用戶重定向到一條路線,因此您必須通過 url。 例如:

redirect("/myPage")

為了向客戶端顯示此端點,您應該已經定義了此端點。 但看起來您想發送 html 文檔,而不是將用戶重定向到不同的路線。 所以你應該有:

 res.sendFile("signup.html")

編寫此代碼后,express 將自動查找 static 文件夾。 所以你應該已經告訴 express 公開文件的位置。 然后快遞將 go 在公用文件夾和公用文件夾內查找 signup.html 並發送。

這就是您告知 express static 文件位置的方式。

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

這意味着根目錄中“公共”文件夾內的文件是公開可用的。

由於express.static是一個中間件 function,所以這個必須放在路由之前。 因為在這種情況下

router.get("/myPage",(req,res)=>{
res.sendFile("signup.html")})

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

當客戶端點擊“,myPage”端點時,由於此端點不知道公用文件夾的位置,您的應用程序將拋出錯誤。

您放置的此代碼具有不同的目的:

router.post('/register, (req, res, next) => {
res.redirect('signin.html')
//also tried ../public/signin.html
//also tried sendFile but it unable to load css file
})

router.post 表示向“/register”發送 POST 請求。 發布請求是客戶端發送一些數據或向端點提交表單時。 但是訪問一個網站是一個 GET 請求。 因此,如果您想向用戶顯示某些內容,則需要使用router.get()

暫無
暫無

聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.

 
粵ICP備18138465號  © 2020-2024 STACKOOM.COM