Issues with DCE on TYPO3 upgrade - typo3

Question

I have Upgraded typo3 from 9.5.5 to 10.4.19 and DCE from 2.03.x to 2.6.2
After the DCE upgrade, the Image upload field configuration seems wrongly changed (https://nimb.ws/slTyH8). The images are not in those fields and in Frontend the images are present which is the cache.
I have tried changing the old configuration of DCE to the new one. The field is okay now, But the website is refreshed and old images are gone.
I have more than 200 pages. So impossible to reupload. I have uploaded my backup and now I am at the previous state.
Checked the install tool, Unfortunately, there are no Upgrade wizards present for DCE. How can I make it correct without losing images?
Help me!

Answer 1

It is the change from old image handling to FAL-based referencing images. In former versions of DCE, the filename has been saved in tt_content.pi_flexform and there was a predefined/configured path, where this file should be searched. For some time, in TYPO3 files are handled via FAL and so as a relation to an entry of table sys_file...
A few weeks ago, a migrated some DCE elements for a customer. Instead of programming an upgrade-wizard, some lines of PHP were used.
Step 1: Export relevant data
Export the 'uid' of your content elements and filename within your DCE.
For the DCE with UID=2 whre the files field is called "image" this can be done via:
SELECT ExtractValue(pi_flexform, '//field[#index="settings.image"]/value') as filename, `uid`
FROM `tt_content`
WHERE CType='dce_dceuid2' AND ExtractValue(pi_flexform, '//field[#index="settings.image"]/value')!='';
Export the result as CSV.
Step 2: Create releation in sys_file_reference and update tt_content
Now we have to manage the changes to the database:
Create FAL-relations between the DCEs and the sys_file-entries (in form of sys_file_reference-records)
Update the pi_flexform of existing DCE content elements
Update the structure of old-styled DCEs
For these steps, I generated SQL-Queries with a PHP function:
function process(string $csv, string $CType, string $fieldName = 'image'): void
{
foreach (explode(chr(10), $csv) as $line) {
[$fileName, $uid] = explode(';', $line);
if ($fileName && $fileName !== '""') {
$uid = trim($uid);
echo htmlentities("INSERT INTO sys_file_reference (uid_local, uid_foreign, tablenames, fieldname, table_local) VALUES((SELECT uid FROM sys_file WHERE identifier=\"/_migrated_/pics/" . $fileName . "\"), $uid, 'tt_content', '" . $fieldName . "', 'sys_file');",
ENT_QUOTES | ENT_HTML5) . chr(10);
}
}
echo htmlentities('UPDATE tt_content SET pi_flexform=UpdateXML(`pi_flexform`, \'//field[#index="settings.' . $fieldName . '"]/value\', \'<value index=\"vDEF\">1</value>\') WHERE uid=437 AND CType=\'' . $CType . '\' AND ExtractValue(pi_flexform, \'//field[#index="settings.' . $fieldName . '"]/value\')!=\'\';',
ENT_QUOTES | ENT_HTML5) . chr(10);
$configuration = '<config>
<type>inline</type>
<foreign_table>sys_file_reference</foreign_table>
<foreign_field>uid_foreign</foreign_field>
<foreign_sortby>sorting_foreign</foreign_sortby>
<foreign_table_field>tablenames</foreign_table_field>
<foreign_match_fields>
<fieldname>{$variable}</fieldname>
</foreign_match_fields>
<foreign_label>uid_local</foreign_label>
<foreign_selector>uid_local</foreign_selector>
<overrideChildTca>
<columns>
<uid_local>
<config>
<appearance>
<elementBrowserType>file</elementBrowserType>
<elementBrowserAllowed>gif,jpg,jpeg,png</elementBrowserAllowed>
</appearance>
</config>
</uid_local>
</columns>
<types type="array">
<numIndex index="2">
<showitem>--palette--;LLL:EXT:core/Resources/Private/Language/locallang_tca.xlf:sys_file_reference.imageoverlayPalette;imageoverlayPalette,--palette--;;filePalette</showitem>
</numIndex>
</types>
</overrideChildTca>
<minitems>0</minitems>
<maxitems>1</maxitems>
<appearance>
<useSortable>1</useSortable>
<headerThumbnail>
<field>uid_local</field>
<width>45c</width>
<height>45</height>
</headerThumbnail>
<enabledControls>
<info>1</info>
<dragdrop>1</dragdrop>
<hide>1</hide>
<new>0</new>
<sort>0</sort>
<delete>1</delete>
</enabledControls>
<createNewRelationLinkTitle>LLL:EXT:frontend/Resources/Private/Language/locallang_ttc.xlf:images.addFileReference</createNewRelationLinkTitle>
</appearance>
<behaviour>
<allowLanguageSynchronization>1</allowLanguageSynchronization>
</behaviour>
<dce_load_schema>1</dce_load_schema>
<dce_get_fal_objects>1</dce_get_fal_objects>
</config>
';
echo 'UPDATE tx_dce_domain_model_dcefield SET configuration=\'' . htmlentities($configuration, ENT_QUOTES | ENT_HTML5) . '\' WHERE variable=\'' . $fieldName . '\' AND parent_dce=' . str_replace('dce_dceuid', '', $CType) . ';' . chr(10);
}
Now, we need to combine the CSV with the code:
$csv = 'image_1.jpg;82
typo3_box.jpg;904';
process($csv, 'dce_dceuid2', 'image');
This will not change anything, but only print out the necessary SQL-queries, which can be reviewed, copied and fired.

Answer 2

Thank you everyone for these detailed explanations.
But We found another method to solve. When analyzing the issue, The Old configuration for the image is having field name as<fieldname>{$bannerimage}</fieldname> And in the database the sys_file_reference table's field name contains the same variable as '{$bannerimage}
What we have done to solve the issue is:
Updated the image configuration to the newest conf and then replaced the <fieldname>{$variable}</fieldname> to <fieldname>bannerimage</fieldname>
The same is done in the DB too. fieldname changed from {$bannerimage} to bannerimage This fixed all problems without losing the image.