LiipImageBundle & KNP Gaufrette bundle failing to resolve s3 image path? - symfony

I am using LiipImageBundle & KNP Gaufrette bundle to resize & load images from s3. It was all working before but suddenly it stopped working. There are no bundle version upgrades.
Below is my configuration,
liip_imagine:
cache: aws_s3_images
data_loader: stream.aws_s3_images
filter_sets:
large:
quality: 75
cache: aws_s3_images
data_loader: stream.aws_s3_images
filters:
relative_resize: { widen: 140 }
medium:
quality: 75
cache: aws_s3_images
data_loader: stream.aws_s3_images
filters:
thumbnail: { size: [50, 50], mode: outbound }
small:
quality: 75
cache: aws_s3_images
data_loader: stream.aws_s3_images
filters:
thumbnail: { size: [25, 25], mode: outbound }
loaders:
stream.aws_s3_images:
stream:
wrapper: gaufrette://aws_s3_images_fs/
knp_gaufrette:
adapters:
aws_s3_images_adapter:
aws_s3:
service_id: 'st.aws_s3.client'
bucket_name: %amazon.s3.bucket%
options:
#directory: 'fos'
create: true
filesystems:
aws_s3_images_fs:
adapter: aws_s3_images_adapter
stream_wrapper: ~
The problem is strange, if I open image in new tab, it redirects to s3 image url and displays image. Once it loads in new tab, then it starts displaying normally. It doesnt work unless I open it new new tab.
is it not resolving s3 path ? What could be the issue ? I tried deleting all cache, I don't have media folder in my web directory.
In log it shows ImagineController:FilterAction is called.
In html source image path is
http://st.com/app_dev.php/media/cache/resolve/large/fos/user/ebc36103e6d1038791eb7eca2f4449db0780fdf41416235134.jpeg
Now if I open it in new tab/window, it will redirect to
[MY_S3_BUCKET_URL]/fos/user/large/ebc36103e6d1038791eb7eca2f4449db0780fdf41416235134.jpeg
and will display image in new window.
Now if I again refresh my page, image source is now changed to
[MY_S3_BUCKET_URL]/fos/user/large/ebc36103e6d1038791eb7eca2f4449db0780fdf41416235134.jpeg
and now I can see image loaded ?
Why it started happening suddenly. It was all working properly before.

After going through all the code of LiipImaginBundle & debugging, it turned out to be content type issue which was caused by FOSRestBundle's
format_listener:
rules:
- { path: '^/', priorities: [ '*/*' ], fallback_format: html, prefer_extension: true }
Changing it to
format_listener:
rules:
- { path: '^/', priorities: [ 'html', '*/*' ], fallback_format: html, prefer_extension: true }
fixed the issue.

Related

Why an uploaded image with volley could not be shown using the liip imagine bundle in symfony?

My project is to publish images using a phone. I'm using volley library for uploading images and for the back-end side, I'm using Symfony (with file_put_contents and it works) with the liip imagine bundle in order to filter the images. I can see the images uploaded to the folder "web/uploads/img but the filtered images can't be seen in the folder "web/media/cache/{filter}. How can I do in order to get the filtered images with liip imagine?
For the Controller in Symfony:
$file = "uploads/img";
file_put_contents($file, base64_decode($image));
For the bundle liip imagine:
liip_imagine:
filter_sets:
thumb:
quality: 100
filter:
thumbnail: { size: [350, 350], mode: inset}
my_thumb:
quality: 100
filter:
thumbnail: { size: [200, 200], mode: outbound}
In your services.yaml
parameters:
image_directory: '%kernel.project_dir%/public/uploads/images'
App\Service\FileUploader:
arguments:
$targetDirectory: '%image_directory%'
config/packages/liip_imagine.yaml
liip_imagine:
filter_sets:
cache: ~
my_thumb :
quality : 75
filters :
thumbnail : { size : [260, 190], mode : outbound }
post_show:
quality: 75
filters:
thumbnail: { size: [500, 320], mode: outbound }

Sonata media bundle how to enable pixlr editing?

