Според мое мислење, CKEditor е еден од најдобрите wysiwyg уредници за веб-страници. Во последно време, во него се појавија многу глупости за да го поедностават животот на корисникот, што на крајот му пречи како ACF. Веќе знам како да го уредувам и оневозможам. Но, да се вратиме на темата на нашата статија: како да инсталирате приклучоци на CKEditor.

Овде гледам два пристапи.

Прво, одиме на веб-страницата на уредникот и го обновуваме CKeditor за себе, вклучувајќи ги и додатоците што ни се потребни. Ова е направено на следниов начин. Одиме на веб-страницата ckeditor.com, одете на табулаторот за преземање. Следно, изберете Или дозволете ми да го приспособам CKEditor

Но, во овој случај, не се прикажуваат сите додатоци. За да вклучите нови или специјални приклучоци во вашата верзија, треба да ја изградите вашата верзија малку поинаку. Одете до Додатоци -> Приклучоци и видете го следното подвижно мени десно

Кога ќе кликнете на копчето Додај во мојот уредник, приклучокот се додава на собранието. Кога ќе завршите, кликнете Изгради го мојот уредник и заменете го нашиот вграден уредник со генерираниот.

Вториот пристап е за оние кои се заинтересирани самите да навлезат во кодот.

На веб-локацијата ckeditor.com, одете во делот add-ons->plug-in и кликнете на потребниот додаток.

Изберете Преземи и следете ги упатствата од страницата. Во најголем дел, тие или се сведуваат на фактот дека треба да инсталирате зависности за даден приклучок и да го регистрирате и самиот приклучок во полето на конфигурациската датотека config.js и додатокот од кој зависи тој што се инсталира, одделени со запирки, на пример,

Config.extraPlugins = "codemirror,youtube,imagerotate";

Го користев BUEditor на мојата веб-страница - едноставен, удобен уредник, но не е многу погоден за корисниците. Често размислував да инсталирам CKEditor, но ми се чинеше како некој вид чудовиште, но во реалноста сè се покажа дека не е толку страшно.

Прочитајте како да го инсталирате модулот.

Откако ќе се поврзете преку вашиот модул, на страницата admin/config/content/ckeditor/edit/profile_assignment во јазичето ИЗГЛЕД НА УРЕДНИКОТ, Во поглавје ПриклучоциЌе се појави поле за избор за активирање. Вклучете, зачувајте, проверете.

3. Вметнување врски. Надвор од кутијата, полето за дијалог за вметнување врска содржи куп непотребни и нејасни работи. Го заменуваме со додатокот Simple link. Како да инсталирате, видете чекор 2. Поврзете се (види точка 1):

Config.extraPlugins = „Едноставна врска“;

Ќе се појави и нова икона за приклучок (копче).

4. Вметнување слики. Овде сè е исто како кај врските; можете да го инсталирате приклучокот Simple Image за вметнување слики преку врски.

Config.extraPlugins = "Едноставна слика";

Или поставете слики користејќи го модулот за поставување со еден клик. . Прочитај повеќе. Се решив на вториот метод, иако ги користев и двата во BUEditor.

Единственото нешто што сакам да го додадам е дека додатокот Enhanced Image бара уште два приклучоци Widget и Lineutils.

Не можев да разберам зошто приклучокот не започна додека не го погледнав дневникот

5. Изглед. Скинот Moono се користи стандардно, но сакав да го доведам изгледот на изгледот на BUEditor.

вака изгледаше BUEditor

7. Местоносител. За да додадете место за место, инсталирајте го приклучокот (види точка 2) Помошник за конфигурација. Поврзете се (види точка 1):

Config.extraPlugins = "confighelper"; config.placeholder = "Нашиот текст"; // текст нашего placeholder !}

8. Смешковци. Приклучокот Insert Smiley е одговорен за насмевки во CKEditor; тој е вклучен во стандардниот пакет - Целосен пакет.

Вака изгледаат смешковците надвор од кутијата:

За да ги замените со свои, треба да ја наведете патеката до папката со слики smiley_path во конфигурацијата (видете чекор 1):

