Copied to clipboard

Flag this post as spam?

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


  • Ganesh Mitra 50 posts 210 karma points
    Jun 09, 2020 @ 12:08
    Ganesh Mitra
    0

    Image not showing from azure blob

    I am using umbraco 7.15.4 and try to fetch images from blob media folder. I did all setup as per blog https://blog.nicolaayan.com/2018/05/how-to-setup-your-umbraco-media-folder-with-an-azure-storage-account/ but images still fetch from local.

    Also cross check setup from https://our.umbraco.com/Documentation/Extending/FileSystemProviders/Azure-Blob-Storage/index-v7 but still same.

    Could you please pointing anything I missed?

    Here is my settings

      <add key="containerName" value="media"/>
      <add key="rootUrl" value="https://[AccountName].blob.core.windows.net/"/>
      <add key="connectionString" value="DefaultEndpointsProtocol=https;AccountName=xxx;AccountKey=xxxx"/>
      <add key="maxDays" value="365"/>
    
      <add key="useDefaultRoute" value="true"/>
    
      <add key="usePrivateContainer" value="false"/>
    </Parameters>
    

    Note: When I upload file from umbraco backoffice its sync to blob but not read but permission is there.

  • Ganesh Mitra 50 posts 210 karma points
    Jun 10, 2020 @ 12:26
    Ganesh Mitra
    0

    Is anyone please help me on this.

  • Yakov Lebski 591 posts 2346 karma points
    Jun 11, 2020 @ 03:46
    Yakov Lebski
    0

    you should define blob container has anonymous access

  • Ganesh Mitra 50 posts 210 karma points
    Jun 11, 2020 @ 05:46
    Ganesh Mitra
    0

    Thanks for your reply.

    Yes permission already there but still image source showing local instated of blob source.

  • Ganesh Mitra 50 posts 210 karma points
    Jun 11, 2020 @ 11:17
    Ganesh Mitra
    0

    Is there anything else instated of permission?

  • Yakov Lebski 591 posts 2346 karma points
    Jun 11, 2020 @ 13:56
    Yakov Lebski
    0

    I think you need rename local folder to avoid missunderstanding, check what you have this part in web.config

    <location path="media">
            <system.webServer>
              <handlers>
                <remove name="StaticFileHandler" />
                <add name="StaticFileHandler" path="*" verb="*" preCondition="integratedMode" type="System.Web.StaticFileHandler" />
              </handlers>
            </system.webServer>
          </location>
    
  • Ganesh Mitra 50 posts 210 karma points
    Jun 11, 2020 @ 14:09
    Ganesh Mitra
    0

    web.config already have that section and media folder rename but still same.

  • Thomas Rydeen Skyldahl 47 posts 229 karma points
    Jun 11, 2020 @ 15:09
    Thomas Rydeen Skyldahl
    101

    Could you try adding a query string to the image path eg: ?width=100

    if the image shows this way, Image Processor is properbly configured to only serve images when using query strings

    if you want to avoid this you can either try adding this Web.config in the Media folder:

    <?xml version="1.0" encoding="UTF-8"?>
    <configuration>
     <system.webServer>
      <handlers>
        <clear/>
        <add name="StaticFileHandler" path="*" verb="*" preCondition="integratedMode" type="System.Web.StaticFileHandler"/>
        <add name="StaticFile" path="*" verb="*" modules="StaticFileModule,DefaultDocumentModule,DirectoryListingModule" resourceType="Either" requireAccess="Read"/>
       </handlers>
     </system.webServer>
    </configuration>
    

    or try configuring ImageProcessor to intercept all requests this can be done in /config/imageprocessor/processing.config

    on the root <processing> element set the setting interceptAllRequests="true"

  • Ganesh Mitra 50 posts 210 karma points
    Jun 11, 2020 @ 15:59
    Ganesh Mitra
    0

    Hi Thomas,

    Great, working now but fonts not loading return 500 like (.ttf, bootstrap.min.css.map, ajax-loader.gif etc)

  • Thomas Rydeen Skyldahl 47 posts 229 karma points
    Jun 12, 2020 @ 07:42
    Thomas Rydeen Skyldahl
    0

    Happy to help! :)

  • Yakov Lebski 591 posts 2346 karma points
    Jun 14, 2020 @ 13:29
    Yakov Lebski
    0

    if you see the image in blob, the issue is only what container is not public

  • Ganesh Mitra 50 posts 210 karma points
    Jun 14, 2020 @ 15:11
    Ganesh Mitra
    0

    Hi Yakov,

    Container already public and no issue with existing images. Only issue when I upload new, image showing in blob container means upload working but umbraco backoffice does not render this.

  • Thomas Rydeen Skyldahl 47 posts 229 karma points
    Jun 14, 2020 @ 19:26
    Thomas Rydeen Skyldahl
    0

    Is the link shown in the image correct? If it is then it must be something in the image processor configuration that's wrong

    As I remember Umbraco creates a thumbnail via Image Processor

  • Ganesh Mitra 50 posts 210 karma points
    Jun 15, 2020 @ 05:54
    Ganesh Mitra
    0

    Yes link showing image correctly.

    Here is the error log when creating thumbnail

    System.UriFormatException: A relative URI cannot be created because the 'uriString' parameter represents an absolute URI.
       at System.Uri.CreateThis(String uri, Boolean dontEscape, UriKind uriKind)
       at System.Uri..ctor(String uriString, UriKind uriKind)
       at Umbraco.Web.Editors.ImagesController.GetResized(String imagePath, Int32 width, String sizeName)
       at Umbraco.Web.Editors.ImagesController.GetBigThumbnail(String originalImagePath)
       at lambda_method(Closure , Object , Object[] )
       at System.Web.Http.Controllers.ReflectedHttpActionDescriptor.ActionExecutor.<>c__DisplayClass6_2.<GetExecutor>b__2(Object instance, Object[] methodParameters)
       at System.Web.Http.Controllers.ReflectedHttpActionDescriptor.ActionExecutor.Execute(Object instance, Object[] arguments)
       at System.Web.Http.Controllers.ReflectedHttpActionDescriptor.ExecuteAsync(HttpControllerContext controllerContext, IDictionary`2 arguments, CancellationToken cancellationToken)
    --- End of stack trace from previous location where exception was thrown ---
       at System.Runtime.CompilerServices.TaskAwaiter.ThrowForNonSuccess(Task task)
       at System.Runtime.CompilerServices.TaskAwaiter.HandleNonSuccessAndDebuggerNotification(Task task)
       at System.Web.Http.Controllers.ApiControllerActionInvoker.<InvokeActionAsyncCore>d__1.MoveNext()
    --- End of stack trace from previous location where exception was thrown ---
       at System.Runtime.CompilerServices.TaskAwaiter.ThrowForNonSuccess(Task task)
       at System.Runtime.CompilerServices.TaskAwaiter.HandleNonSuccessAndDebuggerNotification(Task task)
       at System.Web.Http.Filters.ActionFilterAttribute.<CallOnActionExecutedAsync>d__6.MoveNext()
    --- End of stack trace from previous location where exception was thrown ---
       at System.Web.Http.Filters.ActionFilterAttribute.<CallOnActionExecutedAsync>d__6.MoveNext()
    --- End of stack trace from previous location where exception was thrown ---
       at System.Runtime.CompilerServices.TaskAwaiter.ThrowForNonSuccess(Task task)
       at System.Runtime.CompilerServices.TaskAwaiter.HandleNonSuccessAndDebuggerNotification(Task task)
       at System.Web.Http.Filters.ActionFilterAttribute.<ExecuteActionFilterAsyncCore>d__5.MoveNext()
    --- End of stack trace from previous location where exception was thrown ---
       at System.Runtime.CompilerServices.TaskAwaiter.ThrowForNonSuccess(Task task)
       at System.Runtime.CompilerServices.TaskAwaiter.HandleNonSuccessAndDebuggerNotification(Task task)
       at System.Web.Http.Filters.ActionFilterAttribute.<CallOnActionExecutedAsync>d__6.MoveNext()
    --- End of stack trace from previous location where exception was thrown ---
       at System.Web.Http.Filters.ActionFilterAttribute.<CallOnActionExecutedAsync>d__6.MoveNext()
    --- End of stack trace from previous location where exception was thrown ---
       at System.Runtime.CompilerServices.TaskAwaiter.ThrowForNonSuccess(Task task)
       at System.Runtime.CompilerServices.TaskAwaiter.HandleNonSuccessAndDebuggerNotification(Task task)
       at System.Web.Http.Filters.ActionFilterAttribute.<ExecuteActionFilterAsyncCore>d__5.MoveNext()
    --- End of stack trace from previous location where exception was thrown ---
       at System.Runtime.CompilerServices.TaskAwaiter.ThrowForNonSuccess(Task task)
       at System.Runtime.CompilerServices.TaskAwaiter.HandleNonSuccessAndDebuggerNotification(Task task)
       at System.Web.Http.Filters.ActionFilterAttribute.<CallOnActionExecutedAsync>d__6.MoveNext()
    --- End of stack trace from previous location where exception was thrown ---
       at System.Web.Http.Filters.ActionFilterAttribute.<CallOnActionExecutedAsync>d__6.MoveNext()
    --- End of stack trace from previous location where exception was thrown ---
       at System.Runtime.CompilerServices.TaskAwaiter.ThrowForNonSuccess(Task task)
       at System.Runtime.CompilerServices.TaskAwaiter.HandleNonSuccessAndDebuggerNotification(Task task)
       at System.Web.Http.Filters.ActionFilterAttribute.<ExecuteActionFilterAsyncCore>d__5.MoveNext()
    --- End of stack trace from previous location where exception was thrown ---
       at System.Runtime.CompilerServices.TaskAwaiter.ThrowForNonSuccess(Task task)
       at System.Runtime.CompilerServices.TaskAwaiter.HandleNonSuccessAndDebuggerNotification(Task task)
       at System.Web.Http.Filters.ActionFilterAttribute.<CallOnActionExecutedAsync>d__6.MoveNext()
    --- End of stack trace from previous location where exception was thrown ---
       at System.Web.Http.Filters.ActionFilterAttribute.<CallOnActionExecutedAsync>d__6.MoveNext()
    --- End of stack trace from previous location where exception was thrown ---
       at System.Runtime.CompilerServices.TaskAwaiter.ThrowForNonSuccess(Task task)
       at System.Runtime.CompilerServices.TaskAwaiter.HandleNonSuccessAndDebuggerNotification(Task task)
       at System.Web.Http.Filters.ActionFilterAttribute.<ExecuteActionFilterAsyncCore>d__5.MoveNext()
    --- End of stack trace from previous location where exception was thrown ---
       at System.Runtime.CompilerServices.TaskAwaiter.ThrowForNonSuccess(Task task)
       at System.Runtime.CompilerServices.TaskAwaiter.HandleNonSuccessAndDebuggerNotification(Task task)
       at System.Web.Http.Controllers.ActionFilterResult.<ExecuteAsync>d__5.MoveNext()
    --- End of stack trace from previous location where exception was thrown ---
       at System.Runtime.CompilerServices.TaskAwaiter.ThrowForNonSuccess(Task task)
       at System.Runtime.CompilerServices.TaskAwaiter.HandleNonSuccessAndDebuggerNotification(Task task)
       at System.Web.Http.Filters.AuthorizationFilterAttribute.<ExecuteAuthorizationFilterAsyncCore>d__3.MoveNext()
    --- End of stack trace from previous location where exception was thrown ---
       at System.Runtime.CompilerServices.TaskAwaiter.ThrowForNonSuccess(Task task)
       at System.Runtime.CompilerServices.TaskAwaiter.HandleNonSuccessAndDebuggerNotification(Task task)
       at System.Web.Http.Filters.AuthorizationFilterAttribute.<ExecuteAuthorizationFilterAsyncCore>d__3.MoveNext()
    --- End of stack trace from previous location where exception was thrown ---
       at System.Runtime.CompilerServices.TaskAwaiter.ThrowForNonSuccess(Task task)
       at System.Runtime.CompilerServices.TaskAwaiter.HandleNonSuccessAndDebuggerNotification(Task task)
       at System.Web.Http.Filters.AuthorizationFilterAttribute.<ExecuteAuthorizationFilterAsyncCore>d__3.MoveNext()
    --- End of stack trace from previous location where exception was thrown ---
       at System.Runtime.CompilerServices.TaskAwaiter.ThrowForNonSuccess(Task task)
       at System.Runtime.CompilerServices.TaskAwaiter.HandleNonSuccessAndDebuggerNotification(Task task)
       at System.Web.Http.Controllers.ExceptionFilterResult. <ExecuteAsync>d__6.MoveNext() 
    
  • Ganesh Mitra 50 posts 210 karma points
    Jun 17, 2020 @ 17:47
    Ganesh Mitra
    0

    I am still not finding any solution for that. Can anyone please help me on this.

  • Thomas Rydeen Skyldahl 47 posts 229 karma points
    Jun 17, 2020 @ 21:24
    Thomas Rydeen Skyldahl
    0

    It looks like others are experincing similar problems

    with ImageProcessor:

    https://our.umbraco.com/forum/extending-umbraco-and-using-the-api/82351-imageprocessor-not-working-with-umbracofilesystemprovidersazure

    From what I gather try upgrading ImageProcessor to see if the problem goes away.

  • Ganesh Mitra 50 posts 210 karma points
    Jun 19, 2020 @ 18:09
    Ganesh Mitra
    0

    Hi Thomas,

    Still the same issue after upgrade image processor. I think no issue on image processor, issue on umbraco cms for version 7.15.

    If /umbraco/backoffice/UmbracoApi/Images/GetBigThumbnail?originalImagePath=https://xxx/media/568260/FGD_hero.jpg&rnd=0.7155816642593931 then return 500. ERROR MESSAGE: A relative URI cannot be created because the 'uriString' parameter represents an absolute URI

    If /umbraco/backoffice/UmbracoApi/Images/GetBigThumbnail?originalImagePath=/media/568260/GTR_hero.jpg&rnd=0.7155816642593931 then working fine.

    same issue as on https://issues.umbraco.org/issue/U4-8039

    Note: My blob container name "azapp-umbraco-stage-tmha-001" not media

  • Thomas Rydeen Skyldahl 47 posts 229 karma points
    Jun 19, 2020 @ 21:19
    Thomas Rydeen Skyldahl
    0

    How does your security config look for imageprococessor?

    Especially the paths and the container setting is important

  • Ganesh Mitra 50 posts 210 karma points
    Jun 21, 2020 @ 15:42
    Ganesh Mitra
    0

    Hi Thomas,

    All config as follows

    1) FileSystemProviders.config

    <FileSystemProviders> 
      <Provider alias="media" type="Our.Umbraco.FileSystemProviders.Azure.AzureBlobFileSystem, Our.Umbraco.FileSystemProviders.Azure">
        <Parameters>     
          <add key="containerName" value="azapp-umbraco-stage-tmha-001"/>
          <add key="rootUrl" value="https://xxx.blob.core.windows.net/"/>
          <add key="connectionString" value="DefaultEndpointsProtocol=https;AccountName=xxx;AccountKey=xxx"/>
          <add key="maxDays" value="365"/>  
          <add key="useDefaultRoute" value="true"/>      
          <add key="usePrivateContainer" value="false"/>      
        </Parameters>
      </Provider>
    </FileSystemProviders>
    

    2) security.config

    <?xml version="1.0" encoding="utf-8"?>
    <security>
      <services>
        <service name="LocalFileImageService" type="ImageProcessor.Web.Services.LocalFileImageService, ImageProcessor.Web" />  
        <service prefix="media/" name="CloudImageService" type="ImageProcessor.Web.Services.CloudImageService, ImageProcessor.Web">
          <settings>
            <setting key="Container" value="azapp-umbraco-stage-tmha-001"/>
            <setting key="MaxBytes" value="8194304"/>
            <setting key="Timeout" value="30000"/>
            <setting key="Host" value="https://xxx.blob.core.windows.net/"/>
          </settings>
        </service>
        <service prefix="remote.axd" name="RemoteImageService" type="ImageProcessor.Web.Services.RemoteImageService, ImageProcessor.Web">
          <settings>
            <setting key="MaxBytes" value="4194304" />
            <setting key="Timeout" value="3000" />
            <setting key="Protocol" value="http" />
          </settings>
          <whitelist>       
          </whitelist>
        </service>   
      </services>
    </security>
    

    3) cache.config

    <?xml version="1.0" encoding="utf-8"?>
    <caching currentCache="DiskCache">
      <caches>
        <cache name="DiskCache" type="ImageProcessor.Web.Caching.DiskCache, ImageProcessor.Web" maxDays="365" browserMaxDays="7">
          <settings>
            <setting key="VirtualCachePath" value="~/app_data/cache" />
          </settings>
        </cache>   
      </caches>
    </caching>
    

    4) processing.config

    <?xml version="1.0" encoding="utf-8"?>
    <processing preserveExifMetaData="true" fixGamma="false" interceptAllRequests="true" allowCacheBuster="true">
    
    
      <plugins>
        <plugin name="Gamma" type="ImageProcessor.Web.Processors.Gamma, ImageProcessor.Web" />
        <plugin name="Alpha" type="ImageProcessor.Web.Processors.Alpha, ImageProcessor.Web" />
        <plugin name="AutoRotate" type="ImageProcessor.Web.Processors.AutoRotate, ImageProcessor.Web" enabled="true" />
        <plugin name="Background" type="ImageProcessor.Web.Processors.Background, ImageProcessor.Web">
          <settings>
            <setting key="VirtualPath" value="~/images/imageprocessor/background/" />
          </settings>
        </plugin>
        <plugin name="BackgroundColor" type="ImageProcessor.Web.Processors.BackgroundColor, ImageProcessor.Web" enabled="true" />
        <plugin name="Brightness" type="ImageProcessor.Web.Processors.Brightness, ImageProcessor.Web" />
        <plugin name="Contrast" type="ImageProcessor.Web.Processors.Contrast, ImageProcessor.Web" />
        <plugin name="Crop" type="ImageProcessor.Web.Processors.Crop, ImageProcessor.Web" enabled="true" />
        <plugin name="DetectEdges" type="ImageProcessor.Web.Processors.DetectEdges, ImageProcessor.Web" />
        <plugin name="EntropyCrop" type="ImageProcessor.Web.Processors.EntropyCrop, ImageProcessor.Web" />
        <plugin name="Filter" type="ImageProcessor.Web.Processors.Filter, ImageProcessor.Web" />
        <plugin name="Flip" type="ImageProcessor.Web.Processors.Flip, ImageProcessor.Web" />
        <plugin name="Format" type="ImageProcessor.Web.Processors.Format, ImageProcessor.Web" enabled="true" />
        <plugin name="GaussianBlur" type="ImageProcessor.Web.Processors.GaussianBlur, ImageProcessor.Web">
          <settings>
            <setting key="MaxSize" value="22" />
            <setting key="MaxSigma" value="5.1" />
            <setting key="MaxThreshold" value="100" />
          </settings>
        </plugin>
        <plugin name="GaussianSharpen" type="ImageProcessor.Web.Processors.GaussianSharpen, ImageProcessor.Web">
          <settings>
            <setting key="MaxSize" value="22" />
            <setting key="MaxSigma" value="5.1" />
            <setting key="MaxThreshold" value="100" />
          </settings>
        </plugin>
        <plugin name="Halftone" type="ImageProcessor.Web.Processors.Halftone, ImageProcessor.Web" />
        <plugin name="Hue" type="ImageProcessor.Web.Processors.Hue, ImageProcessor.Web" />
        <plugin name="Mask" type="ImageProcessor.Web.Processors.Mask, ImageProcessor.Web">
          <settings>
            <setting key="VirtualPath" value="~/images/imageprocessor/mask/" />
          </settings>
        </plugin>
        <plugin name="Meta" type="ImageProcessor.Web.Processors.Meta, ImageProcessor.Web" />
        <plugin name="Overlay" type="ImageProcessor.Web.Processors.Overlay, ImageProcessor.Web">
          <settings>
            <setting key="VirtualPath" value="~/images/imageprocessor/overlay/" />
          </settings>
        </plugin>
        <plugin name="Pixelate" type="ImageProcessor.Web.Processors.Pixelate, ImageProcessor.Web" />
        <plugin name="Quality" type="ImageProcessor.Web.Processors.Quality, ImageProcessor.Web" enabled="true" />
        <plugin name="ReplaceColor" type="ImageProcessor.Web.Processors.ReplaceColor, ImageProcessor.Web" />
        <plugin name="Resize" type="ImageProcessor.Web.Processors.Resize, ImageProcessor.Web" enabled="true">
          <settings>
            <setting key="MaxWidth" value="5000" />
            <setting key="MaxHeight" value="5000" />
          </settings>
        </plugin>
        <plugin name="Rotate" type="ImageProcessor.Web.Processors.Rotate, ImageProcessor.Web" />
        <plugin name="RotateBounded" type="ImageProcessor.Web.Processors.RotateBounded, ImageProcessor.Web" />
        <plugin name="RoundedCorners" type="ImageProcessor.Web.Processors.RoundedCorners, ImageProcessor.Web" />
        <plugin name="Saturation" type="ImageProcessor.Web.Processors.Saturation, ImageProcessor.Web" />
        <plugin name="Tint" type="ImageProcessor.Web.Processors.Tint, ImageProcessor.Web" />
        <plugin name="Vignette" type="ImageProcessor.Web.Processors.Vignette, ImageProcessor.Web" />
        <plugin name="Watermark" type="ImageProcessor.Web.Processors.Watermark, ImageProcessor.Web" />
      </plugins>
      <presets>
      </presets>
    </processing>
    

    5) root web.config

    <location path="media">
        <system.webServer>
          <handlers>
            <remove name="StaticFileHandler" />
            <remove name="StaticFile" />
            <add name="StaticFileHandler" path="*" verb="*" preCondition="integratedMode" type="System.Web.StaticFileHandler" />
            <add name="StaticFile" path="*" verb="*" modules="StaticFileModule,DefaultDocumentModule,DirectoryListingModule" resourceType="Either" requireAccess="Read" />
          </handlers>
        </system.webServer>
      </location>
    

    6) media web.config

    <?xml version="1.0" encoding="UTF-8"?>
    <configuration>
      <system.webServer>
        <handlers>
          <clear />
          <add name="StaticFileHandler" path="*" verb="*" preCondition="integratedMode" type="System.Web.StaticFileHandler" />
          <add name="StaticFile" path="*" verb="*" modules="StaticFileModule,DefaultDocumentModule,DirectoryListingModule" resourceType="Either" requireAccess="Read" />
        </handlers>
      </system.webServer>
    </configuration>
    

    Also <add key="AzureBlobFileSystem.DisableVirtualPathProvider" value="true" /> in the root web.config under app settings.

  • Ganesh Mitra 50 posts 210 karma points
    Jul 01, 2020 @ 07:25
    Ganesh Mitra
    0

    Anyone please?

Please Sign in or register to post replies

Write your reply to:

Draft