I have enabled pixlr as described here but is not enabled have tried many times.
There is no edit with pixlr button visible in media form.
Am I missing anything, Struggling from long time. Please help,
Is there any additional config apart from this?
Here is my config
sonata_media:
pixlr:
enabled: true
secret: theSecretHash
referrer: Demo
# if you don't use default namespace configuration
class:
media: App\Application\Sonata\MediaBundle\Entity\Media
gallery: App\Application\Sonata\MediaBundle\Entity\Gallery
gallery_has_media: App\Application\Sonata\MediaBundle\Entity\GalleryHasMedia
category: App\Application\Sonata\ClassificationBundle\Entity\Category
db_driver: doctrine_orm # or doctrine_mongodb, doctrine_phpcr it is mandatory to choose one here
default_context: default # you need to set a context
contexts:
default: # the default context is mandatory
providers:
- sonata.media.provider.dailymotion
- sonata.media.provider.youtube
- sonata.media.provider.image
- sonata.media.provider.file
- sonata.media.provider.vimeo
formats:
small: { width: 100 , quality: 70 }
big: { width: 500 , quality: 70 }
gallery:
providers:
- sonata.media.provider.dailymotion
- sonata.media.provider.youtube
- sonata.media.provider.image
- sonata.media.provider.file
- sonata.media.provider.vimeo
formats:
original: { width: 500, quality: 100 }
thumbnail: { width: 200, height: 200, quality: 100 }
cdn:
server:
path: http://127.0.0.1:8000/uploads/media # http://media.sonata-project.org/
filesystem:
local:
directory: "%kernel.root_dir%/../public/uploads/media" #flex
#directory: "%kernel.root_dir%/../web/uploads/media" #non-flex
create: false
After digging into the code I found the problem is with Symfony 4 making services private by default.
And this is how sonata media bundle enables pixlr
First it checks if sonata.media.extra.pixlr service is available in the container.
If not then it doesn't enable the pixlr. Since the service is private container is not able to access the service.
// Sonata\MediaBundle\Twig\GlobalVariable
/**
* #return Pixlr|bool
*/
public function getPixlr()
{
return $this->container->has('sonata.media.extra.pixlr') ? $this->container->get('sonata.media.extra.pixlr') : false;
}
Workaround for this is to override service definition and make it public :)
sonata.media.extra.pixlr:
public: true
class: Sonata\MediaBundle\Extra\Pixlr
arguments: [~,~,"#sonata.media.pool", "#sonata.media.manager.media", "#router", "#sonata.templating", "#service_container"]
Now you can see pixlr edit button enabled in media form

Sonata media bundle no image preview

