Проблема с доступом к веб-страницам после размещения на сервере - PullRequest
Новая
       12

Проблема с доступом к веб-страницам после размещения на сервере

0 голосов
/ 04 июля 2019

Я создал веб-сайт с использованием React.JS, однако теперь я разместил веб-сайт `, но я не могу получить доступ к другим страницам, кроме главной страницы.Я создал веб-сайт с использованием компонентов реагирования, как показано ниже, может ли это быть проблемой?Например, после того, как я щелкну ссылку «О веб-странице», он направит меня на страницу 404, которая не найдена.Но в разработке моя навигационная система работает отлично? 

const Services = () => {

  return (
    <Container className='services' id='services'>
      <div className='container-fluid' style={textStyle}>
        <p>Do you need a website for your business?</p>
        <p>Do you have an app idea?</p>
        <p>Do you need advice on how to improve your website or app?</p>
        <p>Contact us!</p>
      </div>

      <div className='container-fluid' id='workflow' style={workflowTextStyle}>
        <Row>
          <Col>
            <i className='fas fa-comments fa-3x' />
            <p>Plan - Tell us what you need</p>
          </Col>
          <Col>
            <i className='fas fa-pencil-alt fa-3x' />
            <p>Design - How do you want your website to look and function</p>
          </Col>

          <Col>
            <i className='fas fa-code fa-3x' />
            <p>Development - Regular updates after developments</p>
          </Col>

          <Col>
            <i className='fas fa-check-circle fa-3x' />
            <p>Review - Customer Review Sessions throughout development</p>
          </Col>
        </Row>
      </div>
    </Container>
  );
};

export default Services;

Ответы [ 2 ]

1 голос
/ 04 июля 2019

Ознакомьтесь с документацией React https://facebook.github.io/create-react-app/docs/deployment о том, как запустить сервер реагирования на развертывание. В частности, я подозреваю, что это то, что вам нужно:

Если вы используете Apache HTTP Server, вам нужно создать файл .htaccess в общей папке, который выглядит следующим образом: 

Options -MultiViews
RewriteEngine On
RewriteCond %{REQUEST_FILENAME} !-f
RewriteRule ^ index.html [QSA,L]

Он будет скопирован в папку сборки при запуске npm run build.

Предостережение от комментария Квентина: Если вы хотите сделать свой сайт более индексируемым и доступным для SEO, другие решения, такие как NextJS, могут быть более подходящими для вашего проекта. https://nextjs.org/

0 голосов
/ 04 июля 2019

Я не эксперт по вопросам хостинга, но так как я столкнулся и решил эту проблему, я отвечу на свои способности.

При создании приложения реакции создается один файл index.html. Если вы обслуживаете через nginx, вы можете легко настроить все маршруты, которые будут направлены на этот index.html. Однако в среде общего хостинга (cpanel), когда вы загружаете свою сборку, она загружается в одну папку, и только маршрут к этой папке направляет к этому index.html, а запись любого другого маршрута направит вас в другой каталог общего хостинга, следовательно, вы сталкивается с проблемой 404. Решение - изменить файл .htaccess соответствующим образом.

...