I am facing a strange issue regarding image preview in Drupal 8. I am not sure in which category, I need to post this issue. I tried will all the patches available in the net
-disable "itok"
-set permission 775 to sites/default/files/styles directory and subdirectory
-even changed the default file permission from 0664 to 0775
-disable Options in .htaccess file
None is working

The image below is a preview page by "focal point" module. You see the preview is not showing. But if i click on preview, the image is showing at the bottom. I checked in the corresponding folder all preview images are there. A sample url is like this:

`/sites/default/files/styles/facebook/public/assets/Q292ZXIyMDExLTA2LTIzIDE5OjE2OjI3.jpg`

Now if I go directly to that image in browser, its displaying correctly. And after that, if I refresh the focal point preview, now that image will display. But if I clear the varnish cache, everything will be as before.

In whole site, where there is image preview, after upload or any preview, its happening the same.

The system is based on Drupal 8.4.x
- Its in Acquia Hosting
- Its using Media Entity, Media Entity Image, Entity Browser, Crop modules etc

I am banging my head almost two days, no clue of this issue. If anyone can help, will be highly appreciated!!

Comments

shafiqhossain created an issue. See original summary.

cilefen’s picture

Priority: Major » Normal

What, if any, is the HTTP error code? This may be seen on the browser console.

shafiqhossain’s picture

StatusFileSize
new25.87 KB

No error log to anywhere, not in console, not in watchdog, not in php error log. The image is there, but not loading / rendering.

Image Broken

cilefen’s picture

Have you checked the focal point module's issue queue? What is the theme?

shafiqhossain’s picture

This is actually not focal point module issue. In the site, everywhere i see the same problem.

I have created a fresh new content type and added a image field with no link to any module (media, focal point, media entity image etc.), where preview is set to Thumbnail 100 x 100. Still the image preview is not showing after upload.

Strange thing is that, if i upload the same image twice - for first upload, its not showing the preview, but in the second upload, image preview is showing.

shafiqhossain’s picture

Okay after spent 2 days on this, I figure out the issue. Somebody added some debug code at the top of the settings.php file, which causes the image preview not working. Like this:

<?php
error_reporting(E_ALL);
ini_set("display_errors", 1);
?>

<?php

After removing those lines and the following blank lines, everything working fine.

shafiqhossain’s picture

Status: Active » Closed (works as designed)
amanire’s picture

Version: 8.4.4 » 10.0.x-dev

Just ran into a very similar issue, not just for the focal point image preview but for all image styles. It was caused by some whitespace before the <?php tag. It apparently hadn't manifested until upgrading to Drupal 9. Amazingly, this issue thread helped us to narrow down the culprit. So many thanks to @shafiqhossain for posting the solution here and giving us a clue where to look!

Update: oops, didn't mean to change the issue version to 10.0.x-dev, but I guess it's still relevant.

abuhozaifa’s picture

StatusFileSize
new95.52 KB

Hi Team,

Whenever I add an image, it appears to be added but the thumbnail is shown as broken and when I right-click, it is shown again with a loaded image. I have already checked the permission.

Current Step:

1. Sudo chmod -R 0777 files
2. Sudo chmod -R 0777 files/styles
3. Sudo chmod -R 0777 web

Nothing is working! but the image is created and stored in the directory.

Thanks,