TYPO3 FAL图像扩展

Question

我在这里读了很多关于TYPO3中FAL图像的帖子。
我已经更新到TYPO3 v10，现在我需要用FAL渲染我的图像
我找不到让它从零开始工作的解决方案
我在自定义Fluid+Extbase扩展中使用此功能。

我得到的是FlexForm:

<settings.image>
<TCEforms>
<label>Headerbild</label>
<config>
<type>inline</type>
<maxitems>1</maxitems>
<foreign_table>sys_file_reference</foreign_table>
<foreign_table_field>tablenames</foreign_table_field>
<foreign_label>uid_local</foreign_label>
<foreign_sortby>sorting_foreign</foreign_sortby>
<foreign_field>uid_foreign</foreign_field>
<foreign_selector>uid_local</foreign_selector>
<foreign_selector_fieldTcaOverride>
<config>
<appearance>
<elementBrowserType>file</elementBrowserType>
<elementBrowserAllowed>gif,jpg,jpeg,png,svg</elementBrowserAllowed>
</appearance>
</config>
</foreign_selector_fieldTcaOverride>
<foreign_types type="array">
<numIndex index="0">
<showitem>--palette--;LLL:EXT:lang/locallang_tca.xlf:sys_file_reference.imageoverlayPalette;imageoverlayPalette,--palette--;;filePalette</showitem>
</numIndex>
<numIndex index="2">
<showitem>--palette--;LLL:EXT:lang/locallang_tca.xlf:sys_file_reference.imageoverlayPalette;imageoverlayPalette,--palette--;;filePalette</showitem>
</numIndex>
</foreign_types>
<foreign_match_fields>
<fieldname>image</fieldname>
</foreign_match_fields>
<appearance type="array">
<newRecordLinkAddTitle>1</newRecordLinkAddTitle>
<headerThumbnail>
<field>uid_local</field>
<height>64</height>
<width>64</width>
</headerThumbnail>
<enabledControls>
<info>1</info>
<new>0</new>
<dragdrop>0</dragdrop>
<sort>1</sort>
<hide>0</hide>
<delete>1</delete>
<localize>1</localize>
</enabledControls>
<createNewRelationLinkTitle>LLL:EXT:frontend/Resources/Private/Language/locallang_ttc.xlf:images.addFileReference</createNewRelationLinkTitle>
</appearance>
<behaviour>
<localizationMode>select</localizationMode>
<localizeChildrenAtParentLocalization>1</localizeChildrenAtParentLocalization>
</behaviour>
<overrideChildTca>
<columns type="array">
<uid_local type="array">
<config type="array">
<appearance type="array">
<elementBrowserType>file</elementBrowserType>
<elementBrowserAllowed>jpg,png,svg,jpeg,gif</elementBrowserAllowed>
</appearance>
</config>
</uid_local>
</columns>
<types type="array">
<numIndex index="2">
<showitem>--palette--;LLL:EXT:lang/locallang_tca.xlf:sys_file_reference.imageoverlayPalette;imageoverlayPalette,--palette--;;filePalette</showitem>
</numIndex>
</types>
</overrideChildTca>
</config>
</TCEforms>
</settings.image>

我现在如何访问这些图像
如果我调试它，我只会得到INT"1〃；在前端。

我知道我需要一个DataProcessor，但它应该放在哪里，具体放什么？

我有一个打字确认，我可以把处理器放在这里吗？：

page.includeCSS.filedsheader = EXT:dsheader/Resources/Public/Css/dsheader.css
page.includeJSFooter.filedsheader = EXT:dsheader/Resources/Public/Js/dsheader.js
plugin.tx_dsheader {
view {
templateRootPath = {$plugin.tx_dsheader.view.templateRootPath}
partialRootPath = {$plugin.tx_dsheader.view.partialRootPath}
layoutRootPath = {$plugin.tx_dsheader.view.layoutRootPath}
}
persistence {
storagePid = {$plugin.tx_dsheader.persistence.storagePid}
}
features {
# uncomment the following line to enable the new Property Mapper.
# rewrittenPropertyMapper = 1
}
}

我的管理员：也许我这里遗漏了什么？

<?php
namespace AlromaDsheaderController;
/**
*
* @category    Controller
*/
class ContentController extends TYPO3CMSExtbaseMvcControllerActionController {

/**
* @var TYPO3CMSCoreResourceFileRepository
* @TYPO3CMSExtbaseAnnotationInject
*/
protected $fileRepository;

/**
* @return void
*/
public function dsheaderAction() {

$data = $this->configurationManager->getContentObject()->data;
$this->view->assign('data', $data);
}

}

Answer 1

最后我渲染了我的图像。

我的Flexform还可以，我只需要在我的控制器上获得文件参考：

