Не удается отобразить HTML с экспресс-маршрутизатором и паспортом: ошибка неверного запроса или не найден - PullRequest
Новая
       20

Не удается отобразить HTML с экспресс-маршрутизатором и паспортом: ошибка неверного запроса или не найден

0 голосов
/ 24 января 2019

У меня есть express Router, настроенный для url, который начинается с /auth.Внутри файла, в котором определены маршруты /auth, я посылаю целую страницу html, чтобы запустить мое приложение React.На странице html у меня есть много статических ресурсов, которые должны ссылаться на папку public.К сожалению, этого не происходит.Я думаю, что мне нужно дополнительно перенаправить или установить статические ресурсы для самого файла Router.Вот основной app.js файл, соответствующий коду: 

var express = require('express');
var app = express();
app.use(express.static(path.join(__dirname, '/public/')));
app.use(express.static(__dirname + '/node_modules/'));
var index = require('./routes/index');
app.use('/auth', index);

Внутри index.js Я пытаюсь открыть страницу html: 

var express = require('express');
var router = express.Router();
var path = require('path');

router.get('/:id', function(req, res) {
  userAuthId = req.params.id;
  console.log(userAuthId);
  console.log("router of index.js is sending app.html");
  var appPath = path.join(__dirname, '..', 'public', 'app.html');
  res.sendFile(appPath);
});

В app.jsfile перенаправление происходит при входе в систему на /auth/:id.Middleware запускает метод router.get, который вы видите выше, и я вижу в нем console.log() выходные данные.Однако я получаю 404 Not Found ошибку.Я проверил appPath и это правильно: я могу открыть ссылку в браузере вручную.Итак, я думаю, что это может быть проблема статических ресурсов, определенных на самой странице, но не полностью уверенных.app.html выглядит так: 

<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
    <meta name="theme-color" content="#000000">
    <!--
      manifest.json provides metadata used when your web app is added to the
      homescreen on Android. See https://developers.google.com/web/fundamentals/engage-and-retain/web-app-manifest/
    -->
    <link rel="manifest" href="%PUBLIC_URL%/manifest.json">
    <link rel="shortcut icon" href="%PUBLIC_URL%/favicon.ico">
    <link rel="stylesheet" href="/stylesheets/pretty-checkbox.min.css">
    <link rel="stylesheet" href="/stylesheets/nv.d3.css">
    <link rel="stylesheet" href="/stylesheets/autosuggest.css">
    <link rel="stylesheet" href="/stylesheets/sidebar.css">
    <link rel="stylesheet" href="/stylesheets/main.css">
    <link rel="stylesheet" href="/stylesheets/distrochart.css">
    <link rel="stylesheet" href="/stylesheets/gene-tree-chart.css">
    <link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css"
    rel="stylesheet" integrity="sha384-BVYiiSIFeK1dGmJRAkycuHAHRg32OmUcww7on3RYdg4Va+PmSTsz/K68vbdEjh4u" crossorigin="anonymous">
    <title>React App</title>
  </head>
  <body>
    <noscript>
      You need to enable JavaScript to run this app.
    </noscript>
    <div id="root"></div>
    <!--
      This HTML file is a template.
      If you open it directly in the browser, you will see an empty page.

      You can add webfonts, meta tags, or analytics to this file.
      The build step will place the bundled scripts into the <body> tag.

      To begin the development, run `npm start` or `yarn start`.
      To create a production bundle, use `npm run build` or `yarn build`.
    -->
    <script type="text/javascript" src="bundle.js" charset="utf-8"></script>
    <script type="text/javascript" src="cacheJS.js" charset="utf-8"></script>
    <script type="text/javascript" src="distrochart.js" charset="utf-8"></script>
  </body>
</html>

Я также использую passport, и на самом деле нужно иметь следующее: 

app.use('/auth', passport.authenticate(['facebook-token', 'local-signup']), index);

Если я делаю это таким образом, япросто получаю ошибку 400 Bad Request для перенаправления /auth/:id.Будем весьма благодарны за любые предложения.

Также может представлять интерес следующее: реальное место, где происходит перенаправление на /auth/:id: 

app.post('/login', function(req, res, next) {
  passport.authenticate('local-signup', function(err, user, info) {
    console.log('passport callback');
    console.log(err);
    console.log(info);
    if (err) { return next(err); }
    if (!user) { return res.status(401).json(info); }
    req.logIn(user, function(err) {
      console.log('logIn function of /login path');
      if (err) { return next(err); }
      return res.redirect('/auth/' + user.local.username);
    });
  })(req, res, next);
  console.log('end of login function');
});

Итак, из моего понимания passport обратный вызов успешно завершен, поскольку происходит перенаправление.

Обновление

Прошло 2 месяца, но я все еще не смог заставить его работать.Попытался сдаться passport.authenticate, чтобы сделать: 

app.post('/login', function(req, res, next) {
  if(req.isAuthenticated()) {
    res.redirect('/auth/' + req.user.local.username);
  }
  return res.redirect('/login');
})

Как предлагается здесь:

https://github.com/jaredhanson/passport/issues/371

Не удалось.Я считаю, что я перепробовал почти все в Интернете, что я мог найти, и ничего не работает.Я думаю отказаться от passport в целом.

...