Автоматическая подача изображений @2x и @3x с использованием ImageResizer на MVC

Тема, в которой мы создаем наши веб-сайты, использует Retina.Js на внешнем интерфейсе, который автоматически пытается загружать изображения @2x и @3x в соответствии с пользовательским устройством таким образом, что;

Если мы используем наши ползунки для рабочего стола, используя функцию изменения размера изображения следующим образом;

/Images/home/slides/slide-1.jpg?width=300

(где 1 - это DbId изображения)

Этот скрипт автоматически запрашивает следующие изображения, если посетитель использует мобильное устройство с высоким разрешением;

/Images/home/slides/slide-1@2x.jpg?width=300

/Images/home/slides/slide-1@3x.jpg?width=300

Мы используем ImageResizer с плагинами SqlReader и DiskCache, чтобы изображения считывались из базы данных и кэшировались на диске.

Когда скрипт запрашивает @2x и @3x именования конвекционных изображений с сервера, конечно, ImageResizer вернул ошибку для этих изображений, так как не смог найти изображение с идентификатором '1@2x' в БД, но, к счастью, мы смогли преодолеть это препятствие с помощью Pipeline.Rewrite;

ImageResizer.Configuration.Config.Current.Pipeline.Rewrite += delegate (IHttpModule s, HttpContext context, ImageResizer.Configuration.IUrlEventArgs ev)
        {

            if (ev.VirtualPath.StartsWith(VirtualPathUtility.ToAbsolute("~/kitimages/"), StringComparison.OrdinalIgnoreCase))
            {
                if (ev.VirtualPath.Contains("@2x"))
                {
                    ev.VirtualPath = ev.VirtualPath.Replace("@2x", string.Empty);
                }

            }                

        };

так что теперь мы можем обслуживать изображения с разрешением @2x (или @3x) в разрешении рабочего стола.

Но чего мы не смогли добиться, так это изменить разрешение желаемого изображения @2x или @3x. Поскольку мы называем изображение "? Width = 300" с параметром querystring, эти изображения также служат разрешением рабочего стола.

Мы пытались изменить

ImageResizer.Configuration.Config.Current.Pipeline.ModifiedQueryString["width"] 

к вновь рассчитанному значению, которое не оказало влияния.

Установите новое значение ширины под

context.Items["resizer.modifiedQueryString"] 

собственность, которая не имела никакого эффекта.

Также попытался использовать следующее без удачи;

ImageResizer.Configuration.Config.Current.Pipeline.Modify( new ResizeSettings() { Width = 600 } );
ImageResizer.Configuration.Config.Current.CurrentImageBuilder.SettingsModifier.Modify(new ResizeSettings() {Width = 600});
ImageResizer.Configuration.Config.Current.Pipeline.GetImageBuilder().SettingsModifier.Modify(new ResizeSettings() { Width = 600 });

Теперь вопрос в том, Есть ли способ изменить параметры изменения размера на лету при использовании плагинов SqlReader и DiskCache и обслуживать изображения @2x и @3x с правильным разрешением?

Заранее спасибо,

1 ответ

Решение

ImageResizer предлагает zoom параметр, который делает математику для вас, существенно умножая параметры ширины и высоты.

ev.QueryString["zoom"] = 2; // 3, etc, 
Другие вопросы по тегам