All teaser images put under the same directory with names unchanged and without any regard for to which cms page they belong

[CrazySquareRoot]

The title explains it. Just create two cms pages, and have two different images with exactly the same name and play with it - see what happens (funny things!). For example, open two tabs with respective cms pages on admin. Add 1st image to 1st cms page, then save it. Then try to upload 2nd image to 2nd cms page (already interesting! browser cache!). Then save 2nd cms page and refresh both.

Reasonable thing to do would be to pass cms page id where needed, and save/fetch files under/from respective subdirs (cmsteaser/<cms_page_id>/) Alternatively: just to rename the files eg. <cms_page_id>_<image_role>

The only thing you need to do to pass cms_page_id from imageUploader ui component on admin cms page form to your controller is to add:

<item name="imports" xsi:type="array">
<item name="uploaderConfig.formData.page_id" xsi:type="string">${ $.provider }:data.page_id</item>
</item>

under component's config xml node. To change the target save directory (in your controller) you only need to modify second argument passed to processUpload to include this id as part of target path. It's relatively easy to change all teaser image fetching endpoints accordingly (you get image name from cms_page db table anyway, so you should have cms page id there).