Веб-сервер узла Js всегда ссылается на одну и ту же страницу

#javascript #html #node.js #express

Вопрос:

Я пытаюсь создать веб — страницу с несколькими HTML-страницами.

С помощью следующего кода я могу перейти по ссылке на страницу входа, но страница localstores также ссылается на вход.

 const express = require('express')
const app = express()
const port = 3000
var path = require("path");
var request = require('request');
const { get } = require('./routes/brand');

//Static files
app.use(express.static('public'))
app.use('/css', express.static(__dirname  'public/css'))
app.use('/img', express.static(__dirname  'public/img'))
app.use('/js', express.static(__dirname  'public/js'))


app.get('/',(req, res) => {
   res.sendFile(path.join(__dirname  '/views/brand.html'));
})

   app.route('/*').get(function(req, res)  {
        res.sendFile(path.join(__dirname  '/views/login.html'));
});

app.route('/*').get(function(req, res)  {
   res.sendFile(path.join(__dirname  '/views/localstores.html'));
});

// listen on port 3000

app.listen(port,() => console.info(`Listening on port ${port}`))

 

В HTML-файле у меня есть отдельные кнопки, связанные с отдельными страницами, вот так :

 <a href ="login.html">
    SIGN IN</a></p>
</div>

<a href ='localstores.html'>LocalStores</a>

 

Я надеюсь, что кто — нибудь сможет мне в этом помочь. Я очень новичок в HTML и NodeJS.

Ответ №1:

app.route('/*').get будет выполняться для всех запросов get, таких как навигация. Так как у вас есть login.html сначала его вернут.

Вы можете удалить эти строки и обновить href в своем html-файле, чтобы он был:

  <a href ='/views/localstores.html'>LocalStores</a>
 

Альтернативно, вы можете изменить его на:

   <a href ='/localstores'>LocalStores</a>
 

и добавьте:

     app.route('/localstores').get(function(req, res)  {
        res.sendFile(path.join(__dirname  '/views/localstores.html'));
});

 

Комментарии:

1. если я попробую сделать это вот так, то получу только «Не могу ПОЛУЧИТЬ /localstores.html» в качестве ответа.

2. смотрите мое обновление, второй способ лучше

3. попробовал, но я все равно получу «не могу получить /localstores..html

4. попробуйте удалить расширение .html в href

5. да, спасибо, я не заметил, что вы оставили .html. это сработало. Спасибо!

Ответ №2:

     app.route('/*').get(function(req, res)  {
        res.sendFile(path.join(__dirname  '/views/login.html'));
});

app.route('/*').get(function(req, res)  {
   res.sendFile(path.join(__dirname  '/views/localstores.html'));
});
 

похоже, они влияют на один и тот же маршрут. похоже, экспресс просто использует первый объявленный.

Мое предложение состояло бы в том, чтобы попробовать это, чтобы каждая страница имела свой собственный индивидуальный маршрут:

 app.route('/login').get(function(req, res)  {
        res.sendFile(path.join(__dirname  '/views/login.html'));
});

app.route('/localstores').get(function(req, res)  {
   res.sendFile(path.join(__dirname  '/views/localstores.html'));
});
 

Ответ №3:

когда вы это сделаете:

      app.route('/*').get(function(req, res)  {
     res.sendFile(path.join(__dirname  '/views/login.html'));
                                                       }); 
 

это в основном означает, что каждый клиент/пользователь, который обращается к любому маршруту после / запуска этой функции в корневом каталоге, возвращает login.html страницу, что /* и означает.

вместо этого попробуйте указать различные маршруты на обе страницы, как это:

    app.get('/login',function(req, res)  {
    res.sendFile(path.join(__dirname  '/views/login.html'));
  });

  app.get('/localstores',function(req, res)  {
  res.sendFile(path.join(__dirname  '/views/localstores.html'));
  });
 

и в вашем HTML вместо того, чтобы указывать имена файлов, вы должны просто использовать определенные вами маршруты, и Express обработает отправку соответствующего файла клиенту

   <a href ="login">
  SIGN IN</a></p>
  </div>

  <a href ="localstores">LocalStores</a>