Реагирует-маршрутизатор набрал-url и обновил на tomcat, elastic beanstalk

#reactjs #apache #tomcat #react-router #amazon-elastic-beanstalk

#reactjs #apache #tomcat #react-router #amazon-elastic-beanstalk

Вопрос:

Есть много вопросов по этой теме, которые заключаются в том, что typed URL и refresh не работают при использовании react на производстве, но я пытаюсь уже давно, и по какой-то причине это не работает.

Я использую React с Spring boot и tomcat. Я использую BrowserRouter для маршрутизации. Я развертываю приложение на aws elastic beanstalk. При развертывании я делаю следующее: запускаю npm run build , затем копирую полученные файлы в папке сборки в папку WebContent, затем экспортирую проект как файл war и развертываю его в aws.

Как я понял, основным решением для этого является сервер index.html файл для всех запросов, и я попробовал сделать это следующим образом: — добавьте следующее в /etc/httpd/conf/httpd.conf

 <VirtualHost *:80>
  DocumentRoot /var/lib/tomcat8/webapps/ROOT/
  ServerName domain.elasticbeanstalk.com

  AliasMatch ^/(.*)$ /var/lib/tomcat8/webapps/ROOT/index.html

  <Directory "/var/lib/tomcat8/webapps/ROOT">
    Options Indexes FollowSymLinks
    AllowOverride All
    Require all granted

    RewriteEngine On  
    RewriteCond %{DOCUMENT_ROOT}%{REQUEST_URI} -f [OR]
    RewriteCond %{DOCUMENT_ROOT}%{REQUEST_URI} -d
    RewriteRule ^/(.*)$ - [L]

    RewriteRule ^/(.*)$ /index.html [L]
  </Directory>
</VirtualHost>
 

Из вопросов, которые я прочитал, предлагается использовать /var/www/html, но я не понял, почему. Я пытался использовать его, скопировав все из ROOT в него, но также не сработало.

Я перепробовал много вариантов кода, который я поместил в файл конфигурации.

При настройке я получаю сообщение об ошибке SyntaxError: expected expression, got '<' . В Firefox я получаю The script from “http://awsdomain.com/static/js/2.7322c0fb.chunk.js” was loaded even though its MIME type (“”) is not a valid JavaScript MIME type.

и в Chrome я получаю ту же ошибку, но с файлами css, а не js.

На данный момент я предполагаю, что обслуживание index.html работает, но есть еще одна проблема, связанная с тем, что сервер пытается проанализировать некоторые файлы js или css, такие как html или текст, которые не будут работать. В любом случае, я понятия не имею, как указать браузеру правильно их анализировать и почему он анализирует их без ошибок обычным способом (без решения проблемы маршрутизации)? Я попытался добавить атрибут type к тегам link и script в index.html но ничего не вышло.

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

Ответ №1:

Моя проблема, наконец, исправлена. Следующее — мое последнее дополнение к httpd.conf

 <VirtualHost *:80>
  DocumentRoot /var/lib/tomcat8/webapps/ROOT/
  ServerName domain.elasticbeanstalk.com

  <Directory /var/lib/tomcat8/webapps/ROOT>
    Options FollowSymLinks MultiViews
    AllowOverride All
    Require all granted

    DirectoryIndex index.html

    <IfModule mod_rewrite.c>
      RewriteEngine On
      RewriteBase /
      RewriteRule ^index.html$ - [L]
      RewriteCond %{REQUEST_FILENAME} !-f
      RewriteCond %{REQUEST_FILENAME} !-d
      RewriteRule . /index.html [L]
    </IfModule>
  </Directory>
</VirtualHost>
 

Кроме того, раздражало, что dir_module не был включен по умолчанию, что необходимо DirectoryIndex . Чтобы включить его, добавьте LoadModule dir_module modules/mod_dir.so .