Config.smiley_path = "/sites/default/files/smileys/";

Внесете ги имињата на датотеките (слики) што ќе бидат прикажани smiley_images :

Config.smiley_images = ["smile_1.png","smile_2.png"];

И опис (опис на лебдиш) smiley_descriptions

Config.smiley_descriptions = ["опис-1", "опис-2"];

Можете исто така да одредите колку колони да прикажуваат смешковци во (стандардно: 8) smiley_columns

Config.smiley_columns = 6;

Еве што добив

9. Проверка на правопис на прелистувачот. Како што напиша UksusoFF во CKEditor, проверката на правопис на прелистувачот е оневозможена. За да го оневозможите ова оневозможување (малку тавтологија), треба да напишете во конфигурацијата:

Config.disableNativeSpellChecker = неточно;

10. Контекстно мени. Во CKEditor, кога ќе притиснете RMB, се отвора контекстно мени, а не мајчиното мени на прелистувачот

CKEditor 4 - уредник на написи WYSIWYG. Ви овозможува да вршите флексибилно форматирање на текст, вклучувајќи работа со стилови, списоци, врски, графики итн.

Интерфејс

Слика 1. Прозорец за уредување

Прозорецот на уредувачот WYSIWYG ги содржи следните панели со копчиња:

	Префрлање на режимот на гледање
	Печатење и избор на шаблон за статија
	Работа со таблата со исечоци (отсечете, копирајте, залепете, вратите)
	Пребарувајте и заменете
	Креирање на форми
	Вметнување спојлери (текст што се склопува) и прекини на страници
	Промена на стилот на текстот
	Форматирање на параграфи
	Вметнување врски
	Вметнување медиумска содржина од трети страни
	Вметнување предмети
	Избор на стил на форматирање
	Изберете форматирање на пасус
	Избор на фонт
	Избор на големина на фонтот
	Избор на боја на текст или позадина
	Проверка на правопис
	Дополнителни опции за гледање (прикажи блокови и прошири)

Долниот панел на прозорецот на уредувачот содржи информации за тековната таг и текстуална статистика:

Префрлување на режимот на гледање

Панелот за менување режими на гледање уредник ги содржи следните копчиња:

Печатење и избор на шаблон за статија

Панелот за избор на шаблони за печатење и статии ги содржи следните копчиња:

Печатење на статијата на печатач. Откако ќе кликнете на ова копче, ќе се отвори стандарден дијалог прозорец со барање да изберете печатач и да го испечатите текстот на статијата.

Избор на шаблон за статија: Слика и наслов – шаблон на напис кој содржи наслов, слика и текст Чуден Шаблон – шаблон на статија чиј текст е поделен на две колони Текст и табела – шаблон за напис кој содржи наслов, табела и текст Шаблонот е предефиниран код за означување на HTML за идна статија. Описот на шаблоните е содржан во датотеката „plugins/templates/templates/default.js“. Можете да додадете сопствени шаблони во оваа датотека или да креирате посебна датотека со шаблони и да го конфигурирате CKEditor да работи со неа.

Работа со таблата со исечоци

Следниве операции за работа со таблата со исечоци се достапни во уредникот:

	Копче „Исечи“. Го сече избраниот дел од статијата и го става на таблата со исечоци.
	Копче за копирање. Го копира избраниот фрагмент од статијата и го става на таблата со исечоци.
	Копче „Вметни“. Ја залепува содржината на таблата со исечоци во статијата. Ако текстот е залепен од надворешни апликации, како што е MS Office, сите ознаки поврзани со форматирање ќе бидат вклучени при вметнување. Повеќето од овие ознаки се непотребни и треба да се отстранат, што го отежнува уредувањето на статијата. Затоа, се препорачува да се користи ова копче само за вметнување неформатирани текстови.
	Копче „Вметни само текст“. Слично на копчето „Вметни“. Кога ќе залепите фрагмент од статија од таблата со исечоци, неговото форматирање е целосно отстрането.
	Копче „Вметни од Word“. Слично на копчето „Вметни“. Се користи ако сакате да го зачувате форматирањето на вметнатиот фрагмент. Лепењето оптимално го зачувува изгледот на текстот и го отстранува непотребното форматирање. Се препорачува за употреба при копирање текст од MS Word или други апликации на MS Office.
	Копче за откажување. Се користи за поништување на последната направена промена.
	Копче „Повтори“. Се користи за враќање на последната вратена промена.