<?php
namespace AlromaDsheaderController;
/**
*
* @category    Controller
*/
class ContentController extends TYPO3CMSExtbaseMvcControllerActionController {

/**
* @var TYPO3CMSCoreResourceFileRepository
* @TYPO3CMSExtbaseAnnotationInject
*/
protected $fileRepository;
/**
* @return void
*/
public function dsheaderAction() {
$this->contentObj = $this->configurationManager->getContentObject();
$images=$this->getFileReferences($this->contentObj->data['uid']);
$this->view->assign('images', $images);

$data = $this->configurationManager->getContentObject()->data;
$this->view->assign('data', $data);
}


protected function getFileReferences($tt_content) {
$uid = $tt_content; // content element uid
$fileRepository = TYPO3CMSCoreUtilityGeneralUtility::makeInstance('TYPO3\CMS\Core\Resource\FileRepository');
$fileObjects = $fileRepository->findByRelation('tt_content', 'image', $uid);
// get Imageobject information
$files = array();


foreach ($fileObjects as $key => $value) {
$files[$key]['reference'] = $value->getReferenceProperties();
$files[$key]['original'] = $value->getOriginalFile()->getProperties();
}


return $files;
}
}

Answer 2

好吧，我不确定你的代码出了什么问题。正如您所说的调试返回int 1，这可能会显示字段的状态。无论如何，看看下面的配置，我经常使用我的TYPO3 10.x项目。

<bgImg>
<TCEforms>
<label>Select Image</label>
<config>
<type>inline</type>
<maxitems>1</maxitems>
<foreign_table>sys_file_reference</foreign_table>
<foreign_table_field>tablenames</foreign_table_field>
<foreign_label>uid_local</foreign_label>
<foreign_sortby>sorting_foreign</foreign_sortby>
<foreign_field>uid_foreign</foreign_field>
<foreign_selector>uid_local</foreign_selector>
<foreign_selector_fieldTcaOverride>
<config>
<appearance>
<elementBrowserType>file</elementBrowserType>
<elementBrowserAllowed>gif,jpg,jpeg,png,svg</elementBrowserAllowed>
</appearance>
</config>
</foreign_selector_fieldTcaOverride>
<foreign_types type="array">
<numIndex index="0">
<showitem>--palette--;LLL:EXT:lang/locallang_tca.xlf:sys_file_reference.imageoverlayPalette;imageoverlayPalette,--palette--;;filePalette</showitem>
</numIndex>
<numIndex index="2">
<showitem>--palette--;LLL:EXT:lang/locallang_tca.xlf:sys_file_reference.imageoverlayPalette;imageoverlayPalette,--palette--;;filePalette</showitem>
</numIndex>
</foreign_types>
<foreign_match_fields>
<fieldname>bgImg</fieldname>
</foreign_match_fields>
<appearance type="array">
<newRecordLinkAddTitle>1</newRecordLinkAddTitle>
<headerThumbnail>
<field>uid_local</field>
<height>64</height>
<width>64</width>
</headerThumbnail>
<enabledControls>
<info>1</info>
<new>0</new>
<dragdrop>0</dragdrop>
<sort>1</sort>
<hide>0</hide>
<delete>1</delete>
<localize>1</localize>
</enabledControls>
<createNewRelationLinkTitle>LLL:EXT:frontend/Resources/Private/Language/locallang_ttc.xlf:images.addFileReference</createNewRelationLinkTitle>
</appearance>
<behaviour>
<localizationMode>select</localizationMode>
<localizeChildrenAtParentLocalization>1</localizeChildrenAtParentLocalization>
</behaviour>
<overrideChildTca>
<columns type="array">
<uid_local type="array">
<config type="array">
<appearance type="array">
<elementBrowserType>file</elementBrowserType>
<elementBrowserAllowed>jpg,png,svg,jpeg,gif</elementBrowserAllowed>
</appearance>
</config>
</uid_local>
</columns>
<types type="array">
<numIndex index="2">
<showitem>--palette--;LLL:EXT:lang/locallang_tca.xlf:sys_file_reference.imageoverlayPalette;imageoverlayPalette,--palette--;;filePalette</showitem>
</numIndex>
</types>
</overrideChildTca>
</config>
</TCEforms>
</bgImg>

在您的前端模板中(我假设您有流体模板(，您可以使用以下语法获得它。

{f:uri.image(src:'{data.flexform_bgImg}', treatIdAsReference:'1')}

上面的系统文本将返回资源文件的URL。您可以与standerd HTMLimg标记一起使用。

<img src="{f:uri.image(src:'{data.flexform_bgImg}', treatIdAsReference:'1')}" />

希望这能让你下车！

Answer 3

这没有用，我得到了一个错误静止版本10.4.3 DCE元素所有上传图像都被阻止，并显示错误后端管理员

Answer 4

你是对的，你只需要添加一个数据处理器。您可以在setup.ts中执行此操作：…

dataProcessing.20 = TYPO3CMSFrontendDataProcessingFilesProcessor
dataProcessing.20 {
if.isTrue.field = settings.image
references {
fieldName = settings.image
table = tt_content
}
as = ImageNameHere
}

这可能会以数组的形式返回，因此在流体中使用foreach将其保存到变量名：

<f:for each="{ImageNameHere}" as="file" iteration="iterator">
<f:variable name="fileurl"><f:uri.image image="{file}"/></f:variable>
</f:for>

然后你可以在HTML 中引用它

<div style="background-image:url({fileurl});"></div>