De nyeste versioner af CKEditor og CKFinder kan downloades fra den officielle hjemmeside (http://cksource.com).
Læg ovenstående to ressourcer i rodmappen på hjemmesiden: /CKEditor (her i version 3.6.2 skal du lægge mappen _Samples\ckeditor i den komprimerede mappe) og /CKFinder (kasus-sensitiv, du kan lægge mappen direkte her). )
Bemærk, at der nogle gange er en fejl i genereringen. For eksempel findes der dubletter af AssemblyTitle-typen, hovedsageligt fordi hjemmesiden har mere end én AssemblyInfo.cs til at slette den downloadede fil. Eller slette mappen _source. Hvis du har spørgsmål her, kan du kontakte mig: min QQ: 515072775
Brug af CKEditor på en side:
<textarea cols="80" id="prcontent" name="content" rows="50"> Hej, din brug var succesfuld! </textarea>
<scrip remove ttype="text/javascrip remove t" >
CKEDITOR.replace('content', { height:200, width: 520 });
. .</scrip去掉t>
CKEditor leveres ikke med en uploadfunktion, så den skal uploades med CKFinder
Trin 1: Hjemmesiden skal referere til dll'en for CKFinder (katalog: /CKFinder/bin/Release/CKFinder.dll)
Trin 2: Konfigurér CKEditorens config.js (mappe: /CKEditor/config.js) i funktionen CKEDITOR.editorConfig, og unødvendige funktioner kan fjernes
CKEDITOR.editorConfig = function(config) { config.filebrowserBrowseUrl = 'ckfinder/ckfinder.html'; Skriv ikke "~/ckfinder/..." eller "/ckfinder/..." config.filebrowserImageBrowseUrl = 'ckfinder/ckfinder.html? type=billeder'; 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'; Størrelsesindstillingen for Browse Server pop-up'en config.filebrowserWindowHeight = '500';
} CKFinder.setupCKEditor(null, '.. /ckfinder/'); Bemærk, at ckfinderens bane svarer til den faktiske placering
CKFinders konfiguration:
Åbn brugerkontrollen config.ascx under "ckfinder\" og ændr dens BaseUrl-sti:
BaseUrl = "~/ckfinder/userfiles/"; eller BaseUrl = "ckfinder/userfiles/";
Her er et ekstra punkt: det er nyttigt at teste i IIS. Ellers, hvis uploaden mislykkes, vil du tro, at der er noget galt med konfigurationen.
CKEditor har en uploadfunktion efter konfigurationen er færdig, men hvad hvis billedfilen er det oprindelige billednavn og vil ændre det til et tilfældigt filnavn? Så ser du på det tredje trin.
Trin 3: Ændr kildekoden til CKFinder. CKFinder leveres med sin egen kildekode, mappe: /CKFinde/_source
Opret et nyt aktuelt projekt i VS til CKFinde/_source/CKFinder.Net.sln, løsningsfilen downloadet her åbner måske ikke i VS2008, du kan vælge at tilføje et nyt projekt eller bruge en nyere version af VS til at åbne det.
1) Åbn filen /Settings/ConfigFile.cs
Find 27 rækker og tilføj en attribut: public bool RandomReName; Omdøb tilfældigt
Find 67 rækker og tildel en værdi til egenskaben lige nu: RandomReName = true; Standardværdien er sand
Gem den lukkede fil
2) Åbn filen /Connector/Config.cs
Find de 62 rækker, tilføj en attribut:
offentlig bool RandomReName
{
get { returnSettings.ConfigFile.Current.RandomReName; }
}
Gem den lukkede fil
3) Åbn filen /Connector/CommandHandlers/FileUploadCommandHandler.cs
Find linje 64 og tilføj en domskode:
hvis ( Config.Current.RandomReName) // Brug et tilfældigt navn
sFilnavn =DateTime.Now.ToString("yyyyMMddHHmmssfff") + "." +sExtension;
Gem den lukkede fil 4) Gengenerere projektet, overskrive /ckfinder/_source/bin/Debug/CKFinder.dll /ckfinder/bin/Release/CKFinder.dll eller fjerne de tidligere tilføjede referencer til websiteprojektet og fjerne dll'en fra CKFinder.Net-projektet igen Sidste trin: Åbn /ckfinder/config.ascx Find 40 linjer og tilføj en attribut: (Faktisk kan du tilføje dette eller lade være, fordi der var en standardværdi sat før, men den skal sættes til falsk, når man bruger det oprindelige navn)
//上传完毕后使用随机文件名
RandomReName = sand;
Gem lukket
Okay, nu hvor konfigurationen er lykkedes, kan CKEditor have en uploadfunktion. Indstillingerne for andre funktioner vil fortsat blive studeret, når du har tid~
En påmindelse mere: CKEditor og CKFinder-mapper har mange unødvendige ting, såsom navne med understrøg, .net-projekter behøver ikke php, asp.
Hvis der opstår en fejl ved upload af en fil: Filen kan ikke vises af sikkerhedsmæssige årsager. Kontakt venligst din systemadministrator og tjek CKFinder-profilen.
Du skal ændre config.ascx-filen
public override bool CheckAuthentication()
{ reture false;
} Modificeret til:
public override bool CheckAuthentication()
{
Formvalidering returnRequest.IsAuthenticated;
}
3. Påfør CKEditor-kontrol på siden [to metoder, a og b]
[A: Citerer INSTALL.html i den komprimerede pakke ]
Hvis du vil integrere CKEditor med din ASP.NET-side, så følg trinnene nedenfor.
1. Gå til den officielle CKEditor downloadside og download de nyeste versioner af både CKEditor 3.x og CKEditor for ASP.NET Control. 2. Pak begge installationspakker ud til et ønsket sted Fjern n. 3. Tilføj en reference til CKEditor for ASP.NET Control på din hjemmeside. I Visual Studio brug Add Reference-kommandoen og gennemse bin\Release CKEditor.NET.dll\-filen fra den udpakkede CKEditor for ASP.NET installationspakke. Du kan også manuelt kopiere DLL-filen til bin-mappen i dit program. 4. Kopier de unpakkede editorfiler fra CKEditor 3.x installationspakken og indsæt dem i applikationsmappen på din hjemmeside. 5. Registrer CKEditor for ASP.NET Control på din side: <%@ Register Assembly="CKEditor.NET" Namespace="CKEditor.NET" TagPrefix="CKEditor" %> 6. Indsæt en CKEditor-instans i sideteksten: <CKEditor:CKEditorControl ID="CKEditor1" runat="server"></CKEditor:CKEditorControl> 【b】
1. <head>Tilføj den tilsvarende js-reference til siden:
<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>Tilføj derefter følgende kode til det sted, hvor kontrollen skal placeres, og der er følgende anvendelsesmetoder:
(1) Tilføj den specificerede klasseattribut til kontrollen <TextArea id="Textarea1" Name="Editor1" klasse="CkEditor">Hej!</textarea> Serverkontroller: <asp:TextBox ID="TextBox1" runat="server" TextMode="MultiLine" CssClass="ckeditor"></asp:TextBox>
(2) Indjicere js-kode – her skrives js-koden bedst efter kontrollen, eller <head>i den <textarea id="textarea1" name="editor1">hej!</textarea> <scrip remove t type="text/javascrip remove t" > CKEDITOR.replace('editor1', { height:400, width:800 }); . .</scrip去掉t> Serverkontroller: <asp:TextBox ID="mckeditor" runat="server" TextMode="MultiLine"></asp:TextBox> <scrip remove t type="text/javascrip remove t" > CKEDITOR.replace('<%=mckeditor. ClientID %>'); . .</scrip去掉t> ============================================================================================================= Anden reference: asp.net konfigurationsmetoden for ckeditor 3.0.1 og ckfinder_aspnet_1.4.1.1 Ifølge http://ckeditor.com.cn/docs/'s prompts er CKEditor konfigureret på websiden, og når den vises i browseren, synes jeg, at CKEditor's brugerflade virkelig er meget smuk, men da jeg gladeligt ville prøve billedupload-funktionen, så jeg ikke knappen til at uploade billedet.
Ved fortsat søgning online konkluderede man, at "CKEditor har ikke selv en uploadfunktion, og den skal integreres med CKFinder for at opnå uploadfunktionen". Download derefter CKFinder 1.4.1.1 til Asp.net, pak den ud og læg ckfinder-mappen i projektets rodmappe – fordi mange kilder på internettet siger, at det er bedst at placere CKEditor og CKFinder i samme niveaumappe. Og på den måde vil vi have to mapper mere i vores projekt uden grund. Jeg har selv en kode-renlighedsfetich, tror jeg, Efterlad en mappe som et tegn på respekt for forfatteren, det er nok. At beholde to ville gøre mig meget utilpas.
Før vi integrerer CKFinder i CKEditor, skal vi også konfigurere CKFinder lidt. Kloge venner burde nemt tænke, at da det er et plug-in til upload af filer, er det meste af det, der skal konfigureres, stien til upload af filer.
Standard uploadstien for CKFinder er userfiles-mappen i sin egen mappe, men jeg har lagt CKFinder i CKEditor-mappen; hvis jeg gemmer billedet i userfiles, skal systemet omgå tre-lags mappen for at finde filen eller billedet, så jeg planlægger at uploade billedet til upFile-mappen i projektets rodmappe. For at implementere denne funktion skal du ændre config.ascx-filen under CKFinder for at ændre BaseUrl = "/ckfinder/userfiles/" til BaseUrl = "~/upFile/". Derefter skærer du CKFinder.dll-filerne fra CKFinder/bin-mappen over i bin-mappen i systemprojektet. Eller introducere CKFinder.dll i projektet ved at tilføje referencer. Dernæst kan vi bruge CKEditor til filupload:
Læg CKFinder-mappen i CKEditor-mappen, og importer js-filerne fra begge:
<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> Der er to måder at referere editoren til en kontrol:
En er at bruge klientkontroltekstområdet:
<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 (redaktør, 'http://www.cnblogs.com/ckeditor/ckfinder/');
. .</scrip去掉t>
Den anden er at bruge serverside-kontroltekstboksen:
<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 (redaktør, 'http://www.cnblogs.com/ckeditor/ckfinder/');
Personligt synes</scrip去掉t> jeg, at da det er et asp.net program, så brug server-side kontrollerne. Selvom det kører lidt langsommere end klientkontroller, går udviklingen lidt hurtigere. Og som programmører kan vi altid godt lide at prøve alle muligheder, før vi vælger den, vi kan lide.
Faktisk kan du også tildele værdier til kontrollen uden at bruge Text='<%# Bind("info") %>', og bruge det direkte i backcode.
this.txtContent.Text="Startværdi" Det er også muligt. Du kan også bruge følgende kode direkte for at få værdien:
CKFinder og CKEditor-kode. Når jeg kører siden direkte med editoren, giver compileren følgende fejl:
streng content=this.txtContent.Text Bemærk: TextMode="MultiLine"-attributten er essentiel, ellers vil værdien være null.
Jeg strømlinede ikke, før jeg fejlede programmet
Type- eller navnerumsnavnet "ControlDesigner" findes ikke i navnerummet "System.Web.UI.Design" (mangler det assembly-reference?)
Fejlen er på linje 19 i ckeditor\ckfinder\_source\FileBrowserDesigner.cs, så forenkle filen simpelthen:
Det første skridt er at strømline ckeditoren: slet mapperne _samples og _source, og kun tre sprogfiler kan bevares i lang-mappen: en.js, zh.js og zh-cn.js;
Det andet skridt er at strømline ckfinder: slet mapperne _samples og _source, og behold kun filerne en.js, zh.js og zh-cn.js sproget i lang-mappen.
Bemærk den anden linje i js-koden her: CKFinder.SetupCKEditor (editor, 'http://www.cnblogs.com/ckeditor/ckfinder/'); , hvor "http://www.cnblogs.com/ckeditor/ckfinder/" er den relative sti for ckfinder til den aktuelle side, Venligst kopier og indsæt ikke koden direkte, ellers kan følgende fejl opstå ved upload af billeder:
Beskrivelse: HTTP 404. Den ressource, du leder efter (eller en af dens afhængigheder), kan være blevet fjernet, eller dens navn er ændret, eller den er midlertidigt utilgængelig. Tjek venligst den følgende URL og sørg for, at den er stavet korrekt.
Anmandet URL: /admin/ckeditor/ckfinder/core/connector/aspx/connector.aspx
Så hvis du ikke vil lægge ckfinder i ckeditor-mappen som jeg gjorde, er det okay, så længe du udfylder stiændringerne korrekt her.
Jeg troede, det ville blive betragtet som alt arbejdet, men da jeg uploadede billedet, dukkede følgende prompt op:
Af sikkerhedsmæssige årsager kan filen ikke vises. Kontakt venligst din systemadministrator og tjek CKFinder-profilen.
Der er ingen måde, som ordsproget siger, gode ting er svære at spise. Jeg kan kun spørge den bedste lærer - Baidu. Kopier ovenstående promptinformation til Baidu-søgefeltet, og efter at have indtastet bilen, fandt jeg et opslag om PHP-integration ckeditor. Sådan gør du:
Ændr config.ascx-filen under CKFinder for at ændre returværdien for den offentlige override bool CheckAuthentication()-funktion fra return false til return true.
Testet igen, billedet blev uploadet med succes! |