Почему для моей домашней страницы задан c URL вместо обычного '/'? - PullRequest
Новая
       6

Почему для моей домашней страницы задан c URL вместо обычного '/'?

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

Я работаю над этим приложением, и во время отладки я заметил, что всякий раз, когда я физически обновляю sh страницу и при начальной загрузке приложения, домашняя страница по умолчанию, кажется, перенаправляется на маршрут /search , Вместо этого я бы хотел, чтобы на домашней странице по умолчанию был установлен маршрут /; какие-либо идеи относительно того, где в приложении искать эту ошибку / как установить маршрут / в качестве домашней страницы по умолчанию?

Вот мой файл app.js со всеми маршрутами (это * Файл 1007 * в папке `frontend): 

const App = () => (
    <div className="app-wrapper">
        <Modal />
        <NavBarContainer />

        <div className="app-main-content-wrapper">
          <Switch>
            <Route exact path="/" component={SpotIndex} />
            <Route exact path="/spots/:spotId" component={SpotDetail} />
            <Route exact path="/search" component={SearchContainer} />
          </Switch> 
        </div>
    </div>
);

Вот мой app.js, который находится в каталоге root (вне папки frontend): 

const express = require('express');
const app = express();
const mongoose = require('mongoose');
const db = require('./config/keys').mongoURI;
const bodyParser = require('body-parser');
const passport = require('passport');
const path = require('path');
const users = require('./routes/api/users');
const spots = require('./routes/api/spots');

// Loading static build folder for production
if (process.env.NODE_ENV === 'production') {
    app.use(express.static('frontend/build'));
    app.get('/', (req, res) => {
        res.sendFile(path.resolve(__dirname, 'frontend', 'build', 'index.html'));
    })
}

// Using mongoose to connect to Mongo database with success and error messages
mongoose
    .connect(db, {
        useNewUrlParser: true,
        useUnifiedTopology: true
    })
    .then(() => console.log('Connected to MongoDB successfully'))
    .catch(err => console.log(err));

// Respond to JSON requests and requests from other software (i.e. Postman)
app.use(bodyParser.urlencoded({ extended: false }));
app.use(bodyParser.json());

// Uses the right port when in development and in production
const port = process.env.PORT || 5000;
app.listen(port, () => console.log(`Server is running on port ${port}`));

// Requests for these routes uses the specified callback function
app.use('/api/users', users);
app.use('/api/spots', spots);

// Middleware for Passport
app.use(passport.initialize());

// Configuration file for Passport
require('./config/passport')(passport);

// Route for serving static assets
// Makes content under the public directory accessible
// i.e. In components, <img src='/images/splash.jpg' />
app.use('/images', express.static(path.join(__dirname, 'public')))

ОБНОВЛЕНИЕ: Я только что попытался изменить домашний маршрут (маршрут /) на: <Route path="/" component... />, и домашняя страница стала правильной, но я не думаю, что это сработает, потому что тогда SpotIndex компонент всегда будет отображаться на любой другой веб-странице.

1 Ответ

0 голосов
/ 17 февраля 2020

просто нужно провести рефакторинг app.js во внешнем интерфейсе следующим образом: 

const App = () => (
    <div className="app-wrapper">
        <Modal />
        <NavBarContainer />

        <div className="app-main-content-wrapper">
          <Switch>
            <Route exact path="/" component={SpotIndex} />
            <Route path="/spots/:spotId" component={SpotDetail} />
            <Route path="/search" component={SearchContainer} />
          </Switch> 
        </div>
    </div>
);

теперь ваша домашняя страница по умолчанию будет /

...