Пребарувајте и заменете

Панелот Најдете и замени ги содржи следните копчиња:

Пребарување

Кога ќе кликнете на копчето „Најди“, се отвора прозорец за пребарување:

Во полето „Најди“, внесете го саканиот текстуален фрагмент.

Достапни се следните опции:

• Низ целиот текст. Ако опцијата е овозможена, тогаш кога ќе се достигне крајот на статијата, пребарувањето ќе продолжи од нејзиниот почеток. Ако опцијата е оневозможена, пребарувањето ќе заврши кога ќе се достигне крајот на статијата.

За да извршите пребарување, мора да го внесете фрагментот што го барате, да ги овозможите потребните опции за пребарување и да кликнете на копчето „Најди“. Уредникот ќе изврши пребарување и ќе го означи првиот фрагмент пронајден во текстот на статијата. Секој пат кога повторно ќе кликнете на копчето „Најди“, уредникот ќе пребарува понатаму низ текстот и ќе го означи следниот пронајден фрагмент.

Замена

Кога ќе кликнете на копчето „Замени“, се отвора прозорец за замена на текстуален фрагмент:

Во полето „Најди“, внесете го саканиот текстуален фрагмент. Во полето „Замени со“ текстот со кој сакате да го замените пребаруваниот фрагмент.

Достапни се следните опции:

• Чувствителни на букви. Ако опцијата е овозможена, пребарувањето ќе го земе предвид случајот на знаците на пребаруваниот фрагмент.
• Само целиот збор. Ако опцијата е овозможена, уредникот ќе го бара внесениот фрагмент како цел збор. Резултатите од пребарувањето нема да вклучуваат зборови за кои е дел внесениот фрагмент.
• Низ целиот текст. Ако опцијата е овозможена, тогаш кога ќе се достигне крајот на статијата, пребарувањето ќе продолжи од нејзиниот почеток. Ако опцијата е оневозможена, пребарувањето ќе заврши кога ќе се достигне крајот на статијата.

За да извршите замена, мора да ги пополните полињата „Најди“ и „Замени со“, да ги овозможите потребните опции за пребарување и да кликнете на копчето „Замени“ или „Замени ги сите“. Кога ќе кликнете на копчето „Замени“, уредникот ќе го пребарува и замени првиот фрагмент пронајден во текстот на статијата. Секој пат кога повторно ќе кликнете на копчето „Замени“, уредникот ќе пребарува понатаму низ текстот и ќе го замени следниот пронајден фрагмент.
Кога ќе кликнете на копчето „Замени ги сите“, уредникот веднаш ќе го пребарува и замени потребниот фрагмент низ целиот текст на статијата.

Креирање на форми

Формуларите се дизајнирани за корисникот да внесува податоци во прозорецот на прелистувачот, да ги пренесе на процесорот и, доколку е потребно, да ги прикаже резултатите од обработката. На пример: формулар за регистрација на корисник, формулар за повратни информации итн.

Панелот за креирање формулари ги содржи следните копчиња:

	Копче „Форма“. Се користи за вметнување формулар во статија. Во HTML кодот, формата одговара на ознаката за форма.
	Копче „Поле за проверка“. Се користи за вметнување полиња за штиклирање (проверки, ознаки) во формулар или статија.
	Радио копче. Се користи за вметнување радио копчиња (прекинувачи) во форма или статија.
	Копче за текстуално поле. Се користи за вметнување поле за внесување текст во една линија.
	Копче за поле за текст со повеќе линии. Се користи за вметнување поле за внесување текст со повеќе линии.
	Копче „Опаѓачка листа“. Се користи за вметнување паѓачка листа.
	Копче „Копче“. Се користи за вметнување копче во форма или статија.
	„Копче за слика“. Се користи за вметнување слика што ќе се користи како копче.
	Копче „Скриено поле“. Се користи за вметнување скриено поле во формулар или статија.

