Najnovšie verzie CKEditor a CKFinder si môžete stiahnuť z oficiálnej webovej stránky (http://cksource.com).
Vložte vyššie uvedené dva zdroje do koreňového adresára webu: /CKEditor (tu vo verzii 3.6.2 musíte vložiť priečinok _Samples\ckeditor do komprimovaného priečinka) a /CKFinder (podľa veľkosti nerozlišujúce, môžete priečinok vložiť priamo sem). )
Všimnite si, že tu niekedy dôjde k chybe v generácii. Napríklad existujú duplicitné značky typu AssemblyTitle, hlavne preto, že webová stránka má viac AssemblyInfo.cs na vymazanie stiahnutého súboru. Alebo vymažte priečinok _source. Ak máte tu akékoľvek otázky, môžete ma kontaktovať: my QQ: 515072775
Použitie CKEditoru na stránke:
<textarea cols="80" id="prcontent" meno="content" riadky="50"> Ahoj, tvoje použitie bolo úspešné! </textarea>
<scrip odstrániť ttype="text/javascrip odstrániť t" >
CKEDITOR.replace('content', { height:200, width: 520 });
</scrip去掉t>. . .
CKEditor neobsahuje funkciu nahrávania, takže ho treba nahrať cez CKFinder
Krok 1: Webová stránka musí odkazovať na dll CKFinder (adresár: /CKFinder/bin/Release/CKFinder.dll)
Krok 2: Nakonfigurujte config.js CKEditora (adresár: /CKEditor/config.js) v funkcii CKEDITOR.editorConfig a zbytočné funkcie môžu byť odstránené
CKEDITOR.editorConfig = function(config) {
config.filebrowserBrowseUrl = 'ckfinder/ckfinder.html'; Nepíš "~/ckfinder/..." alebo "/ckfinder/..."
config.filebrowserImageBrowseUrl = 'ckfinder/ckfinder.html? Typ=Obrázky';
config.filebrowserFlashBrowseUrl = 'ckfinder/ckfinder.html? Type=Flash';
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'; Nastavenie veľkosti vyskakovacieho okna Browse Server
config.filebrowserWindowHeight = '500';
}
CKFinder.setupCKEditor(null, '.. /ckfinder/'); Všimnite si, že dráha CKFINDER zodpovedá skutočnému umiestneniu
Konfigurácia CKFinder:
Otvorte používateľskú kontrolu config.ascx pod "ckfinder\" a zmeňte jeho BaseUrl cestu:
BaseUrl = "~/ckfinder/userfiles/"; alebo BaseUrl = "ckfinder/userfiles/";
Tu je ešte jedna poznámka: je užitočné testovať v IIS. Inak, ak nahrávanie nebude úspešné, budete si myslieť, že niečo nie je v poriadku s konfiguráciou.
CKEditor má po dokončení konfigurácie funkciu nahrávania, ale čo ak je obrázok pôvodný názov obrázka a chce ho zmeniť na náhodný názov súboru? Potom sa pozrite na tretí krok.
Krok 3: Upravte zdrojový kód CKFinder. CKFinder má vlastný zdrojový kód, adresár: /CKFinde/_source
Vytvorte nový aktuálny projekt vo VS do CKFinde/_source/CKFinder.Net.sln, súbor riešenia stiahnutý tu sa nemusí otvoriť vo VS2008, môžete sa rozhodnúť pridať nový projekt alebo použiť novšiu verziu VS na jeho otvorenie.
1) Otvorte súbor /Settings/ConfigFile.cs
Nájdite 27 riadkov a pridajte atribút: public bool RandomReName; Náhodné premenovanie
Nájdite 67 riadkov a práve teraz priraďte hodnotu vlastnosti: RandomReName = true; Predvolená hodnota je pravdivá
Uložte uzavretý súbor
2) Otvorte súbor /Connector/Config.cs
Nájdite 62 riadkov, pridajte atribút:
verejný bool RandomReName
{
get { returnSettings.ConfigFile.Current.RandomReName; }
}
Uložte uzavretý súbor
3) Otvorte súbor /Connector/CommandHandlers/FileUploadCommandHandler.cs
Nájdite riadok 64 a pridajte kód rozsudku:
ak ( Config.Current.RandomReName) // Použite náhodný názov
sFileName =DateTime.Now.ToString("yyyyMMddHHmmssfff") + "." +sExtension;
Uložte uzavretý súbor
4) Znovu vygenerovať projekt, prepísať /ckfinder/_source/bin/Debug/CKFinder.dll /ckfinder/bin/Release/CKFinder.dll alebo odstrániť predtým pridané odkazy na webový projekt a znovu odstrániť dll z CKFinder.Net projektu
Posledný krok: Otvorte /ckfinder/config.ascx
Nájdite 40 riadkov a pridajte atribút: (V skutočnosti to môžete pridať alebo nie, pretože predtým bola nastavená predvolená hodnota, ale pri použití pôvodného názvu musí byť nastavená na nepravdivé)
//上传完毕后使用随机文件名
RandomReName = pravda;
Uložiť zatvorené
Dobre, teraz, keď bola konfigurácia úspešná, CKEditor môže mať funkciu nahrávania. Nastavenia iných funkcií sa budú ďalej študovať, keď budete mať čas~
Ešte jedna pripomienka: priečinky CKEditor a CKFinder obsahujú veľa zbytočných vecí, napríklad názvy s podčiarknutiami, .net projekty nepotrebujú php, asp.
Ak dôjde k chybe pri nahrávaní súboru: Súbor nie je možné zobraziť z bezpečnostných dôvodov. Prosím, kontaktujte svojho správcu systému a skontrolujte profil CKFinder.
Musíte upraviť súbor config.ascx
public override bool CheckAuthentication()
{
retúra falošná;
}
Upravené na:
public override bool CheckAuthentication()
{
Validácia formulára
returnRequest.IsAuthenticated;
}
3. Aplikovať kontrolu CKEditora na stránke [dve metódy, a a b]
[A: Citujem INSTALL.html v komprimovanom balíku]
Ak chcete integrovať CKEditor do svojej ASP.NET stránky, postupujte podľa krokov uvedených nižšie.
1. Prejdite na oficiálnu stránku na stiahnutie CKEditoru a stiahnite si najnovšie verzie CKEditor 3.x aj CKEditor pre ASP.NET Control.
2. Rozbaľte oba inštalačné balíky na požadovanú lokalitu Remove n.
3. Pridať odkaz na CKEditor pre ASP.NET Control na vašej webovej stránke.
Vo Visual Studio použite príkaz Add Reference a prejdite do súboru bin\Release\CKEditor.NET.dll z rozbaleného CKEditoru pre ASP.NET inštalačný balík. DLL súbor môžete tiež manuálne skopírovať do priečinka bin vo vašej aplikácii.
4. Skopírujte rozbalené editorové súbory z inštalačného balíka CKEditor 3.x a vložte ich do adresára aplikácií na vašej webovej stránke.
5. Zaregistrujte CKEditora na ASP.NET Control na vašej stránke:
<%@ Register Assembly="CKEditor.NET" Namespace="CKEditor.NET" TagPrefix="CKEditor" %>
6. Vložte inštanciu CKEditora do tela stránky:
<CKEditor:CKEditorControl ID="CKEditor1" runat="server"></CKEditor:CKEditorControl>
【b】
1. <head>Pridajte príslušný js odkaz na stránku:
<scrip odstrániť t typ="text/javascrip odstrániť t" jazyk="javascrip odstrániť t" src="ckfinder/ckfinder.js"></scrip去掉t>
<scrip odstrániť t typ="text/javascrip odstrániť t" jazyk="javascrip odstrániť t" src="ckeditor/ckeditor.js"></scrip去掉t>
2. Potom <body>pridajte nasledujúci kód na miesto, kde je potrebné ovládacie prvky umiestniť, a existujú nasledujúce spôsoby použitia:
(1) Pridať špecifikovaný atribút triedy do riadiaceho prvku
<textarea id="textarea1" meno="editor1" class="ckeditor">ahoj!</textarea>
Ovládanie servera:
<asp:TextBox ID="TextBox1" runat="server" TextMode="MultiLine" CssClass="ckeditor"></asp:TextBox>
(2) Injektujte js kód – tu je js kód najlepšie napísaný za kontrolou alebo <head>v nej
<textarea id="textarea1" meno="editor1">ahoj!</textarea>
<scrip odstrániť t typ="text/javascrip odstrániť t" >
CKEDITOR.replace('editor1', { height:400, width:800 });
</scrip去掉t>. . .
Ovládanie servera:
<asp:TextBox ID="mckeditor" runat="server" TextMode="MultiLine"></asp:TextBox>
<scrip odstrániť t typ="text/javascrip odstrániť t" >
CKEDITOR.replace('<%=mckeditor. ClientID %>');
</scrip去掉t>. . .
=============================================================================================================
Druhá referencia:
asp.net konfiguračnú metódu CKEDITOR 3.0.1 a ckfinder_aspnet_1.4.1.1
Podľa pokynov http://ckeditor.com.cn/docs/ je CKEditor nastavený na webovej stránke a pri zobrazení v prehliadači mám pocit, že rozhranie CKEditoru je naozaj veľmi krásne, ale keď som rád chcel vyskúšať funkciu nahrávania obrázka, nevidel som tlačidlo na nahranie obrázka.
Pri pokračovaní v hľadaní online som dospel k záveru, že "CKEditor sám nemá funkciu nahrávania a musí byť integrovaný s CKFinderom, aby sa dosiahla funkcia nahrávania".
Potom si stiahnite CKFinder 1.4.1.1 pre Asp.net, rozbalte ho a vložte priečinok ckfinder do koreňového adresára projektu – pretože mnohé zdroje na internete tvrdia, že je najlepšie umiestniť CKEditor a CKFinder do rovnakého adresára úrovne. A takto budeme mať v projekte ďalšie dva priečinky bez dôvodu. Sám mám podľa mňa posadnutosť na čistotu kódov,
Nechajte zložku ako prejav úcty k autorovi, to bude stačiť. Mať dve by mi bolo veľmi nepríjemné.
Predtým, než integrujeme CKFinder do CKEditoru, musíme ho tiež trochu nakonfigurovať. Múdri priatelia by si mali ľahko myslieť, že keďže ide o plugin na nahrávanie súborov, väčšina vecí, ktoré treba nakonfigurovať, je cesta na nahrávanie súborov.
Predvolená cesta k nahrávaniu CKFinder je priečinok userfiles vo vlastnom adresári, ale CKFinder som dal do priečinka CKEditor, ak uložím obrázok do používateľských súborov, systém musí obísť trojvrstvový priečinok, aby našiel súbor alebo obrázok, takže plánujem nahrať obrázok do priečinka upFile v koreňovom adresári projektu.
Na implementáciu tejto funkcie je potrebné upraviť súbor config.ascx pod CKFinder tak, aby zmenil BaseUrl = "/ckfinder/userfiles/" na BaseUrl = "~/upFile/". Potom vystrihnite CKFinder.dll súbory z priečinka CKFinder/bin do priečinka bin systémového projektu. Alebo CKFinder.dll do projektu zaviesť pridaním referencií.
Ďalej môžeme použiť CKEditor na nahrávanie súborov:
Vložte priečinok CKFinder do priečinka CKEditor a na stránke importujte js súbory oboch:
<scrip odstrániť tsrc="http://www.cnblogs.com/ckeditor/ckeditor.js" typ="text/javascrip odstrániť t"></scrip去掉t>
<scrip remove t src="http://www.cnblogs.com/ckeditor/ckfinder/ckfinder.js" type="text/javascrip remove t"></scrip去掉t>
Existujú dva spôsoby, ako odkazovať editor na kontrolu:
Jedným z nich je použitie textovej oblasti riadenia klienta:
<textarea rows="20" cols="40" meno="txtContent" id="txtContent"></textarea>
<scrip odstrániť t typ="text/javascrip odstrániť t" >
var editor = CKEDITOR.replace('txtContent');
CKFinder.SetupCKEditor(editor, 'http://www.cnblogs.com/ckeditor/ckfinder/');
</scrip去掉t>. . .
Druhým je použitie serverového ovládacieho textového poľa:
<asp:TextBox id="txtContent" TextMode="MultiLine" Text='<%# Bind("info") %>' runat="server"></asp:TextBox>
<scrip odstrániť t typ="text/javascrip odstrániť t" >
var editor = CKEDITOR.replace('txtContent');
CKFinder.SetupCKEditor(editor, 'http://www.cnblogs.com/ckeditor/ckfinder/');
</scrip去掉t>Osobne si myslím, že keďže ide o asp.net program, tak použiť ovládanie na strane servera. Aj keď to beží o niečo pomalšie ako ovládanie klienta, vývoj je o niečo rýchlejší. A ako programátori vždy radi vyskúšame všetky možnosti, než si vyberieme tú, ktorá sa nám páči.
V skutočnosti môžete ovládaču priradiť hodnoty aj bez použitia Text='<%# Bind("info") %>', a použiť ho priamo v backcode
this.txtContent.Text="Počiatočná hodnota"
Je to tiež možné. Na získanie hodnoty môžete použiť aj priamo nasledujúci kód:
CKFinder a CKEditor kód. Keď stránku spustím priamo s editorom, kompilátor zobrazí nasledujúcu chybu:
string content=this.txtContent.Text
Poznámka: Atribút TextMode="MultiLine" je nevyhnutný, inak bude hodnota nulová.
Nezjednodušil som program pred ladením
Názov typu alebo menného priestoru "ControlDesigner" neexistuje v mennom priestore "System.Web.UI.Design" (chýba mu referencia na assembler?)
Chyba je na riadku 19 v ckeditor\ckfinder\_source\FileBrowserDesigner.cs, takže jednoducho zjednodušte súbor:
Prvým krokom je zjednodušiť CKEDITOR: vymazať priečinky _samples a _source a v adresári lang môžu zostať len tri jazykové súbory: en.js, zh.js a zh-cn.js;
Druhým krokom je zjednodušiť ckfinder: vymazať priečinky _samples a _source a v adresári lang ponechať len jazykové súbory en.js, zh.js a zh-cn.js.
Všimnite si druhý riadok js kódu tu: CKFinder.SetupCKEditor(editor, 'http://www.cnblogs.com/ckeditor/ckfinder/'); , kde "http://www.cnblogs.com/ckeditor/ckfinder/" je relatívna cesta ckfinderu k aktuálnej stránke,
Prosím, nekopírovajte a nevkladajte kód priamo, inak sa pri nahrávaní obrázkov môže objaviť nasledujúca chyba:
Popis: HTTP 404. Zdroj, ktorý hľadáte (alebo niektorá z jeho závislostí), mohol byť odstránený, alebo sa zmenil jeho názov, alebo je dočasne nedostupný. Prosím, skontrolujte nasledujúcu URL adresu a uistite sa, že je správne napísaná.
Požadovaná URL: /admin/ckeditor/ckfinder/core/connector/aspx/connector.aspx
Takže ak nechceš dať ckfinder do priečinka ckeditor, ako som to urobil ja, je to v poriadku, pokiaľ tu správne vyplníš zmeny cesty.
Myslel som si, že to bude považované za všetku prácu, ale keď som nahral obrázok, objavil sa nasledujúci prompt:
Z bezpečnostných dôvodov nie je možné súbor prezerať. Prosím, kontaktujte svojho správcu systému a skontrolujte profil CKFinder.
Ako sa hovorí, nie je možné, že dobré veci sa ťažko jedia. Môžem sa opýtať len najlepšieho učiteľa - Baidu. Skopíroval som vyššie uvedené informácie do vyhľadávacieho poľa Baidu a po vstupe do auta som našiel príspevok o integrácii PHP v ckeditore. Tu je návod, ako na to:
Upravte súbor config.ascx pod CKFinder tak, aby ste zmenili návratovú hodnotu funkcie CheckAuthentication() z return false na return true.
Otestoval som znova, obrázok sa úspešne nahral! |
Zverejnené 18. 4. 2015 19:11:55
|
|
|
