بکارگیری FCKeditor در ASP.NET

این مقاله طریقه افزودن، پیکربندی و بکارگیری ادیتور FCKeditor را در وب سایتهای بر پایه ASP.NET تحت پوشش قرار خواهد داد. پیش فرض این مطلب این است که شما تصمیم به اضافه کردن این ادیتور به سایتی از قبل ایجاد شده را دارید. بنابراین در صورتیکه هنوز اقدام به ایجاد سایتی که در آن از این ادیتور استفاده کنید را نکرده اید با اجرای Visual Studio و انتخابFile > New > Web Site و یا ترکیب کلیدی Shift + Alt + N وب سایتی را در مسیر دلخواه ایجاد کنید.یکپارچه سازی FCKeditor و ASP.NETاولین قدم، دریافت FCKeditor و کنترل FCKeditor.net از سایت اصلی است. بخاطر داشته باشید که شما هم به کنترل و هم به فایلهای JavaScript ادیتور نیاز دارید.دریافت ادیتور FCKeditor 2.6.4.1 با حجم 1.34 مگابایتدریافت کنترل FCKeditor.Net با حجم 160 کیلوبایتفایلهای دریافتی را در یک پوشه مجزا باز کنید.FCKeditor_2.6.4.1.zip شامل فایلهای پیکربندی و کد های اسکریپت ادیتور است. محتوی این فایل یعنی پوشه fckeditor را در ریشه سایت خود کپی کنید.در صورتیکه سایت شما حاوی پوشه Bin در ریشه آن نیست با کلیک راست روی نام سایت خود در Solution Explorer و انتخاب Add ASP.NET Folder و سپس Bin آنرا ایجاد کنید.حال فایل FredCK.FCKeditorV2.dll را از مسیر FCKeditor.Net_2.6.3\bin\Release\2.0 فایل FCKeditor.Net_2.6.3.zip، در داخل پوشه Bin سایت خود کپی کنید.قدم بعدی افزودن Reference فایل FredCK.FCKeditorV2.dll به وب سایت است. برای اینکار بار دیگر روی وب سایت خود کلیک راست کرده و گزینه Add Reference را انتخاب کنید.از پنجره Add Reference برگه Browse را انتخاب کرده و سپس FredCK.FCKeditorV2.dll را از پوشه Bin انتخاب کنید.حالا می توانیم کنترل FCKeditor را به جعبه ابزار Visual Studio اضافه کنیم.روی یکی از برگه های جعبه ابزار مثلاً General کلیک راست کرده و گزینه Choose Items را انتخاب کنید.در پنجره باز شده و در برگه NET Framework Components. روی دکمه Browse کلیک کرده و در مسیر پوشه Bin سایت خود، فایل FredCK.FCKeditorV2.dll را انتخاب کنید.بعد از تایید این پنجره آیکن کنترل FCKeditor را در پایین برگه ای که در جعبه ابزار انتخاب کرده اید، مشاهده خواهید کرد.تنظیم FCKeditor برای بکارگیری در ASP.NETفایل web.config سایت خود را باز کرده و در قسمت <appSettings> خط زیر را اضافه کنید:<add key=&quotUserFilesPath&quot value=&quot~/UserFiles/&quot />مسیر مشخص شده برای UserFilesPath به پوشه محل قرارگیری تصاویر و فایلهایی اشاره می کند که توسط ادیتور Upload می شوند. توصیه می کنم از همین مقدار پیش فرض برای نگهداری فایلهای خود استفاده کنید.پوشه UserFiles را در ریشه سایت خود ساخته و مجوز (Permission) خواندن و نوشتن را به آن بدهید.فایل fckconfig.js را از پوشه fckeditor در ریشه سایت باز کرده و خطوط زیر را در آن پیدا کنید:var _FileBrowserLanguage = 'php' ; // asp | aspx | cfm | lasso | perl | php | py var _QuickUploadLanguage = 'php' ; // asp | aspx | cfm | lasso | perl | php | pyحال زبان php را به aspx تغییر دهید. یعنی:var _FileBrowserLanguage = 'aspx' ; // asp | aspx | cfm | lasso | perl | php | py var _QuickUploadLanguage = 'aspx' ; // asp | aspx | cfm | lasso | perl | php | pyنکتهفایل fckconfig.js حاوی تنظیمات عمومی ادیتور FCKeditor، مانند حذف و اضافه کردن دکمه ها و امکانات آن است. هر گونه تغییری که در این فایل و یا فایلهای مشابه می دهید را به نوعی علامتگذاری کنید تا قسمتهای تغییر یافته برای اصلاحات احتمالی بعدی به راحتی پیدا شوند. بهترین کار گرفتن یک کپی پشتیبان از فایل fckconfig.js برای بازگرداندن تنظیمات به حالت پیش فرض در موارد خاص است.فایل config.ascx را از مسیر fckeditor > editor > filemanager > connectors > aspx پیدا کرده و تابع زیر را در آن پیدا کنید:private bool CheckAuthentication() { // ... return false; }تا زمانی که این تابع مقدار False را باز می گرداند Administrator سایت امکان مشاهده و Upload کردن فایلها توسط ادیتور را نخواهد داشت. این تابع وظیفه اعتبار سنجی کاربری را که در حال کار با ادیتور است را بر عهده دارد. بدون این تابع هر کاربری می توانست فایل Upload کرده یا محتویات پوشه UserFiles را ببیند. احتمالاً تا اینجا سیستمی برای مدیریت و اعتبار سنجی کاربران سایت خود طراحی کرده اید. پس در این تابع به نوعی اعتبار و Administrator بودن کاربر جاری را چک کنید و در صورت صحت مقدار True را بازگردانید. مثالی برای تایید اعتبار کاربر جاری می تواند اینگونه باشد:return ( Session[ &quotIsAuthorized&quot ] != null && (bool)Session[ &quotIsAuthorized&quot ] == true );در حالیکه مقدار IsAuthorized Session هنگام Login کردن کاربر True شده است.نکتهبه هیچ وجه بدون اعتبار سنجی کاربر، مقدار True را باز نگردانید.در نهایت در همین فایل خط زیر را پیدا کنید:// URL path to user files. UserFilesPath = &quot/userfiles/"مطمئن شوید که مقدار UserFilesPath معادل همان مقداری باشد که در web.config وارد کرده اید.نکتهبرای تنظیم مواردی که در منوی Style ادیتور FCKeditor لیست شده اند فایل fckstyles.xml را در ریشه پوشه fckeditor سایت پیدا و ویرایش کنید. کنترل و تنظیم دقیق خروجی های ادیتور برای حفظ ساختار استاندارد سایت حیاتی است. برای اطلاعات بیشتر مطلب "10 خصوصیت یک ادیتور تحت وب مناسب برای سایتهای استاندارد" را مطالعه کنید.طریقه استفاده از FCKeditorبرای استفاده از این ادیتور دو راه وجود دارد:کشیدن و رها کردن کنترل FCKeditor از جعبه ابزار به صفحه.اضافه کردن کدهای لازم بصورت دستی به کد صفحه به صورت زیر:رجیستر کردن کنترل FCKeditor در ابتدای صفحه:<%@ Register Assembly=&quotFredCK.FCKeditorV2&quot Namespace=&quotFredCK.FCKeditorV2&quot TagPrefix=&quotFCKeditorV2&quot %>سپس افزودن تگ این ادیتور در داخل <"form runat="server>:<FCKeditorV2:FCKeditor ID=&quotFCKeditor1&quot runat=&quotserver&quot></FCKeditorV2:FCKeditor>حال ادیتور برای استفاده آماده است. صفحه را در مرورگر خود باز کنید و با امکانات آن بیشتر آشنا شوید.نکتهبرای بدست آوردن محتوی ورودی کاربر در ادیتور از عبارت fCKeditorInstanceName.Value استفاده کنید. برای اطلاعات بیشتر محتویات پوشه samples_ را از فایل FCKeditor.Net_2.6.3.zip بررسی کنید.نتیجه گیریدر این پست نحوه نصب، یکپارچه سازی و پیکربندی ادیتور FCKeditor، محبوب و پرکاربردترین ادیتور تحت وب که به همراه کنترل اختصاصی برای ASP.NET منتشر شده است را در 11 قدم مرور کردیم. در صورتیکه قسمتی از این مطلب نیاز به توضیح بیشتر دارد در قسمت نظرات مطرح کنید.دریافت وب سایت نمونهفایل ضمیمه شده حاوی وب سایتی است که در طی مراحل این مقاله برای استفاده از این ادیتور تنظیم کردیم. برای استفاده از آن، فایل فشرده شده را باز کرده و با اجرای Visual Studio و انتخاب File > Open > Web Site و یا ترکیب کلیدی Shift + Alt + O به یک سایت پیکربندی شده و آماده برای استفاده از ادیتور FCKeditor دسترسی خواهید داشت.دریافت نمونه وب سایت این پست https://royagar.com/notes/36-12-1/بکارگیری-fckeditor-در-aspnet