Форма

Кога ќе кликнете на копчето „Форма“, се отвора прозорецот за поставки за новата форма.

Прозорецот за поставки за форма ги содржи следните полиња:

Име	Произволно име на форма. Во HTML кодот - параметарот име.
Акција	URL-то на програмата или документот што ги обработува податоците внесени во формуларот. Во HTML кодот - параметарот за акција.
Идентификатор	Единствен идентификатор на формуларот. Во HTML кодот – параметарот id.
Кодирање	Избирање како да се кодираат податоците од формуларот. Во HTML кодот - параметарот ентип. Достапни вредности: текст/обичен – празни места се заменуваат со знак „+“, буквите и другите симболи не се кодирани; повеќеделни/форма-податоци – податоците не се кодирани. Се користи при испраќање датотеки преку формулар; апликација/x-www-form-urlencoded – празни места се заменуваат со знакот „+“, знаците освен латинскиот распоред (букви од руската азбука, итн.) се кодирани со нивните хексадецимални вредности.
Цел	Избор на прозорец или рамка во која процесорот на податоци ќе ги прикажува резултатите од обработката. Во HTML кодот - целниот параметар. Достапни вредности: Нов прозорец (_blank) – ги прикажува резултатите во нов прозорец на прелистувачот; Главен прозорец (_top) – ги игнорира рамките и ги прикажува резултатите во целосен прозорец на прелистувачот. Ако нема рамки, тогаш работи слично како _self (види подолу); Тековен прозорец (_self) – ги прикажува резултатите во тековниот прозорец; Родителски прозорец (_parent) – ги прикажува резултатите во родителската рамка. Ако нема рамки, тогаш _self работи слично.
Метод	Избирање на методот за барање HTTP за користење. Во HTML кодот - параметарот на методот. Достапни вредности: GET - URL-то на повиканиот управувач се користи за пренос на податоци. Пренесените податоци се прикажуваат во лентата за адреси на прелистувачот. Количината на пренесените податоци е ограничена со максималната дозволена должина на лентата за адреси на прелистувачот; POST – телото на барањето на веб-прелистувачот до серверот се користи за пренос на податоци. Пренесените податоци не се прикажуваат во прелистувачот. Обемот на пренесените податоци не е ограничен. Методот ви овозможува да пренесувате датотеки.

Поле за избор

Полето за избор е дизајнирано да прикажува контроли што овозможуваат или оневозможуваат својство или опција. Таков елемент може да земе една од двете вредности: да или не. Во HTML-кодот, овој елемент одговара на ознаката за внесување тип = "поле за проверка". Кога ќе кликнете на копчето „Плоча за проверка“, се отвора прозорецот за поставки за новиот елемент.

Прозорецот за поставки за елементот „Поле за проверка“ ги содржи следните полиња:

• Име - произволно име на елементот. Во HTML кодот – параметарот име;
• Вредност - делува како единствен идентификатор за елементот. Во HTML кодот – параметарот вредност;
• Избрано - ако опцијата е овозможена, тогаш стандардно овој елемент ќе биде означен.

Радио копче

Елементот „Радио копче“ е дизајниран да прикажува група вредности со можност да се избере само една од нив. Оние. елементите во групата меѓусебно се исклучуваат. Секој елемент може да земе една од двете вредности: да или не. Во HTML-кодот, овој елемент одговара на ознаката за влезен тип =="радио". Кога ќе кликнете на копчето „Радио копче“, се отвора прозорецот за поставки за новиот елемент.

Прозорецот за поставки за елементот „Радио копче“ ги содржи следните полиња:

• Елементите во групата мора да го имаат истото име.
• Вредност - делува како единствен идентификатор за елементот. Во кодот HTML - параметарот на вредноста.
• Избрано - ако опцијата е овозможена, тогаш стандардно овој елемент ќе биде означен. Во рамките на групата, ова својство треба да биде овозможено само за еден елемент. Ако е овозможено за неколку елементи, тогаш само последниот ќе биде означен.

Текстуално поле

