Image Editor doesn't work on web farm

[lan luo]

Hi Telerik Team,

We use Telerik ASP.net controls in our project. We found the Image Editor doesn’t work well on web farm environment. In our production server, we uses Image Editor three ways.
    1. RadEditor -> Image Manager -> Image Editor
    2. Using customizing existing Image Manager dialogs Image Manager -> Image Editor
    3. Using Image Editor directly

The first and third ways works perfect but the second way doesn’t work on web farm environment. You can check attachments for the source code and fiddler screen shoot.

Any clues?

Thanks in advance,

Lan

[lan luo]

Please check the source code here:

protected override void OnPreRender(EventArgs e)
{
base.OnPreRender(e);
if (MaxUploadFileSize <= 0)
{
MaxUploadFileSize = 10;//default 10MB
}

ImageManagerDialogParameters imageManagerParameters = new ImageManagerDialogParameters();
imageManagerParameters.ViewPaths = ViewPaths ?? new string[] { string.Format("{0}{1}", ClickServer.Current.GetServerFileStorage(), "Image") };
imageManagerParameters.UploadPaths = UploadPaths ?? new string[] { string.Format("{0}{1}", ClickServer.Current.GetServerFileStorage(), "Image") };
imageManagerParameters.DeletePaths = DeletePaths ?? new string[] { string.Format("{0}{1}", ClickServer.Current.GetServerFileStorage(), "Image") };
imageManagerParameters.MaxUploadFileSize = (int)(MaxUploadFileSize * Utility.MBYTE);
if(SearchPatterns!=null)
imageManagerParameters.SearchPatterns = new string[] { "*.*" };
imageManagerParameters.ViewMode = ImageManagerViewMode.Grid;
if (UseRadEditorAjaxMixedContentProvider)
imageManagerParameters.FileBrowserContentProviderTypeName = typeof(RadEditorAjaxMixedContentProvider).AssemblyQualifiedName;
if (ConfigurationManager.AppSettings["RichEditor_Image_Editor"] == "off")
{
imageManagerParameters.EnableImageEditor = false;
}

Telerik.Web.UI.DialogDefinition imageManager4Editor = new Telerik.Web.UI.DialogDefinition(typeof(ImageManagerDialog), imageManagerParameters);
imageManager4Editor.ClientCallbackFunction = CallbackFunction;
imageManager4Editor.Width = Width > 0 ? Width : Unit.Pixel(694);
imageManager4Editor.Height = Height > 0 ? Height : Unit.Pixel(440);
RadDialogOpener dialogOpener1 = new RadDialogOpener();
dialogOpener1.DialogDefinitions.Add("ImageManager" + ControlUniqueID, imageManager4Editor);
ImageManagerDialogParameters imageEditorParameters = new ImageManagerDialogParameters();
imageEditorParameters.ViewPaths = ViewPaths ?? new string[] { string.Format("{0}{1}", ClickServer.Current.GetServerFileStorage(), "Image") };
imageEditorParameters.UploadPaths = UploadPaths ?? new string[] { string.Format("{0}{1}", ClickServer.Current.GetServerFileStorage(), "Image") };
imageEditorParameters.DeletePaths = DeletePaths ?? new string[] { string.Format("{0}{1}", ClickServer.Current.GetServerFileStorage(), "Image") };
imageEditorParameters.MaxUploadFileSize = (int)(MaxUploadFileSize * Utility.MBYTE);
imageEditorParameters.EnableImageEditor = true;
Telerik.Web.UI.DialogDefinition imageEditor4Editor = new Telerik.Web.UI.DialogDefinition(typeof(ImageEditorDialog), imageEditorParameters);
imageEditor4Editor.Width = Unit.Pixel(830);
imageEditor4Editor.Height = Unit.Pixel(500);
dialogOpener1.DialogDefinitions.Add("ImageEditor", imageEditor4Editor);
divDialogOpener.Controls.Add(dialogOpener1);
//registers the startup script which attaches onclick handler to the opener control
string script = @"$('#" + (OpenerClientId ?? "") + @"').click(function() {
$find('" + dialogOpener1.ClientID + @"').open('ImageManager" + ControlUniqueID + @"', {CssClasses: []});return false;
});";
if (!string.IsNullOrEmpty(OpenerClientName))
script += " $('[name=\"" + OpenerClientName + "\"]').live(\"click\", function() { " +
"$find('" + dialogOpener1.ClientID + @"').open('ImageManager" + ControlUniqueID + @"', {CssClasses: []});return false;
});";
ScriptManager sm = ScriptManager.GetCurrent(Page);
if (sm != null && sm.IsInAsyncPostBack)
{
ScriptManager.RegisterStartupScript(Page, Page.GetType(), "ImageWindowScript" + ControlUniqueID, script, true);
}
else
{
Page.ClientScript.RegisterStartupScript(Page.GetType(), "ImageWindowScript" + ControlUniqueID, script, true);
}
}

 

[lan luo]

figured it out. We need add following line:

 

imageEditorParameters.Add("ImageCacheStorageLocation", "Session");

  

 

[Vessy]

Hi lan,

Yes, as per your finding, the ImageEditor's ImageCacheStorageLocations must be set to session in order for the control to be able to access the edited image properly in a load-balanced scenario. I am glad you have found the solution on your own, nevertheless I would advise that you also take a look at the following blog post providing more detailed information on why this configuration is needed as well as what are the other settings needed in such scenario:
How to integrate RadControls for ASP.NET AJAX in a WebFarm or WebGarden scenario

Regards,
Vessy
Telerik