Последние версии CKEditor и CKFinder можно скачать с официального сайта (http://cksource.com).
Поместите вышеуказанные два ресурса в корневую папку сайта: /CKEditor (здесь, в версии 3.6.2, папку _Samples\ckeditor нужно положить в сжатую папку) и /CKFinder (нечувствительный к регистру, папку можно положить сюда напрямую). )
Обратите внимание, что здесь иногда происходит ошибка в генерации. Например, существуют дублирующиеся теги типа AssemblyTitle, главным образом потому, что на сайте есть более одного AssemblyInfo.cs для удаления загруженного файла. Или удалить папку _source. Если у вас есть вопросы здесь, вы можете связаться со мной: мой QQ: 515072775
Использование CKEditor на странице:
<textarea cols="80" id="prcontent" name="content" rows="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? Type=Вспышка'; 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 строк и добавьте атрибут: публичный bool RandomReName; Переименовывать случайным образом
Найдите 67 строк и присвоите свойству значение прямо сейчас: RandomReName = true; Значение по умолчанию верно
Сохранить закрытый файл
2) Откройте файл /Connector/Config.cs
Найдите 62 строки, добавьте атрибут:
публичный bool RandomReName
{
получить { 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 строк и добавьте атрибут: (На самом деле, вы можете добавить это или нет, потому что раньше было установлено значение по умолчанию, но при использовании исходного имени оно должно быть неверное)
//上传完毕后使用随机文件名
RandomReName = true;
Сохранение закрыто
Итак, теперь, когда настройка прошла успешно, CKEditor может иметь функцию загрузки. Настройки других функций будут продолжать изучаться, когда у вас будет время~
Ещё одно напоминание: папки CKEditor и CKFinder содержат много ненужных вещей, например, имена с подчёркиваниями, .net-проектам не нужен php, asp.
Если произошла ошибка при загрузке файла: Файл нельзя просмотреть по соображениям безопасности. Пожалуйста, свяжитесь с вашим системным администратором и проверьте профиль CKFinder.
Вам нужно изменить файл config.ascx
публичное переуправление bool CheckAuthentication()
{ reture false;
} Изменено на:
публичное переуправление 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 удалить t src="http://www.cnblogs.com/ckeditor/ckfinder/ckfinder.js" type="text/javascrip удалить t"></scrip去掉t> Существует два способа ссылки редактора на элемент управления:
Один из них — использовать текстовую область управления клиентом:
<textarea rows="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, и после входа в машину я наткнулся на пост о ckeditor интеграции с PHP. Вот как это сделать:
Измените файл config.ascx в CKFinder, чтобы изменить значение возврата публичной функции bool CheckAuthentication() с return false на true.
Протестировали снова — изображение успешно загружено! |