Най-новите версии на CKEditor и CKFinder могат да бъдат изтеглени от официалния уебсайт (http://cksource.com).
Поставете горните два ресурса в коренната директория на уебсайта: /CKEditor (тук във версия 3.6.2, трябва да сложите папката _Samples\ckeditor в компресираната папка) и /CKFinder (без регистри, можете да сложите папката директно тук). )
Забележете, тук понякога има грешка в поколението. Например, има дублиращи се тагове от типа AssemblyTitle, главно защото уебсайтът има повече от един AssemblyInfo.cs за изтриване на изтегления файл. Или изтрийте папката _source. Ако имате въпроси тук, можете да се свържете с мен: my QQ: 515072775
Използване на CKEditor на страница:
<textarea cols="80" id="prcontent" name="content" редове="50"> Здравейте, използването ви беше успешно! </textarea>
<scrip remove ttype="text/javascrip remove t" >
CKEDITOR.replace('content', { height:200, width: 520 });
</scrip去掉t>. . .
CKEditor не идва с функция за качване, затова трябва да се качва с CKFinder
Стъпка 1: Уебсайтът трябва да се позовава на dll на CKFinder (директория: /CKFinder/bin/Release/CKFinder.dll)
Стъпка 2: Конфигурирайте config.js на CKEditor (директория: /CKEditor/config.js) във функцията CKEDITOR.editorConfig и ненужните функции могат да бъдат премахнати
CKEDITOR.editorConfig = function(config) {
config.filebrowserBrowseUrl = 'ckfinder/ckfinder.html'; Не пишете "~/ckfinder/..." или "/ckfinder/..."
config.filebrowserImageBrowseUrl = 'ckfinder/ckfinder.html? Type=Изображения';
config.filebrowserFlashBrowseUrl = 'ckfinder/ckfinder.html? Тип=Светкавица';
config.filebrowserUploadUrl = 'ckfinder/core/connector/aspx/connector.aspx?command=QuickUpload&type=Files';
config.filebrowserImageUploadUrl = 'ckfinder/core/connector/aspx/connector.aspx?command=QuickUpload&type=Images';
config.filebrowserFlashUploadUrl = 'ckfinder/core/connector/aspx/connector.aspx?command=QuickUpload&type=Flash';
config.filebrowserWindowWidth = '800'; Настройката за размер на изскачащия прозорец Browse Server
config.filebrowserWindowHeight = '500';
}
CKFinder.setupCKEditor(null, '.. /ckfinder/'); Обърнете внимание, че пътят на Ckfinder съответства на действителното разположение
Конфигурацията на CKFinder:
Отворете потребителския контрол config.ascx под "ckfinder\" и променете BaseURL пътя му:
BaseUrl = "~/ckfinder/userfiles/"; или BaseUrl = "ckfinder/userfiles/";
Ето още един съвет: полезно е да се тества в IIS. В противен случай, ако качването не е успешно, ще си помислите, че има проблем с конфигурацията.
CKEditor има функция за качване след завършване на конфигурацията, но какво ако файлът с изображението е оригиналното име на изображението и иска да го смени на произволно име на файл? После погледнете третата стъпка.
Стъпка 3: Модифицирайте изходния код на CKFinder. CKFinder идва със собствен изходен код, директория: /CKFinde/_source
Създайте нов текущ проект във VS към CKFinde/_source/CKFinder.Net.sln, файлът с решение, изтеглен тук, може да не се отвори във VS2008, можете да изберете да добавите нов проект или да използвате по-нова версия на VS, за да го отворите.
1) Отворете файла /Settings/ConfigFile.cs
Намерете 27 реда и добавете атрибут: public bool RandomReName; Преименувай на случаен принцип
Намерете 67 реда и задайте стойност на свойството току-що: RandomReName = true; Стандартната стойност е вярна
Запази затворения файл
2) Отворете файла /Connector/Config.cs
Намерете 62-те реда, добавете атрибут:
публичен бул: RandomReName
{
get { returnSettings.ConfigFile.Current.RandomReName; }
}
Запази затворения файл
3) Отворете файла /Connector/CommandHandlers/FileUploadCommandHandler.cs
Намерете ред 64 и добавете код за преценка:
if ( Config.Current.RandomReName) // Използвайте случайно име
sFileName =DateTime.Now.ToString("yyyyMMddHHmmssfff") + "." +sExtension;
Запази затворения файл
4) Регенериране на проекта, презапишете /ckfinder/_source/bin/Debug/CKFinder.dll /ckfinder/bin/Release/CKFinder.dll или премахнете предварително добавените препратки към уебсайта и премахнете отново dll от проекта CKFinder.Net
Последна стъпка: Отворете /ckfinder/config.ascx
Намерете 40 реда и добавете атрибут: (Всъщност, можете да добавите това или не, защото преди е имало стандартна стойност, но тя трябва да е зададена на false при използване на оригиналното име)
//上传完毕后使用随机文件名
RandomReName = вярно;
Запази затворено
Добре, сега когато конфигурацията е успешна, CKEditor може да има функция за качване. Настройките на другите функции ще продължат да се изучават, когато имате време~
Още едно напомняне: папките CKEditor и CKFinder съдържат много ненужни неща, като имена с подчертани линии, .net проектите не се нуждаят от php, asp.
Ако има грешка при качване на файл: Файлът не може да бъде прегледан поради съображения за сигурност. Моля, свържете се със системния си администратор и проверете профила на CKFinder.
Трябва да модифицирате config.ascx файла
public override bool CheckAuthentication()
{
reture false;
}
Модифицирано на:
public override bool CheckAuthentication()
{
Валидиране на формуляри
returnRequest.IsAuthenticated;
}
3. Прилагане на контрол на CKEditor на страницата [два метода, a и b]
[О: Цитиране на INSTALL.html в компресирания пакет]
Ако искате да интегрирате CKEditor с вашата ASP.NET страница, следвайте стъпките, описани по-долу.
1. Посетете официалния сайт за изтегляне на CKEditor и изтеглете най-новите версии както на CKEditor 3.x, така и на CKEditor за ASP.NET Control.
2. Разопаковайте и двата инсталационни пакета на желано място Премахнете n.
3. Добавете препратка към CKEditor за ASP.NET Control към вашия уебсайт.
Във Visual Studio използвайте командата Add Reference и разгледайте файла bin\Release\CKEditor.NET.dll от разопакования CKEditor за ASP.NET инсталационен пакет. Можеш също ръчно да копираш DLL файла в папката bin на приложението си.
4. Копирайте разопакованите редакторски файлове от инсталационния пакет CKEditor 3.x и ги поставете в директорията на приложението на вашия уебсайт.
5. Регистрирайте CKEditor за ASP.NET Control на вашата страница:
<%@ Register Assembly="CKEditor.NET" Namespace="CKEditor.NET" TagPrefix="CKEditor" %>
6. Вмъкнете CKEditor инстанция в тялото на страницата:
<CKEditor:CKEditorControl ID="CKEditor1" runat="server"></CKEditor:CKEditorControl>
【b】
1. <head>Добавете съответната js препратка към страницата:
<scrip remove t type="text/javascrip remove t" language="javascrip remove t" src="ckfinder/ckfinder.js"></scrip去掉t>
<scrip remove t type="text/javascrip remove t" language="javascrip remove t" src="ckeditor/ckeditor.js"></scrip去掉t>
2. След това <body>добавете следния код към мястото, където трябва да бъде поставен контролът, и има следните методи за използване:
(1) Добавете зададения атрибут клас към контрола
<textarea id="textarea1" name="editor1" class="ckeditor">здравейте!</textarea>
Контроли на сървъра:
<asp:TextBox ID="TextBox1" runat="server" TextMode="MultiLine" CssClass="ckeditor"></asp:TextBox>
(2) Inject js код – тук js кодът е най-добре да се пише след контрола или <head>в него
<textarea id="textarea1" name="editor1">здравейте!</textarea>
<scrip remove t type="text/javascrip remove t" >
CKEDITOR.replace('editor1', { height:400, width:800 });
</scrip去掉t>. . .
Контроли на сървъра:
<asp:TextBox ID="mckeditor" runat="server" TextMode="MultiLine"></asp:TextBox>
<scrip remove t type="text/javascrip remove t" >
CKEDITOR.replace('<%=mckeditor. ClientID %>');
</scrip去掉t>. . .
=============================================================================================================
Втори източник:
asp.net метода на конфигурация на ckeditor 3.0.1 и ckfinder_aspnet_1.4.1.1
Според подсказките на http://ckeditor.com.cn/docs/, CKEditor е конфигуриран на уеб страницата и когато се гледа в браузъра, усещам, че интерфейсът на CKEditor наистина е много красив, но когато с удоволствие исках да опитам функцията за качване на изображение, не видях бутона за качване на изображението.
Продължавайки търсенето онлайн, заключението беше, че "CKEditor няма функция за качване и трябва да бъде интегриран с CKFinder, за да се постигне функцията за качване".
След това изтегли CKFinder 1.4.1.1 за Asp.net, разархивирай я и сложи папката ckfinder в коренната директория на проекта – защото много източници в интернет казват, че е най-добре да се поставят CKEditor и CKFinder в една и съща директория за нива. И по този начин ще имаме още две папки в нашия проект без причина. Аз самият имам фетиш към чистота на кодекса, мисля,
Оставете папка като знак на уважение към автора, това ще е достатъчно. Да държа две би ме накарало да се чувствам много неудобно.
Преди да интегрираме CKFinder в CKEditor, трябва да конфигурираме и малко CKFinder. Умните приятели лесно трябва да мислят, че тъй като е плъгин за качване на файлове, повечето неща, които трябва да се конфигурират, са пътят към качване на файлове.
Стандартният път за качване на CKFinder е папката userfiles в собствена директория, но аз съм сложил CKFinder в папката CKEditor – ако съхраня изображението в потребителските файлове, системата трябва да заобиколи трислойната папка, за да намери файла или изображението, затова планирам да кача изображението в папката upFile в кореновата директория на проекта.
За да реализирате тази функция, трябва да промените config.ascx файла под CKFinder, за да промените BaseUrl = "/ckfinder/userfiles/" на BaseUrl = "~/upFile/". След това изрежете CKFinder.dll файловете от папката CKFinder/bin в папката bin на системния проект. Или да въведете CKFinder.dll в проекта, като добавите препратки.
След това можем да използваме CKEditor за качване на файлове:
Поставете папката CKFinder в папката CKEditor и на страницата импортирайте js файловете и на двете:
<scrip remove tsrc="http://www.cnblogs.com/ckeditor/ckeditor.js" type="text/javascrip remove t"></scrip去掉t>
<scrip remove t src="http://www.cnblogs.com/ckeditor/ckfinder/ckfinder.js" type="text/javascrip remove t"></scrip去掉t>
Има два начина да се препрати редакторът към контрол:
Едната е да използвате текстовата зона за контрол на клиента:
<текстови редове="20" cols="40" name="txtContent" id="txtContent"></textarea>
<scrip remove t type="text/javascrip remove t" >
var editor = CKEDITOR.replace('txtContent');
CKFinder.SetupCKEditor (редактор, 'http://www.cnblogs.com/ckeditor/ckfinder/');
</scrip去掉t>. . .
Вторият е използването на сървърната контролна текстова кутия:
<asp:TextBox id="txtContent" TextMode="MultiLine" Text='<%# Bind("info") %>' runat="server"></asp:TextBox>
<scrip remove t type="text/javascrip remove t" >
var editor = CKEDITOR.replace('txtContent');
CKFinder.SetupCKEditor (редактор, 'http://www.cnblogs.com/ckeditor/ckfinder/');
</scrip去掉t>Лично аз мисля, че тъй като е asp.net програма, използвайте контролите от страна на сървъра. Въпреки че работи малко по-бавно от клиентските контроли, разработката е малко по-бърза. И като програмисти винаги обичаме да пробваме всички възможности, преди да изберем тази, която ни харесва.
Всъщност можете също да зададете стойности на контрола без да използвате Text='<%# Bind("info") %>'' и да го използвате директно в беккода
this.txtContent.Text="Начална стойност"
Възможно е също. Можете също да използвате следния код директно, за да получите стойността:
CKFinder и CKEditor код. Когато стартирам страницата директно с редактора, компилаторът дава следната грешка:
string content=this.txtContent.Text
Забележка: Атрибутът TextMode="MultiLine" е от съществено значение, в противен случай стойността ще бъде нулева.
Не направих оптимизиране преди да дебъгвам програмата
Името на типа или пространството от имена "ControlDesigner" не съществува в пространството "System.Web.UI.Design" (липсва ли му асемблерна референция?)
Грешката е на ред 19 на ckeditor\ckfinder\_source\FileBrowserDesigner.cs, така че просто опростете файла:
Първата стъпка е оптимизиране на ckeditor: изтриване на папките _samples и _source и само три езикови файла могат да се съхраняват в lang директорията: en.js, zh.js и zh-cn.js;
Втората стъпка е да оптимизирате ckfinder: изтрийте папките _samples и _source и оставете само файловете en.js, zh.js и zh-cn.js езика в директорията lang.
Обърнете внимание на втория ред от js код тук: CKFinder.SetupCKEditor(редактор, 'http://www.cnblogs.com/ckeditor/ckfinder/'); , където "http://www.cnblogs.com/ckeditor/ckfinder/" е относителният път на ckfinder към текущата страница,
Моля, не копирайте и поставяйте кода директно, в противен случай може да се появи следната грешка при качване на изображения:
Описание: HTTP 404. Ресурсът, който търсите (или някоя от неговите зависимости), може да е премахнат, името му да е променено или временно да е недостъпен. Моля, проверете следния URL адрес и се уверете, че е изписан правилно.
Поискан URL: /admin/ckeditor/ckfinder/core/connector/aspx/connector.aspx
Така че, ако не искаш да сложиш ckfinder в папката ckeditor, както аз направих, това е окей, стига да попълниш правилно промените в пътя тук.
Мислех, че това ще се счита за цялата работа, но когато качих изображението, се появи следната заявка:
Поради съображения за сигурност файлът не може да бъде разглеждан. Моля, свържете се със системния си администратор и проверете профила на CKFinder.
Няма начин, както казва поговорката, добрите неща да са трудни за ядене. Мога да попитам само най-добрия учител – Байду. Копирах горната информация за подсказка в полето за търсене на Baidu и след като влязох в колата, намерих публикация за интеграция с PHP ckeditor. Ето как да го направите:
Модифицирайте config.ascx файла под CKFinder, за да промените стойността на връщането на публичната функция bool CheckAuthentication() от return false към return true.
Тествах отново, изображението беше качено успешно! |
Публикувано в 18.04.2015 г. 19:11:55 ч.
|
|
|
