نظرات مطالب
فعال سازی قسمت ارسال فایل و تصویر ویرایشگر آنلاین RedActor در ASP.NET MVC
این کد من که نوشتمش و جواب گرفتم.
[HttpPost]
public ActionResult ImageUpload(HttpPostedFileBase file)
{
   string path = "";
   var FileName = "";
   if (file.ContentLength > 0)
   {
     FileName = Path.GetFileName(file.FileName);
     string Extension = file.ContentType;
     string[] ExtensionList = { "image/jpg", "image/jpeg", "image/gif", "image/pmg" };
     if (ExtensionList.Contains(Extension.ToLower()))
     {
         path = Path.Combine(Server.MapPath("~/Images/uploads"), FileName);
         file.SaveAs(path);
     }
   }

   var array = new { filelink = @"Images\uploads\" + FileName };
   return Json(array, System.Net.Mime.MediaTypeNames.Text.Plain, JsonRequestBehavior.AllowGet);
}
امید وارم به کارت بیاد.  
اشتراک‌ها
لیستی از کتابخانه‌های Javascripts برای تشخیص چهره

اگر در برنامه خودتون امکان آپلود تصویر کاربر را دارید. می‌توانید به کمک کتابخانه‌های بالا محدوده تصویر پیدا و تصویر به همان اندازه کوچک و فشرده کنید.

حتی می‌توانید مانند فیسبوک افراد را تشخیص دهید و برای آن‌ها تگ ایجاد کنید

لیستی از کتابخانه‌های Javascripts برای تشخیص چهره
مطالب
تشخیص باز و مشاهده شدن ایمیل‌های ارسالی از یک برنامه وب توسط کاربران
شاید برای شما به عنوان برنامه نویس، پیش آمده باشد که بخواهید از برنامه خود یک یا چند ایمیل به کابران ارسال کنید. آیا تا به حال نیاز داشته‌اید بدانید آیا ایمیل ارسالی، توسط کاربر باز شده‌است یا خیر؟ چند نفر ایمیل شما را خوانده‌اند؟ چه زمانی ایمیل را باز کرده‌اند؟ و ...

برای این کار روش استاندارد و مستقیمی وجود ندارد؛ اما  با استفاده از بعضی از روشها مانند ارسال عکس مخفی، برخی تگ‌هایی که یک آدرس را فراخوانی می‌کنند (مانند bgsound)، کلیک روی لینک و یا ترکیبی از چند روش می‌توان تا حدود زیادی به اهداف فوق رسید.

روشی که بررسی خواهیم کرد، مبتنی بر ارسال عکس بوده و برای شروع، به یک عکس بسیار کوچک (1X1) با حجم کم و غیرقابل دید (Transparent) نیاز داریم که می‌توانید یکی از آنها را از این آدرس انتخاب کنید. در این روش به همراه ایمیل، این عکس را ارسال خواهیم کرد (در تگ img). عکس باید بگونه‌ای باشد که ظاهر ایمیل را تحت تأثیر قرار ندهد و آدرس عکس باید طوری تنظیم شود که به برنامه ما یک درخواست را ارسال کند و برنامه با توجه به درخواست ارسال شده، عملیات لازم را انجام دهد. 

مثالی از عکسی که باید ارسال شود: 

<img src='http://www.example.com/1x1.gif' style='width:1px;height:1px;'>

برای شروع یک برنامه‌ی ASP.NET Core را ایجاد کرده و مراحل ارسال ایمیل را طی نمایید:
private bool SendEmail(string mail_to, string mail_subject, string mail_body)
{
    bool result = false;
    try
    {
      SmtpClient client = new SmtpClient("smtp.gmail.com");
      client.UseDefaultCredentials = false;
      client.EnableSsl = true;
      client.Port = 587;
      client.Credentials = new NetworkCredential("from@mail.com", "your_gmail_password");
      MailMessage mailMessage = new MailMessage();       mailMessage.From = new MailAddress("from@mail.com");       mailMessage.To.Add(mail_to);       mailMessage.Body = mail_body;       mailMessage.Subject = mail_subject;       client.Send(mailMessage);       result = true;      }      catch (Exception ex)      {       result = false;      }      return result; }
public IActionResult SendEmailWithTransparentImage()
{
   var email_body = "your_email_body";            
   var imageUrl = Url.Action("ImageRequestFromEmail", "Home", new {user_id=12345}, protocol: Url.ActionContext.HttpContext.Request.Scheme);            
   var imageTag = $"<img src='{imageUrl}' style='width:1px;height:1px;'>";            
   email_body += imageTag;
   var result = SendEmail("to@email.com", "test image", email_body);
   return View(result);
}

سپس اکشن متد پاسخ به درخواست عکس از طرف سرویس دهنده ایمیل را ایجاد نمایید:
[Route("1x1.gif")]
public IActionResult ImageResponse()
{
   //درخواست عکس ارسال شده و اینجا باید عملیات دلخواه را انجام دهیم
   var emailOpenDate = DateTime.Now;
            
   //سپس عکس را در جواب درخواست ارسال میکنیم
   byte[] imagegBytes = Convert.FromBase64String("R0lGODlhAQABAAAAACH5BAEAAAAALAAAAAABAAEAAAI=");
   return File(imagegBytes, "image/gif");
}
اگر اکشن SendEmailWithTransparentImage فراخوانی شود، یک ایمیل که حاوی عکس مورد نظر است، ارسال می‌شود. کاربر با باز کردن ایمیل باعث می‌شود سرویس دهنده ایمیل، درخواست خواندن عکس را به برنامه شما داده و اکشنی را که برای پاسخ به درخواست ارسال عکس نوشته شده، فراخوانی کند. از این طریق متوجه خواهیم شد که ایمیل توسط کاربر باز و مشاهده شده‌است.
بدیهی است می‌توان یک سری کوئری استرینگ را برای بهتر شدن فرآیند، به آدرس عکس مورد نظر اضافه کرد:
<img src='http://www.example.com/1x1.gif?user_id=12345' style='width:1px;height:1px;'>

در این صورت باید تغییراتی را در کدها لحاظ کنیم:
در اکشن SendEmailWithTransparentImage  :
var imageUrl = Url.Action("ImageResponse, "Home", new {user_id=12345},protocol: Url.ActionContext.HttpContext.Request.Scheme);
و امضای اکشن ImageResponse را به‌صورت زیر تغییر می‌دهیم:
public IActionResult ImageResponse(int user_id)

استفاده از عکس‌های کوچک به علت سربار کم و پشتیبانی مرورگرها، بسیار مرسوم بوده و بسیاری از آنالیزورهای سایت مانند google analytics، سایت‌های ارسال انبوه ایمیل و ...  برای رهگیری رفتار کاربران از این روش استفاده می‌کنند. 
برای مثال اگر در همین سایت Developer Tools مرورگر را باز کنید و صفحه را رفرش کنید در تب Network، با کمی دقت عکسی با کوئری استرینگ پیچیده خواهید یافت که مربوط به google analytics است و تقریبا تمام اطلاعات مورد نیاز خود در رابطه با رفتار کاربران در سایت جاری را با استفاده از این روش جمع آوری می‌کند.
مطالب
نکات استفاده از افزونه‌ی Web Essentials جهت کار با تصاویر
در این مطلب نکات کار با تصاویر را توسط افزونه‌ی Web Esstentials بررسی می‌کنیم. این افزونه قابلیت‌های زیر را در کار با تصاویر در اختیار شما قرار می‌دهد:
بهینه‌سازی تصاویر
یکی از موارد مهمی که باید مورد توجه قرار بگیرد، استفاده از تصاویر کم حجم در وب‌سایت می‌باشد. روش‌های مختلفی جهت بهینه‌سازی تصاویر مورد استفاده در سایت وجود دارند، به طور مثال جهت بهینه‌سازی تصاویر PNG می‌توانید از ابزار PNGGauntlet استفاده کنید. همچنین اینجا نیز یک ابزار آنلاین موجود می‌باشد. افزونه‌ی Web Essentails این قابلیت را به آسانی در اختیار شما قرار می‌دهد؛ اینکار را می‌توانید توسط این افزونه به روش‌های زیر انجام دهید:
  • کلیک راست بر روی تصویر
برای اینکار بر روی فایلی که می‌خواهید optimize کنید، کلیک راست کرده و از منوی ظاهر شده گزینه Web Essentials و سپس Optimize Image را انتخاب کنید:

در قسمت status bar نیز می‌توانید نتیجه را مشاهده کنید:

  • انتخاب چندین تصویر
روال قبلی را می‌توانید برای چندین فایل انتخاب شده و یا یک پوشه تکرار کنید:

  • بهینه‌سازی تصاویر موجود در فایل‌های CSS
همچنین امکان بهینه‌سازی تصاویر داخل فایل‌های CSS نیز توسط این افزونه امکان پذیر است:

  • بهینه سازی تصاویر Base64 Encode
توسط این افزونه می‌توانیم تصاویر  Data Uri  را نیز بهینه سازی کنیم:

همانطور که در تصویر فوق مشاهده می‌کنید می‌توانیم تصاویری که به صورت Data Uri درون کد پیوست شده اند را با کلیک بر روی Save to file به صورت یک فایل ذخیره کنیم.

ایجاد تصاویر Sprite
یکی دیگر ار قابلیت‌های افزونه Web Essentials امکان تهیه تصاویر به صورت Sprite می باشد. برای اینکار کافی است به این صورت عمل کنید:

بعد از کلیک بر روی Create image sprite باید یک نام برای آن تعیین کنید و سپس بر روی کلید Save کلیک کنید. با اینکار یک فایل از نوع XML با پسوند sprite برای شما ساخته خواهد شد:
<?xml version="1.0" encoding="utf-8"?>
<sprite xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:noNamespaceSchemaLocation="http://vswebessentials.com/schemas/v1/sprite.xsd">
  <settings>
    <!--Determines if the sprite image should be automatically optimized after creation/update.-->
    <optimize>true</optimize>
    <!--Determines the orientation of images to form this sprite. The value must be vertical or horizontal.-->
    <orientation>vertical</orientation>
    <!--File extension of sprite image.-->
    <outputType>png</outputType>
    <!--Determin whether to generate/re-generate this sprite on building the solution.-->
    <runOnBuild>false</runOnBuild>
    <!--Use full path to generate unique class or mixin name in CSS, LESS and SASS files. Consider disabling this if you want class names to be filename only.-->
    <fullPathForIdentifierName>true</fullPathForIdentifierName>
    <!--Use absolute path in the generated CSS-like files. By default, the URLs are relative to sprite image file (and the location of CSS, LESS and SCSS).-->
    <useAbsoluteUrl>false</useAbsoluteUrl>
    <!--Specifies a custom subfolder to save CSS files to. By default, compiled output will be placed in the same folder and nested under the original file.-->
    <outputDirectoryForCss />
    <!--Specifies a custom subfolder to save LESS files to. By default, compiled output will be placed in the same folder and nested under the original file.-->
    <outputDirectoryForLess />
    <!--Specifies a custom subfolder to save SCSS files to. By default, compiled output will be placed in the same folder and nested under the original file.-->
    <outputDirectoryForScss />
  </settings>
  <!--The order of the <file> elements determines the order of the images in the sprite.-->
  <files>
    <file>/Content/Images/01.png</file>
    <file>/Content/Images/02.png</file>
    <file>/Content/Images/03.png</file>
    <file>/Content/Images/04.png</file>
  </files>
</sprite>
یکی از زیر مجموعه‌های این فایل، تصویر نهایی می‌باشد، همچنین فایل‌های css, less, map و scss آن نیز تولید می‌شود:

به عنوان مثال فایل CSS تصویر فوق به صورت زیر می‌باشد:
/*
This is an example of how to use the image sprite in your own CSS files
*/
.Content-Images-01 {
/* You may have to set 'display: block' */
width: 32px;
height: 32px;
background: url('icons.png') 0 0;
}
.Content-Images-02 {
/* You may have to set 'display: block' */
width: 32px;
height: 32px;
background: url('icons.png') 0 -32px;
}
.Content-Images-03 {
/* You may have to set 'display: block' */
width: 32px;
height: 32px;
background: url('icons.png') 0 -64px;
}
.Content-Images-04 {
/* You may have to set 'display: block' */
width: 32px;
height: 32px;
background: url('icons.png') 0 -96px;
}
هر کدام از کلاس‌های فوق به یک تصویر در فایل مربوطه توسط image position اشاره می‌کند. شما می‌توانید با انتساب هر کدام از کلاس‌های فوق به یک المنت از آن تصویر استفاده نمائید:
<div class="Content-Images-01"></div>
<div class="Content-Images-02"></div>
<div class="Content-Images-03"></div>
<div class="Content-Images-04"></div>

استفاده از تصاویر Data URIs
یکی دیگر از روش‌های کاهش درخواست‌های HTTP در یک سایت استفاده از Data URIs  می باشد، توسط این روش می‌توانید فایل هایتان را درون HTML و یا CSS قرار دهید یا به اصطلاح embed کنید. به طور مثال جهت استفاده از یک تصویر می‌توانید به راحتی با آدرس دهی تصویر درون تگ img، تصویر را درون صفحه نمایش دهید:
<img src="https://www.dntips.ir/images/logo.png" />

همین کار را می‌توانیم توسط Data URIs انجام دهیم:
<img src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAQAAAADCAIAAAA7ljmRAAAAGElEQVQIW2P4DwcMDAxAfBvMAhEQMYgcACEHG8ELxtbPAAAAAElFTkSuQmCC" />
در کد فوق تصویر موردنظر را درون HTML به صورت embed شده قرار داده ایم، در این حالت دیگری نیازی به رفت و برگشت به سرور جهت نمایش تصویر نیست.
سینتکس Data URIs
به طور مثال تگ زیر را در نظر داشته باشید:
<img src="data:image/png;base64,iVBOR..." />
مقدار ویژگی src شامل موارد زیر است:
data: نام schema
image/png: نوع محتوا(content type)
base64: نوع encoding استفاده شده برای encode کردن اطلاعات
iVBOR...: اطلاعات encode شده.
توسط افزونه Web Essentials به راحتی می‌توانید تصویر موردنظرتان را به صورت Data URI تهیه کنید:

نظرات مطالب
پرسش و پاسخ‌های متداول ایجاد یک وبلاگ بلاگری
قرار بود فقط دو تا سؤال بپرسید :)
- فرمت قالب‌ها xml است و با فرانت پیج قدیمی یا expression web جدید قابل ویرایش نیست و اصلا ادیتوری هم ندارد (یا جایی منتشر نشده تا جایی که اطلاع دارم). دستی باید روی آن کار شود.
- برای قرار دادن عکس در بک گراند، شما فقط کافی است عکس مورد نظر را در یک سایت دیگر آپلود کنید، سپس یک css تعریف کرده و آن‌را اعمال نمائید. به سلکتور body یا تگ body قابل اعمال است. اطلاعات بیشتر:
http://www.w3schools.com/css/pr_background-image.asp
- برای تعیین رنگ و اندازه تاریخ، باز هم باید css‌ سایت را در همان قسمت ویرایش html سایت ویرایش کنید. برای مثال این موارد باید اضافه شود:
h1, h2, h3 {
font-family: Tahoma;
direction: rtl;
font-size:8pt;
color:green;
text-align: right;
}
- تاریخ آرشیو هم در همان مقاله هست و باید اعمال شده باشد.

در کل شکل و شمایل این قالب‌ها با ویرایش css آن تا حد قابل قبولی قابل تغییر است (بدون نیاز به دستکاری قسمت‌های دیگر که مربوط به تعریف ویجت‌ها است)
نظرات مطالب
ckeditor در برابر tinymce
من در چند پروژه از ckeditor استفاده کردم. خیلی راضی هستم ازش. مشکلات راست به چپ و این طور چیزها هم نداره خوشبختانه.
نظرات مطالب
ارتقاء به ASP.NET Core 1.0 - قسمت 4 - فعال سازی پردازش فایل‌های استاتیک
کتابخانه ای جهت تشخیص Mime type   (جلوگیری از آپلود فایل‌های مخرب )  
Install-Package Mime

// Guess mime type of file(overloaded method takes byte array or stream as arg.)
MimeGuesser.GuessMimeType("path/to/file"); //=> image/jpeg

نظرات مطالب
ارتقاء به ASP.NET Core 1.0 - قسمت 4 - فعال سازی پردازش فایل‌های استاتیک
یک موضوعی رو میخواستم مطرح کنم :
طبق یکی از مقالات سری ASP.net MVC سایت با استفاده از Controller فایل‌های آپلود شده رو با یک کلید ،خروجی میداد.

بنده همین موضوع رو در تکنولوژی جدید پیاده سازی کردم اما با مشکل عدم نمایش فایل یا تصویر در خروجی مواجه شدم


موجود بودن فیزیکی فایل هم در مسیر wwwroot/StaticImages/ و هم مسیر MyStaticImages/ :

و نحوه آدرس دهی :
<img src='@Url.Action("DownloadFile", "ImageHandler", new {Area = "", id = item.BaseFileGuids, imgSize = ImageHandlerController.ImgSize.M})' alt=""/>

مسیر به درستی نمایش داده شده و فایل هم پس از بررسی توسط : System.IO.File.Exists = true  می‌باشد.
اما در نمایش چه ادرس مستقیم و چه تگ <img>  خطای زیر نمایش داده میشود :


هر دو مسیر تست شده با قطعه کد زیر ، اما خطا مشابه می‌باشد
چه این گزینه hostingEnvironment.WebRootPath_
و چه این گزینه hostingEnvironment.ContentRootPath _ 
public IActionResult DownloadFile([FromRoute]string id, [FromQuery] ImgSize imgSize)
        {
            var result = _baseFileService.GetFileNameAndFileNameOnDsAndFileType(id);
            if (result == null) return View("Error");

            var fileName = result.Item1;
            string userAgent = Request.Headers["User-Agent"];
            if (IsInternetExplorer(userAgent))
            {
                var htencode = HtmlEncoder.Create();
                var attachment = string.Format("attachment; filename=\"{0}\"", htencode.Encode(fileName));
                _httpContext.HttpContext.Response.Headers.Add("Content-Disposition", attachment);
            }
            var rootPath = Path.Combine(_hostingEnvironment.WebRootPath, _settingsAppPathConfig.Value.ServerImagesRootPath);
            var filepath = Path.Combine(rootPath, imgSize.ToString().ToLower(), result.Item2);
            if (!System.IO.File.Exists(filepath))
            {
                const string notFoundImage = "notFound.jpg";
                var notFoundpath = Path.Combine(rootPath , notFoundImage);
                string contentType;
                new FileExtensionContentTypeProvider().TryGetContentType(notFoundImage, out contentType);
                return File(notFoundpath, contentType, notFoundImage);
            }
            string contentTypebase;
            new FileExtensionContentTypeProvider().TryGetContentType(result.Item3, out contentTypebase);
            return File(filepath, contentTypebase, fileName);
        }