Express направлено не на ту конечную точку производства, но отлично работает на разработке - PullRequest
Новая
       5

Express направлено не на ту конечную точку производства, но отлично работает на разработке

5 голосов
/ 06 февраля 2020

express указывает на неверную конечную точку в производственной среде, но отлично работает при разработке. Я построил свое приложение, используя express для бэкэнда и реагируя на интерфейс и паспорт для аутентификации. Вот теперь я столкнулся с проблемой с конечной точкой /auth/google. когда я нажимаю на кнопку, она должна указывать на express конечную точку auth, но express указывает на реагирование приложения, не найденного компонента.

просто мое приложение не достигает конечной точки auth/google, а отображает страницу реакции

здесь коды

сервер. js

app.use('/auth', require('./router/auth')) // should direct here
app.use('/media', require('./router/media')) 
app.use('/admin', require('./router/admin')) 
app.use('/user', require('./router/user'))

const httpServer = http.createServer(app)

if (process.env.NODE_ENV === 'production') {
 app.use(favicon(path.join(__dirname, '../' + 'build', 'favicon.ico')))

 app.use(express.static(path.join(__dirname, '../' + 'build')));

 app.get("*", (req, res) => { // but always goes here
 res.sendFile(path.join(path.join(__dirname, '../' + 'build', 'index.html')));
  });
}

const PORT = 8080

httpServer.listen(PORT, () => {
 console.log('Server up at:' + PORT)
})

/ маршрутизатор / авторизация. js

router.get('/google', passport.authenticate('google', { // and should hit this 
  scope: ['profile', 'email']
}))
router.get(
  '/google/callback',
  passport.authenticate('google'),
  (req, res) => {
    req.app.set('user', res.req.user)
    return res.redirect('/auth/sign')
  }
)

module.exports = router

, паспорт. js

export default function (passport) {
  passport.serializeUser(function (user, done) {
    done(null, user)
  })

  passport.deserializeUser(function (user, done) {
    done(null, user)
  })

  // GOOGLE OAuth
  passport.use(
    new GoogleStrategy(
      {
        clientID: GOOGLE_CLIENT_ID,
        clientSecret: GOOGLE_CLIENT_SECRET,
        callbackURL: '/auth/google/callback'
      },
      function (_, __, profile, done) {
        profile = {
          ...profile,
          email: profile.emails && profile.emails[0].value,
          profileUrl: profile.photos && profile.photos[0].value
        }
        authUser(profile, done) // function for save user
      }
    )
  )
}

Приложение реакции. js


 <Switch>
          <Route path="/" exact component={Main} />
          <Route path="/home" exact component={Home} />
          <Route path="/ad/:id" exact component={Ad} />
          <PrivateRoute path="/postad" exact component={createAd} />
          <PrivateRoute path="/ad/edit/:id" exact component={UpdateAd} />
          <Route path="/user/:id" exact component={User} />
          <PrivateRoute path="/setting" exact component={Setting} />
          <PublicRoute path="/sign" exact component={ProviderSign} />
          <Route path="*" exact={true} component={PageNotFound} /> // but render this
 </Switch>

TLDR

Моя страница была также перенаправлена ​​на страницу реакции, когда она была установлена ​​"proxy": "http://localhost:8080", и После того, как я нашел этот http-proxy-middleware и установил прокси в клиентской папке sr c 

const proxy = require("http-proxy-middleware");

module.exports = app => {
  app.use(proxy("/auth/google", { target: "http://localhost:8080/" }));
  app.use(proxy("/auth/facebook", { target: "http://localhost:8080/" }));
};

, после этого все работает нормально, когда я запускаю свой сервер узлов на порту 8080 и клиент на порту 3000,

И это кнопка моей страницы входа, чтобы попасть в конечную точку /auth/google

<Button className={classes.authBtn}> 
 <a className={classes.removeStyle} href="/auth/google">Google</a>     
</Button>

1 Ответ

1 голос
/ 12 февраля 2020

Решение для меня - создать файл routes.js, например: 

const express = require("express");
const router = express.Router();

const authRouter = require('./router/auth');
const mediaRouter = require('./router/media');
const adminRouter = require('./router/admin');
const userRouter = require('./router/user');

router.get("/", function(req, res, next) {
  res.status(200).json({
    isSuccess: true,
    message: "Server is up and running!"
  });
});

app.use('/auth', authRouter); 
app.use('/media', mediaRouter); 
app.use('/admin', adminRouter); 
app.use('/user', userRouter);

router.get("*", (req, res) => {
  res.status(200).json({
    isSuccess: false,
    message: "Invalid address!"
  });
});

module.exports = router;

Измените файл server.js следующим образом: 

const httpServer = http.createServer(app);
const indexRouter = require("./routes"); // your routes.js

app.use("/api", indexRouter);

if (process.env.NODE_ENV === 'production') {
 app.use(favicon(path.join(__dirname, '../' + 'build', 'favicon.ico')))

 app.use(express.static(path.join(__dirname, '../' + 'build')));

 app.get("*", (req, res) => { // but always goes here
 res.sendFile(path.join(path.join(__dirname, '../' + 'build', 'index.html')));
  });
}

const PORT = 8080;

httpServer.listen(PORT, () => {
 console.log('Server up at:' + PORT)
})

И, наконец, измените свой auth.js as: 

router.get('/google', passport.authenticate('google', { // and should hit this 
  scope: ['profile', 'email']
}))
router.get(
  '/google/callback',
  passport.authenticate('google'),
  (req, res) => {
    req.app.set('user', res.req.user)
    return res.redirect('api/auth/sign') // Changed this endpoint
  }
)

module.exports = router

Этот подход разделяет ваш API и интерфейсные маршруты. Надеюсь, что это работает для вас.

...