I have a problem with the Sonata Media bundle. Images that i upload on server (local) are not displayed (thumbnail missing). I checked the path and it's all correct. All images that I uploaded is transferred to the directory /web/ uploads/media .
Check Screenshot:
Full size screenshot here
Config File:
sonata_media:
# if you don't use default namespace configuration
#class:
# media: MyVendor\MediaBundle\Entity\Media
# gallery: MyVendor\MediaBundle\Entity\Gallery
# gallery_has_media: MyVendor\MediaBundle\Entity\GalleryHasMedia
default_context: default
db_driver: doctrine_orm # or doctrine_mongodb, doctrine_phpcr
contexts:
default: # the default context is mandatory
providers:
- sonata.media.provider.dailymotion
- sonata.media.provider.youtube
- sonata.media.provider.image
- sonata.media.provider.file
formats:
preview: { width: 100, quality: 100}
small: { width: 100 , quality: 70}
big: { width: 500 , quality: 70}
cdn:
server:
path: uploads/media
filesystem:
local:
directory: %kernel.root_dir%/../web/uploads/media
create: false
sonata_notification:
backend: sonata.notification.backend.runtime
sonata_notification:
admin:
enabled: false
Am using Media bundle in Sonata admin bundle like this and all work good but just that thumbnail is not rendered. I read Media BUndle doc Helper section but dont understand.
In my ArticleAdmin controlir i adding filend like this:
/**
* Configure Form Fields
*
* Fields to be shown on create/edit forms
*/
protected function configureFormFields(FormMapper $formMapper)
{
$link_parameters = array();
if ($this->hasParentFieldDescription()) {
$link_parameters = $this->getParentFieldDescription()->getOption('link_parameters', array());
}
if ($this->hasRequest()) {
$context = $this->getRequest()->get('context', null);
if (null !== $context) {
$link_parameters['context'] = $context;
}
}
$formMapper->add('media', 'sonata_type_model_list', array('required' => false), array(
'link_parameters' => $link_parameters
))
}
Any solution?
UPDATE:
In my log file, I found this :
[2015-01-22 15:28:22] request.ERROR: Uncaught PHP Exception
Symfony\Component\HttpKernel\Exception\NotFoundHttpException: "No
route found for "GET
/admin/sonata/media/media/uploads/media/default/0001/01/thumb_1_admin.jpeg""
at C:\xampp\htdocs\Symfony\app\cache\dev\classes.php line 2017
{"exception":"[object]
(Symfony\Component\HttpKernel\Exception\NotFoundHttpException(code:
0): No route found for \"GET
/admin/sonata/media/media/uploads/media/default/0001/01/thumb_1_admin.jpeg\"
at C:\xampp\htdocs\Symfony\app\cache\dev\classes.php:2017,
Symfony\Component\Routing\Exception\ResourceNotFoundException(code:
0): at
C:\xampp\htdocs\Symfony\app\cache\dev\appDevUrlMatcher.php:521)"}
[]
Your link should be something like '/uploads/media/....' and not 'upload/media/...'
In your config file, change
cdn:
server:
path: uploads/media
to
cdn:
server:
path: /uploads/media
Hope it helps to solve your problem.
In addition to Stiff Roy answer, you can set your virtual host root to Symfony/web (in your case).
So when you will be on http://localhost/app_dev.php/admin/sonata/media/media/list
your images load as http://localhost/uploads/media/default/0001/01/thumb.jpg
Error "No route found for "GET /admin/sonata/media/media/uploads/media/default/0001/01/thumb_1_admin.jpeg"" says that it tried to load an image through controller and not by the direct access. Additional info about setting your env could be found here or here (PHP Storm).
need to change the path in config.yml
sonata_media
cdn:
server:
path: /myproject/web/uploads/media
ok so I solved the problem this way:
sonata_media:
# if you don't use default namespace configuration
#class:
# media: MyVendor\MediaBundle\Entity\Media
# gallery: MyVendor\MediaBundle\Entity\Gallery
# gallery_has_media: MyVendor\MediaBundle\Entity\GalleryHasMedia
db_driver: doctrine_orm # or doctrine_mongodb, doctrine_phpcr it is mandatory to choose one here
default_context: default # you need to set a context
contexts:
default: # the default context is mandatory
providers:
- sonata.media.provider.dailymotion
- sonata.media.provider.youtube
- sonata.media.provider.image
- sonata.media.provider.file
- sonata.media.provider.vimeo
formats:
small: { width: 100 , quality: 70}
big: { width: 500 , quality: 70}
cdn:
server:
path: "/uploads/media" # http://media.sonata-project.org/
filesystem:
local:
directory: "%kernel.root_dir%/../web/uploads/media"
create: false
and in the console : $php app/console server:start
The symphony environment app_dev is not working with the sonata media bundle.
Cheers

How to format an image tag within a template when using streams with LiipImagineBundle

If I configure LiipImagineBundle to use a stream data loader, How do I then craft an image tag to use that data loader within a template?
Updated Config
knp_gaufrette:
adapters:
image_storage:
amazon_s3:
amazon_s3_id: namespace_admin.amazon_s3
bucket_name: %amazon_s3_bucket_name%
create: false
options:
create: true
directory: 'mydir'
region: %amazon_s3_region%
filesystems:
image_storage:
adapter: image_storage
alias: image_storage_filesystem
s3_storage:
adapter: image_storage
stream_wrapper:
protocol: data
filesystems:
- s3_storage
namespace_admin:
amazon_s3:
aws_key: %amazon_aws_key%
aws_secret_key: %amazon_aws_secret_key%
aws_region: %amazon_s3_region%
base_url: %amazon_s3_base_url%
liip_imagine:
loaders:
stream.my_namespace_images:
stream:
wrapper: data://s3_storage
resolvers:
default:
web_path: ~
filter_sets:
cache: ~
gi_thumb:
data_loader: stream.my_namespace_images
quality: 75
filters:
thumbnail: { size: [120, 90], mode: outbound }
There are two things, you need to do.
The gi_thumb filter needs to set the data_loader to stream.get_inspired_images.
In your template you just call the imagine_filter on a file path that's loadable by that loader: {{ '/example/path/image.png'|imagine_filter('gi_thumb', true) }}
This would load this image: http://your-bucket.s3.amazonaws.com/example/path/image.png.

SonataMedia upload doesn't work on Amazon S3

I installed SonataMediaBundle and it works fine when I want to upload my files locally.
But i would like upload my files on Amazon S3. So :
i updated my config file
i added the bundle "amazonwebservices / aws-sdk-for-php" in my composer file.
But it doesn't work and i don't understand why ... is it there is any other action to do ?
Thank's a lot for your answers, i need help ... (I searched all morning before coming to ask this question)
My config.yml file :
sonata_media:
default_context: default
db_driver: doctrine_orm
contexts:
default:
providers:
- sonata.media.provider.image
formats:
small: { width: 100 , quality: 70}
big: { width: 500 , quality: 70}
Video:
providers:
- sonata.media.provider.image
- sonata.media.provider.file
formats:
small: { width: 150 , quality: 95}
big: { height: 500 , quality: 90}
cdn:
server:
path: http://mybucket.s3.amazonaws.com
filesystem:
s3:
bucket: mybucket
accessKey: myaccesskey
secretKey: mysecretkey
create: true

Resources