Елементот „Текстуално поле“ е наменет за корисникот да внесе текстуална низа. Во HTML кодот, овој елемент одговара на ознаката за внесување тип = "текст". Кога ќе кликнете на копчето „Текстуално поле“, се отвора прозорецот за поставки за новото поле.

• Име - произволно име на елементот. Во HTML кодот - параметарот име.
• Вредност - Го содржи текстот што ќе се прикаже во стандардното поле за текст. Во кодот HTML - параметарот на вредноста.
• Ширина на поле (во знаци) - должината на полето за внесување текст во знаци. Во HTML кодот - параметарот за големина.
• Макс. број на знаци - максималната должина на низата што може да се внесе во полето за текст, во знаци. Во HTML кодот - параметарот за максимална должина.
• Тип на содржина - Тип на содржина на полето за текст. Во HTML кодот - параметарот тип. Пред да испратите податоци на серверот, се проверува дали се усогласени со утврдениот тип.

Достапни типови содржини:

• Е-пошта – полето за текст ја содржи адресата на е-пошта;
• Лозинка – полето за текст ја содржи лозинката;
• Пребарување – полето за текст е наменето за внесување на пребаруваниот текст;
• Телефонски број – полето за текст содржи телефонски број;
• Текст – полето за текст содржи правилна линија;
• Врска – Текстуалното поле го содржи URL-то.

Поле за текст со повеќе линии

Елементот „Повеќе текстуално поле“ е наменет за корисничко внесување текст кој се состои од неколку линии. Во HTML кодот, овој елемент одговара на ознака за спарена текстуална област. Кога ќе кликнете на копчето „Повеќе текстуално поле“, се отвора прозорецот за поставки за новото поле.

Прозорецот за поставки за елементот „Поле за текст“ ги содржи следните полиња:

• Име - произволно име на елементот. Во HTML кодот - параметарот име.
• Колони - ширина на полето во знаци. Во HTML кодот – параметарот cols.
• Редови - висина на полето во редови. Во HTML кодот - параметарот на редови.
• Вредност - Го содржи текстот што ќе се прикаже во стандардното поле за текст.

Паѓачка листа

Елементот Dropdown List е дизајниран да прикажува листа со повеќекратни избори или паѓачка листа. Во HTML кодот, овој елемент одговара на спарена избрана ознака. Елементите на списокот имаат ознака за спарена опција. Кога ќе кликнете на копчето „Опаѓачка листа“, се отвора прозорецот за поставки за новата листа.

Прозорецот за поставки на списокот со повеќекратни избори ги содржи следните полиња:

• Име - произволно име на елементот. Во HTML кодот - параметарот име.
• Вредност - ја содржи вредноста на ставката од списокот што е стандардно избрана. Во HTML-кодот за овој елемент, ознаката за опција е поставена на избрано=избрано.
• Големина - висината на прикажаната област на списокот во линии. Ако големината е еднаква на една, тогаш ќе се прикаже паѓачка листа. Ако големината не е одредена, приказот на списокот ќе зависи од опцијата Дозволи повеќекратни селекции.

Група параметри „Достапни опции“:

• Текст - поле за внесување на прикажаниот текст на ставката од списокот. Внесено заедно со полето „Вредност“. За да додадете пар „Текст – вредност“ на списокот, кликнете на копчето „Додај“.
• Вредност - поле за внесување на вредноста на ставката од списокот испратена до серверот. Внесено заедно со полето „текст“. За да додадете пар „Текст – вредност“ на списокот, кликнете на копчето „Додај“.
• Додај - копче за додавање на внесениот пар „Текст – вредност“ на листата.
• Уреди - копче за промена на избраната ставка од списокот. За да промените, треба да го изберете потребниот елемент во поставките на списокот, да ја уредите содржината на полињата „Текст“ и „Вредност“ и да кликнете на копчето „Промени“. Избраниот елемент соодветно ќе се ажурира.
• Raise - копче за поместување на избраната ставка од списокот едно ниво погоре.
• Долна - копче за поместување на избраната ставка од списокот едно ниво подолу.
• Обележете како избрано - кога ќе кликнете на копчето, избраната ставка од списокот станува стандардно означена како избрана. Вредноста на елементот се прикажува во полето „Вредност“ (види погоре). Во HTML-кодот за овој елемент, ознаката за опција е поставена на избрано=избрано.
• Избриши - копче за бришење на избраната ставка од списокот.
• Дозволи повеќекратен избор - ако својството е овозможено, тогаш со помош на копчето ctrl може да изберете повеќе ставки од списокот. Ако големината на списокот не е одредена и имотот е оневозможен, ќе се прикаже паѓачка листа. Ако големината на списокот не е одредена и имотот е овозможен, тогаш големината на списокот е поставена на четири.

