问题描述
我在这里阅读了很多有关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,svg,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，但是要放在哪里以及要准确放置什么？
我有一个Typoscript Conf，我可以把处理器放在这里吗？：
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 Alroma\Dsheader\Controller;
/**
*
* @category Controller
*/
class ContentController extends \TYPO3\CMS\Extbase\Mvc\Controller\ActionController {
/**
* @var \TYPO3\CMS\Core\Resource\FileRepository
* @TYPO3\CMS\Extbase\Annotation\Inject
*/
protected $fileRepository;
/**
* @return void
*/
public function dsheaderAction() {
$data = $this->configurationManager->getContentObject()->data;
$this->view->assign('data',$data);
}
}
解决方法
好吧，我不确定您的代码有什么问题。如您所说，调试返回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,svg,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')}
上面的systext将返回资源文件的URL。您可以使用标准HTML img标签。
<img src="{f:uri.image(src:'{data.flexform_bgImg}',treatIdAsReference:'1')}" />
希望这会让您骑行！
,最后我得到了我的图像。
我的Flexform没问题，我只需要在Controller上获取文件参考即可
<?php
namespace Alroma\Dsheader\Controller;
/**
*
* @category Controller
*/
class ContentController extends \TYPO3\CMS\Extbase\Mvc\Controller\ActionController {
/**
* @var TYPO3\CMS\Core\Resource\FileRepository
* @TYPO3\CMS\Extbase\Annotation\Inject
*/
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 = \TYPO3\CMS\Core\Utility\GeneralUtility::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;
}
}
这没有用，我仍然收到错误消息，仍然是10.4.3版DCE元素，所有上传的图片均被阻止并显示错误后端管理
,您说得对，您只需要添加一个数据处理器。您可以在 setup.ts 中执行此操作： ...
dataProcessing.20 = TYPO3\CMS\Frontend\DataProcessing\FilesProcessor
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>