React Symfony assets Блокировка загрузки смешанного активного контента - PullRequest
Новая
       7

React Symfony assets Блокировка загрузки смешанного активного контента

0 голосов
/ 26 апреля 2020

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

Blocked loading mixed active content screen shot

База Symfony. html .twig файл: 

<!DOCTYPE html>
<html>
    <head>
        <meta charset="UTF-8">
        <title>{% block title %}Welcome! Tarik{% endblock %}</title>
        {% block stylesheets %}{% endblock %}
    </head>
    <body>
        {% block body %}{% endblock %}
        {% block javascripts %}{% endblock %}
        {% include 'react-symfony-templates/index.html.twig' %}
    </body>
</html>

Моя index. html .twig file: 

<script src="{{ asset('build/layout.js') }}"></script>
<script src="{{ asset('build/rep_log_react.js') }}"></script>

Я только начинаю проект, так что это все, что у меня есть, но без макета. js и rep_log_react. js загрузка файлов, тогда нет файлов реакции для загрузки проекта symfony.

Я также попытался заключить теги сценария в индекс. html .twig: 

{% block javascripts %}
    <script src="{{ asset('build/layout.js') }}"></script>
    <script src="{{ asset('build/rep_log_react.js') }}"></script>
{% endblock %}

Все еще та же ошибка. Еще раз, я знаю, что я делал это раньше, и я уверен, что мне не хватает чего-то маленького, например, не использовать symfony подачу или что-то еще, но мне нужны некоторые свободные sh глаза, чтобы просмотреть это.

Как обычно, заранее спасибо

1 Ответ

0 голосов
/ 26 апреля 2020

Я редактирую свой ответ, потому что это не постоянное решение. Оказывается, если я выключу сервер на бис и сервер symfony, то все ссылки вернутся к http. Как я могу настроить это, чтобы указать https://localhost: 8080 / сборка

Второе редактирование

Вот решение - когда при запуске сервера разработки на бис используйте следующие флаги 

sudo yarn encore dev-server --port 8080 --https --hot

После этого следует добавить исключения безопасности в ваш браузер

В основном следующая команда Это все, что нужно, но я столкнулся с несколькими ошибками, которые мне пришлось исправить. Во-первых, командная строка, которая позволяет на бис запускать каталог сборки на локальном хосте: 8080 / build 

yarn encore dev-server --hot

Когда я выполнил вышеупомянутую команду, я получил сообщение об ошибке. json отсутствует, что привести к серии команд. Поскольку я нахожусь на ма c, мне приходилось использовать sudo в начале каждой команды 

sudo yarn add --dev @symfony/webpack-encore
sudo yarn add webpack-notifier --dev
sudo yarn encore dev

Затем следовало изменить следующие файлы, чтобы они отображали «https» вместо «http» / public /build/manifest.json - Я отключаю оба сервера перед изменением следующих файлов.

Я использую vi с помощью следующей команды для поиска и замены: 

%s/http:/https:/g

{
"build/admin.js": "https://localhost:8080/build/admin.js",
"build/app.css": "https://localhost:8080/build/app.css",
"build/app.js": "https://localhost:8080/build/app.js",
"build/layout.js": "https://localhost:8080/build/layout.js",
"build/runtime.js": "https://localhost:8080/build/runtime.js",
"build/vendors~admin.js": "https://localhost:8080/build/vendors~admin.js",
"build/vendors~admin~app~layout.js": "https://localhost:8080/build/vendors~admin~app~layout.js",
"build/vendors~admin~layout.js": "https://localhost:8080/build/vendors~admin~layout.js",
"build/vendors~app.js": "https://localhost:8080/build/vendors~app.js",
"build/vendors~layout.js": "https://localhost:8080/build/vendors~layout.js"
}

/ public / build /entrypoints.json

"entrypoints": {
  "layout": {
    "js": [
      "https://localhost:8080/build/runtime.js",
      "https://localhost:8080/build/vendors~admin~app~layout.js",
      "https://localhost:8080/build/vendors~admin~layout.js",
      "https://localhost:8080/build/vendors~layout.js",
      "https://localhost:8080/build/layout.js"
    ]
  },
  "app": {
    "js": [
      "https://localhost:8080/build/runtime.js",
      "https://localhost:8080/build/vendors~admin~app~layout.js",
      "https://localhost:8080/build/vendors~app.js",
      "https://localhost:8080/build/app.js"
    ],
    "css": [
      "https://localhost:8080/build/app.css"
    ]
  },
  "admin": {
    "js": [
      "https://localhost:8080/build/runtime.js",
      "https://localhost:8080/build/vendors~admin~app~layout.js",
      "https://localhost:8080/build/vendors~admin~layout.js",
      "https://localhost:8080/build/vendors~admin.js",
      "https://localhost:8080/build/admin.js"
    ]
  }
}
}

Перезагрузите оба сервера 

symfony server:start

В отдельном окне терминала 

yarn encore dev-server --hot

The proof is in the pudding - see the following screen shot

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.

Нет похожих вопросов

...