Следува крајот на статијата...

Денес ќе откриеме како да го интегрираме и конфигурираме многу популарниот уредувач на содржина CKEditor во стандардна апликација ASP.NET MVC. Исто така, ќе го инсталираме и конфигурираме подеднакво популарниот менаџер на датотеки CKFinder.

Официјална страница за програмери: https://ckeditor.com/

CKEditor е многу популарен визуелен WYSIWYG HTML уредник на содржина денес.

CKFinder е менаџер на датотеки што ви овозможува да пристапите до датотечниот систем на серверот и да управувате со датотеки од прелистувачот на клиентот.

Обично и двете од овие компоненти се спојуваат, односно менаџерот на датотеки е интегриран во уредникот.

CKEditor е достапен во две верзии. Верзијата 4 е постара и затоа е пораспространета. И верзија 5, нова, со имплементација на модуларна архитектура, со многу иновации.

Поставување на CKEditor

Ја користам верзијата 4 во моите проекти, нејзината функционалност е сосема доволна за да ги реши сите проблеми. Ајде да ја преземеме архивата со уредникот и да ја додадеме во нашиот проект.

Додавањето CKEditor е многу едноставно. Ова се случува во неколку фази:

ја поврзуваме библиотеката JS со страницата преку ознака;

ние дефинираме HTML ознака што ќе се користи како контејнер за CKEditor;

користете го методот CKEDITOR.replace(); за да го поврзете уредникот со претходно дефинирана .

) document.addEventListener("DOMContentLoaded", функција (настан) ( var editor = CKEDITOR.replace ("содржина1"); ));

Сè е подготвено! Во горниот пример, CKEditor се поврзува со текстуалната област „содржина1“ во HTML форма. Следно, содржината на ова поле ќе биде испратена до серверот.

Вреди да се напомене дека има многу додатоци за CKEditor кои ја прошируваат неговата стандардна функционалност. Можете и сами да пишувате приклучоци (овој процес е подетално опишан во официјалната документација на веб-страницата). Ајде да додадеме приклучок во уредникот што ви овозможува да вградите видео од видео хостинг на YouTube на страницата.

Во моментот на пишување, сите додатоци може да се најдат во посебен дел на страницата. Приклучокот за кој сме заинтересирани се наоѓа на: https://ckeditor.com/cke4/addon/youtube

После ова, на лентата со алатки на уредувачот ќе се појави ново копче кое ви овозможува да работите со новиот приклучок.

Поставување на CKFinder

Сега да го погледнеме менаџерот на датотеки CKFinder. Бидејќи нашите датотеки (на пример, слики) се наоѓаат на серверот, покрај поврзувањето на оваа компонента на клиентот, односно во прелистувачот на корисникот, ќе треба да ја конфигурираме и на страната на серверот и конкретно да поврземе некои библиотеки и имплементира неколку методи.

Официјалната документација за поставување конектор за ASP.NET апликациите се наоѓа на: https://ckeditor.com/docs/ckfinder/ckfinder3-net/

За разлика од уредникот CKEditor, кој го конфигуриравме на веб-локацијата и го преземавме рачно, можеме да го додадеме CKFinder на проектот директно во Visual Studio преку . Минималниот сет на пакети потребни за работа изгледа вака:

CKSource.CKFinder - JavaScript клиент, се поврзува на страната на клиентот

CKSource.CKFinder.Connector.Core - главната и клучната библиотека што гарантира дека конекторот CKFinder работи на серверот

