Sign in Register
Copied to clipboard

Flag this post as spam?

This post will be reported to the moderators as potential spam to be looked at


  • Tomasz 22 posts 96 karma points
    Jan 26, 2022 @ 21:47
    Tomasz
    0

    umbraco9 local and remote images - imagesharp

    I'm trying to find a way to allow my umbraco9 website to serve "local" (CMS media) images via the baked in imagesharp, which is working out of the box. I've setup Azure blob storage, all working fine.

    On top of that, I am in need of serving remote images. These images sit on their respective URLs (eg. images.remote1.com, images-ai.remote2.com) and since they are external, I want to crop/resize so that I can "fit" them into the design of my website.

    I've found the following discussion on ImageSharp https://github.com/SixLabors/ImageSharp.Web/discussions/167, which led me to implementing the custom "remote image" provider/resolver. This works fine for the remote images, but breaks existing built in umbraco9 resizing/cropping.

    So with the "remote" solution enabled, my image src="/remote/images.remote1.com?width=300" will be resized as expected, but src="/media/..." will not.

    I can't seem to find a way make them work "together" (ImageSharp doesn't seem to even document configuration of multiple providers either).

    Thoughts anyone?

    Copy Link
  • Tomasz 22 posts 96 karma points
    Feb 02, 2022 @ 20:11
    Tomasz
    0

    Adding the startup ConfigureServices for reference:

            services.AddUmbraco(_env, _config)
            .AddBackOffice()
            .AddWebsite()
            .AddComposers()
            .AddAzureBlobMediaFileSystem()
            .AddContentServiceNotificationHandler() // custom ext
            .AddCustomHostedServices() // custom ext
            .Build();
        . . .
        services.AddHttpClient(RemoteImageResolver.HttpClientName, client =>
        {
            client.Timeout = TimeSpan.FromSeconds(15);
            client.MaxResponseContentBufferSize = 8388608; //8mb
        });
        services
            .AddImageSharp()
            .ClearProviders()
            .AddProvider<RemoteImageProvider>()
            .Configure<AllowedDomainsRemoteImageUrlValidatorOptions>(_config.GetSection("ImageSharp.Web"));

    And app settings section sample:

    "ImageSharp.Web": {
    "AllowedDomains": [
        "somedomain.com", // remote 
        "anotherdomain.com" 
    ]
},
    Copy Link
  • Ole Martin Bakke 112 posts 624 karma points
    Nov 23, 2022 @ 11:36
    Ole Martin Bakke
    0

    Hi, I know this is an old question, but I ran into this my self, and my solution was to add back the provider and processor that Umbraco adds here: https://github.com/umbraco/Umbraco-CMS/blob/b69afe81f3f6fcd37480b3b0295a62af44ede245/src/Umbraco.Cms.Imaging.ImageSharp/UmbracoBuilderExtensions.cs

    .ClearProviders()
//This is my custom remote provider
.AddProvider<RemoteImageProvider>()
//Provider added by Umbraco
.AddProvider<WebRootImageProvider>()
//Processors added by Umbraco
.AddProcessor<CropWebProcessor>()

    This is only tested in Umbraco 10, but I guess it will work in Umbraco 9 as well.

    Copy Link
  • Bo Jacobsen 606 posts 2404 karma points
    Mar 20, 2023 @ 15:05
    Bo Jacobsen
    0

    Hi Ole.

    Can you remember how you made your RemoteImageProvider?

    I guess it should inherite the interface IImageWebProcessor, but what did you do with the IEnumerable<string> Commands and request?

    Copy Link
  • Ole Martin Bakke 112 posts 624 karma points
    Mar 21, 2023 @ 09:28
    Ole Martin Bakke
    0

    Hi, Bo! I used this gist as a base for my RemoteImageProvider: https://gist.github.com/marklagendijk/e5fd1934391a515f8c974c87024ed39c

    I think this only handles the fetching of the remote image, the rest is taken care of by ImageSharp.

    Please note that this is for ImageSharp, not ImageProcessor.

    Copy Link
Please Sign in or register to post replies

Write your reply to:

Draft