TYPO3：如何通过控制器初始化操作和页面渲染器添加 css 和 js 文件？答案

【问题标题】：TYPO3: How could I add css and js files via controller initialize action and page renderer?TYPO3：如何通过控制器初始化操作和页面渲染器添加 css 和 js 文件？
【发布时间】：2018-01-08 11:02:52
【问题描述】：

我在控制器级别使用来自 TYPO3 8 的新页面渲染器通过 initializeAction 添加特定于扩展的 css 和 js 文件：

public function initializeAction()
{
    $extPath = ExtensionManagementUtility::siteRelPath(
        $this->request->getControllerExtensionKey()
    );

    $extJs = $extPath . 'Resources/Public/Js/ext_booking_manager.min.js';
    $extCss = $extPath . 'Resources/Public/Css/ext_booking_manager.css';

    /** @var PageRenderer $pageRenderer */
    $pageRenderer = $this->objectManager->get(PageRenderer::class);

    $pageRenderer->addCssFile($extCss);
    $pageRenderer->addJsFooterFile(
        $extJs, 'text/javascript', false
    );
}

这有时可以正常工作，但只是有时。这意味着有时会正确添加 css 文件和 js 文件，有时如果我重新加载页面，则无法正确添加文件。有什么问题吗？

对于像 TYPO3 7 这样的旧版本，我使用了类似的东西：

public function initializeAction()
{
    $extPath = ExtensionManagementUtility::siteRelPath(
        $this->request->getControllerExtensionKey()
    );

    $extJs = $extPath . 'Resources/Public/Js/ext_booking_manager.min.js';
    $GLOBALS['TSFE']->getPageRenderer()->addJsFooterFile(
        $extJs, 'text/javascript', false
    );

    parent::initializeAction();
}

但这不再适用于 TYPO3 8。有什么建议吗？

【问题讨论】：

标签： typo3 rendering extbase webpage-rendering

【解决方案1】：

请注意，在 TYPO3 v8 中使用模板中的 HeaderAssets and FooterAssets sections 可以使用不同的方法。因此，您的操作模板可能如下所示：

Your template code

<f:section name="FooterAssets">
  <link rel="stylesheet" href="{f:uri.resource(path: 'Css/ext_booking_manager.css')}"/>
  <script src="{f:uri.resource(path: 'Js/ext_booking_manager.min.js')}"></script>
</f:section>

这样您的控制器中不需要任何资源逻辑，因此您的 initializeAction() 方法可以被删除。

顺便说一句：我建议使用 JavaScript 作为 JavaScript 资源的目录名称，以符合 TYPO3 约定。

【讨论】：

好的，谢谢。太好了，我去看看，我也改一下js目录名:)。
好的，我已经删除了资源逻辑并更新了我的扩展模板，并且 FooterAssets 部分正在工作，但似乎我得到了与使用页面渲染器时相同的奇怪行为。有时会渲染资产，有时不会。你有什么想法吗？
您的操作是否始终完全缓存？我预计未缓存的操作会出现问题。
是的，我想是的。我也已将所有操作添加到我的扩展的 localconf 内的未缓存操作部分。 \TYPO3\CMS\Extbase\Utility\ExtensionUtility::configurePlugin( 'Fox.' . $extKey, 'P1', [ 'BookingItem' => 'new, create' ], [ 'BookingItem' => 'new, create' ] );
@Fox 你能解决你的问题吗？正如您在此处描述的那样，我遇到了完全相同的问题。 <f:section name="FooterAssets"> 有时未加载。我能够追踪到这个问题，因为它与缓存有关。一旦我禁用 TYPO3 缓存，它就可以正常工作 - 但这不是我想要的 :-)

【解决方案2】：

在 TYPO3 8 getPageRenderer() 方法已弃用。你可以在这里看到Deprecated Methods。

现在你可以在 TYPO3 8 中使用这个方法 Like this solution

【讨论】：

是的，我知道这一点，并且我已经在我的问题中发布了旧方式和新方式的两种变体......但我认为@Mathias Brodala 发布了更好的方式。目前我在页面渲染器或页脚资产部分遇到了同样的问题。文件将成功添加到页面，但如果我像 (strg + f5 for chrome) 那样硬重新加载页面，那么有时两个文件都消失了。不要在意我是否使用页面渲染器或页脚资产部分。