CKSource.CKFinder.Connector.Config - Оваа библиотека ви овозможува да го конфигурирате CKFinder преку заедничкиот . Забележете како конфигурациската датотека се менува по инсталирањето на овој пакет; сега сите поставки за CKFinder се таму.

CKSource.CKFinder.Connector.Host.Owin - оваа библиотека ви овозможува да поврзете конектор како OWIN компонента во апликација. На страната на серверот, CKFinder работи токму според оваа спецификација, т.е. Отворете веб-интерфејс за .NET

Microsoft.Owin.Host.SystemWeb - веднаш инсталирајте OWIN хост или сервер

CKSource.FileSystem.Local - оваа компонента додава поддршка за работа со датотечен систем на серверот

Откако ќе ги инсталирате сите потребни компоненти, можете да започнете со поставување на страната на серверот.

Прво, CKFinder бара само автентицираните корисници да имаат пристап до датотечниот систем, односно секогаш кога ќе се поднесе барање до серверот преку овој менаџер на датотеки, ние мора да му кажеме дали на дадениот корисник му е дозволен пристап до датотеките на серверот или не .

За да го направите ова, треба да имплементираме посебен интерфејс, а во него метод што ги автентицира сите дојдовни барања.

CKFinderAuthenticator.cs

Јавна класа CKFinderAuthenticator: IAuthenticator (јавна задача AuthenticateAsync(ICommandRequest commandRequest, CancellationToken cancellationToken) ( var корисник = нов корисник(точно, нова листа()); врати Task.FromResult((IUser) корисник); ))

Во примерот погоре, ние едноставно враќаме лажен корисник секој пат што е секогаш автентициран (вистинско знаме) и нема улоги (празен лист). Тоа е, ние секогаш имаме права за пристап до датотечниот систем. Во вистински проект, се разбира, на ова прашање треба да му се пристапи посериозно и овој метод треба да се комбинира со постоечкиот систем за автентикација и авторизација на корисникот.

Именски простор CKEditor ( јавна класа Стартување ( јавна празнина конфигурација (Апликација IAppBuilder) ( // регистрирајте го датотечниот систем за конекторот FileSystemFactory.RegisterFileSystem(); // прогласете маршрута во апликацијата и мапирајте ја на конекторот // клиентот CKFinder JS библиотеката очекува да го види конекторот долж оваа апликација за маршрута. Map("/ckfinder/connector", SetupConnector); ) //изјави метод за поставување и иницијализирање на приватен статички празнина на конекторот SetupConnector(Апликација IAppBuilder) ( //создадете примери на потребните класи var connectorFactory = нов OwinConnectorFactory(); var connectorBuilder = нов ConnectorBuilder();var customAuthenticator = нов CKFinderAuthenticator();connectorBuilder .LoadConfig() //вчитај ја конфигурацијата од датотеката Web.config .SetAuthenticator(customA) поставете го претходно дефинираниот автентикатор. ); //додадете конектор во апликацијата на гасоводот.UseConnector(конектор); ) ))

Ова ја комплетира конфигурацијата на страната на серверот. Сега го интегрираме клиентот CKFinder со CKEditor на страницата.

@using (Html.BeginForm ("Индекс", "Дома", FormMethod.Post)) ( ) document.addEventListener("DOMContentLoaded", функција (настан) ( var editor = CKEDITOR.replace ("content1"); CKFinder.setupCKEditor (уредник);));

Ако сите скрипти се правилно поврзани и конекторот е конфигуриран на страната на серверот, тогаш ќе пристапиме до датотечниот систем преку CKFinder од прелистувачот на корисникот.

Во зависност од поставките на конекторот во датотеката Web.config, можеме да ги промениме дозволите за манипулирање со датотеки и папки (создавање, преместување итн.).

Ве молиме имајте предвид дека ја разгледавме само основната конфигурација на CKFinder. Покрај ова, можете да додадете најавување, кеширање датотеки, разни приклучоци (на пример, додавање воден печат на преземените слики) итн. Повеќе за ова можете да прочитате во официјалната документација.