FCKEditor与rails的集成

￡神魔★判官ぃ 2021-10-24 03:58 251阅读 0赞

1.下载[fckeditor\_plugin-0.3.2.zip][fckeditor_plugin-0.3.2.zip]，目前版本为0.3.2  
2.解压到vendor\\plugins目录下，并且重新命名为fckeditor  
3.到该应用程序根目录下，然后运行rake fckeditor:install，则执行自动安装  
4.在自己的view层中添加  
<%= javascript\_include\_tag :fckeditor %>  
以及在你需要编辑的字段textarea替换为  
<%= fckeditor\_textarea("book", "desc", \{ :toolbarKit => 'Simple', :width => '100%', :height => '200px' \}) %>  
第一个参数为你的domain对象，desc为你的编辑字段值，其他顾名思义  
然后运行你的页面程序，发现simple upload有点bug，上传后javascript报错  
5.追踪代码发现  
vendor\\plugins\\fckeditor\\app\\controllers\\fckeditor\_controller.rb下的

调用了upload\_file方法

![FCKEditor与rails的集成（FCK上传图片出现js错误的问题） - Rui - 午后的阳光][FCKEditor_rails_FCK_js_ - Rui -] def upload\_file  
![FCKEditor与rails的集成（FCK上传图片出现js错误的问题） - Rui - 午后的阳光][FCKEditor_rails_FCK_js_ - Rui -]    @new\_file  =  params\[:NewFile\]  
![FCKEditor与rails的集成（FCK上传图片出现js错误的问题） - Rui - 午后的阳光][FCKEditor_rails_FCK_js_ - Rui -]    @url  =  upload\_directory\_path  
![FCKEditor与rails的集成（FCK上传图片出现js错误的问题） - Rui - 午后的阳光][FCKEditor_rails_FCK_js_ - Rui -]    begin  
![FCKEditor与rails的集成（FCK上传图片出现js错误的问题） - Rui - 午后的阳光][FCKEditor_rails_FCK_js_ - Rui -]      ftype  =  @new\_file.content\_type.strip  
![FCKEditor与rails的集成（FCK上传图片出现js错误的问题） - Rui - 午后的阳光][FCKEditor_rails_FCK_js_ - Rui -]       if   !  MIME\_TYPES.include ? (ftype)  
![FCKEditor与rails的集成（FCK上传图片出现js错误的问题） - Rui - 午后的阳光][FCKEditor_rails_FCK_js_ - Rui -]        @errorNumber  =   202   
![FCKEditor与rails的集成（FCK上传图片出现js错误的问题） - Rui - 午后的阳光][FCKEditor_rails_FCK_js_ - Rui -]        puts  " \#\{ftype\} is invalid MIME type "   
![FCKEditor与rails的集成（FCK上传图片出现js错误的问题） - Rui - 午后的阳光][FCKEditor_rails_FCK_js_ - Rui -]        raise  " \#\{ftype\} is invalid MIME type "   
![FCKEditor与rails的集成（FCK上传图片出现js错误的问题） - Rui - 午后的阳光][FCKEditor_rails_FCK_js_ - Rui -]       else   
![FCKEditor与rails的集成（FCK上传图片出现js错误的问题） - Rui - 午后的阳光][FCKEditor_rails_FCK_js_ - Rui -]        path  =  current\_directory\_path  \+   " / "   \+  @new\_file.original\_filename  
![FCKEditor与rails的集成（FCK上传图片出现js错误的问题） - Rui - 午后的阳光][FCKEditor_rails_FCK_js_ - Rui -]        File.open(path, " wb " , 0664 )  do   | fp |   
![FCKEditor与rails的集成（FCK上传图片出现js错误的问题） - Rui - 午后的阳光][FCKEditor_rails_FCK_js_ - Rui -]          FileUtils.copy\_stream(@new\_file, fp)  
![FCKEditor与rails的集成（FCK上传图片出现js错误的问题） - Rui - 午后的阳光][FCKEditor_rails_FCK_js_ - Rui -]        end  
![FCKEditor与rails的集成（FCK上传图片出现js错误的问题） - Rui - 午后的阳光][FCKEditor_rails_FCK_js_ - Rui -]        @errorNumber  =   0   
![FCKEditor与rails的集成（FCK上传图片出现js错误的问题） - Rui - 午后的阳光][FCKEditor_rails_FCK_js_ - Rui -]      end  
![FCKEditor与rails的集成（FCK上传图片出现js错误的问题） - Rui - 午后的阳光][FCKEditor_rails_FCK_js_ - Rui -]    rescue  =>  e  
![FCKEditor与rails的集成（FCK上传图片出现js错误的问题） - Rui - 午后的阳光][FCKEditor_rails_FCK_js_ - Rui -]      @errorNumber  =   110   if  @errorNumber.nil ?   
![FCKEditor与rails的集成（FCK上传图片出现js错误的问题） - Rui - 午后的阳光][FCKEditor_rails_FCK_js_ - Rui -]    end  
![FCKEditor与rails的集成（FCK上传图片出现js错误的问题） - Rui - 午后的阳光][FCKEditor_rails_FCK_js_ - Rui -]      
![FCKEditor与rails的集成（FCK上传图片出现js错误的问题） - Rui - 午后的阳光][FCKEditor_rails_FCK_js_ - Rui -]    \# Fix provided by Nicola Piccinini  \--  http: // superfluo.org   
![FCKEditor与rails的集成（FCK上传图片出现js错误的问题） - Rui - 午后的阳光][FCKEditor_rails_FCK_js_ - Rui -]     render :text  =>   % Q ' <script>window.parent.frames\[\\ ' frmUpload\\ ' \].OnUploadCompleted(\#\{@errorNumber\});</script> '   
![FCKEditor与rails的集成（FCK上传图片出现js错误的问题） - Rui - 午后的阳光][FCKEditor_rails_FCK_js_ - Rui - 1]    \#render :inline  =>   ' page << "window.parent.frames\[\\ ' frmUpload\\ ' \].OnUploadCompleted(\#\{@errorNumber\}, \\ ' \# \{@new\_file\} \\ ' );" ' , :type  =>  :rjs  
![FCKEditor与rails的集成（FCK上传图片出现js错误的问题） - Rui - 午后的阳光][FCKEditor_rails_FCK_js_ - Rui -]  end

中的

![FCKEditor与rails的集成（FCK上传图片出现js错误的问题） - Rui - 午后的阳光][FCKEditor_rails_FCK_js_ - Rui -] render :text  =>   % Q ' <script>window.parent.frames\[\\ ' frmUpload\\ ' \].OnUploadCompleted(\#\{@errorNumber\});</script> '

在浏览服务器时是正常的，但是在快速上传中不应该返回这个script语句  
则修改upload方法

![FCKEditor与rails的集成（FCK上传图片出现js错误的问题） - Rui - 午后的阳光][FCKEditor_rails_FCK_js_ - Rui -] def upload  
![FCKEditor与rails的集成（FCK上传图片出现js错误的问题） - Rui - 午后的阳光][FCKEditor_rails_FCK_js_ - Rui -]    @new\_file  =  params\[:NewFile\]  
![FCKEditor与rails的集成（FCK上传图片出现js错误的问题） - Rui - 午后的阳光][FCKEditor_rails_FCK_js_ - Rui -]    @url  =  upload\_directory\_path  
![FCKEditor与rails的集成（FCK上传图片出现js错误的问题） - Rui - 午后的阳光][FCKEditor_rails_FCK_js_ - Rui -]    begin  
![FCKEditor与rails的集成（FCK上传图片出现js错误的问题） - Rui - 午后的阳光][FCKEditor_rails_FCK_js_ - Rui -]      ftype  =  @new\_file.content\_type.strip  
![FCKEditor与rails的集成（FCK上传图片出现js错误的问题） - Rui - 午后的阳光][FCKEditor_rails_FCK_js_ - Rui -]       if   !  MIME\_TYPES.include ? (ftype)  
![FCKEditor与rails的集成（FCK上传图片出现js错误的问题） - Rui - 午后的阳光][FCKEditor_rails_FCK_js_ - Rui -]        @errorNumber  =   202   
![FCKEditor与rails的集成（FCK上传图片出现js错误的问题） - Rui - 午后的阳光][FCKEditor_rails_FCK_js_ - Rui -]        puts  " \#\{ftype\} is invalid MIME type "   
![FCKEditor与rails的集成（FCK上传图片出现js错误的问题） - Rui - 午后的阳光][FCKEditor_rails_FCK_js_ - Rui -]        raise  " \#\{ftype\} is invalid MIME type "   
![FCKEditor与rails的集成（FCK上传图片出现js错误的问题） - Rui - 午后的阳光][FCKEditor_rails_FCK_js_ - Rui -]       else   
![FCKEditor与rails的集成（FCK上传图片出现js错误的问题） - Rui - 午后的阳光][FCKEditor_rails_FCK_js_ - Rui -]        path  =  current\_directory\_path  \+   " / "   \+  @new\_file.original\_filename  
![FCKEditor与rails的集成（FCK上传图片出现js错误的问题） - Rui - 午后的阳光][FCKEditor_rails_FCK_js_ - Rui -]        File.open(path, " wb " , 0664 )  do   | fp |   
![FCKEditor与rails的集成（FCK上传图片出现js错误的问题） - Rui - 午后的阳光][FCKEditor_rails_FCK_js_ - Rui -]          FileUtils.copy\_stream(@new\_file, fp)  
![FCKEditor与rails的集成（FCK上传图片出现js错误的问题） - Rui - 午后的阳光][FCKEditor_rails_FCK_js_ - Rui -]        end  
![FCKEditor与rails的集成（FCK上传图片出现js错误的问题） - Rui - 午后的阳光][FCKEditor_rails_FCK_js_ - Rui -]        @errorNumber  =   0   
![FCKEditor与rails的集成（FCK上传图片出现js错误的问题） - Rui - 午后的阳光][FCKEditor_rails_FCK_js_ - Rui -]      end  
![FCKEditor与rails的集成（FCK上传图片出现js错误的问题） - Rui - 午后的阳光][FCKEditor_rails_FCK_js_ - Rui -]    rescue  =>  e  
![FCKEditor与rails的集成（FCK上传图片出现js错误的问题） - Rui - 午后的阳光][FCKEditor_rails_FCK_js_ - Rui -]      @errorNumber  =   110   if  @errorNumber.nil ?   
![FCKEditor与rails的集成（FCK上传图片出现js错误的问题） - Rui - 午后的阳光][FCKEditor_rails_FCK_js_ - Rui -]    end  
![FCKEditor与rails的集成（FCK上传图片出现js错误的问题） - Rui - 午后的阳光][FCKEditor_rails_FCK_js_ - Rui -]      
![FCKEditor与rails的集成（FCK上传图片出现js错误的问题） - Rui - 午后的阳光][FCKEditor_rails_FCK_js_ - Rui -]    \# Fix provided by Nicola Piccinini  \--  http: // superfluo.org   
![FCKEditor与rails的集成（FCK上传图片出现js错误的问题） - Rui - 午后的阳光][FCKEditor_rails_FCK_js_ - Rui -]     render :text  =>   % Q ' <script>window.parent.OnUploadCompleted(\#\{@errorNumber\},\\"\#\{UPLOADED\}/\#\{params\[:Type\]\}\\",\\"\#\{@new\_file.original\_filename\}\\",\\"\\");</script> '   
![FCKEditor与rails的集成（FCK上传图片出现js错误的问题） - Rui - 午后的阳光][FCKEditor_rails_FCK_js_ - Rui -]  end

快速上传问题修复  
  
6.发现文件夹里边如果上传图片过多不好备份，故采用/年/月方式保存  
修改代码如下：

![FCKEditor与rails的集成（FCK上传图片出现js错误的问题） - Rui - 午后的阳光][FCKEditor_rails_FCK_js_ - Rui -]    def upload  
![FCKEditor与rails的集成（FCK上传图片出现js错误的问题） - Rui - 午后的阳光][FCKEditor_rails_FCK_js_ - Rui -]    @new\_file  =  params\[:NewFile\]  
![FCKEditor与rails的集成（FCK上传图片出现js错误的问题） - Rui - 午后的阳光][FCKEditor_rails_FCK_js_ - Rui -]    @url  =  upload\_directory\_path  
![FCKEditor与rails的集成（FCK上传图片出现js错误的问题） - Rui - 午后的阳光][FCKEditor_rails_FCK_js_ - Rui -]    begin  
![FCKEditor与rails的集成（FCK上传图片出现js错误的问题） - Rui - 午后的阳光][FCKEditor_rails_FCK_js_ - Rui -]      ftype  =  @new\_file.content\_type.strip  
![FCKEditor与rails的集成（FCK上传图片出现js错误的问题） - Rui - 午后的阳光][FCKEditor_rails_FCK_js_ - Rui -]       if   !  MIME\_TYPES.include ? (ftype)  
![FCKEditor与rails的集成（FCK上传图片出现js错误的问题） - Rui - 午后的阳光][FCKEditor_rails_FCK_js_ - Rui -]        @errorNumber  =   202   
![FCKEditor与rails的集成（FCK上传图片出现js错误的问题） - Rui - 午后的阳光][FCKEditor_rails_FCK_js_ - Rui -]        puts  " \#\{ftype\} is invalid MIME type "   
![FCKEditor与rails的集成（FCK上传图片出现js错误的问题） - Rui - 午后的阳光][FCKEditor_rails_FCK_js_ - Rui -]        raise  " \#\{ftype\} is invalid MIME type "   
![FCKEditor与rails的集成（FCK上传图片出现js错误的问题） - Rui - 午后的阳光][FCKEditor_rails_FCK_js_ - Rui -]       else   
![FCKEditor与rails的集成（FCK上传图片出现js错误的问题） - Rui - 午后的阳光][FCKEditor_rails_FCK_js_ - Rui -]        path  =  date\_directory\_path  \+   " / "   \+  @new\_file.original\_filename  
![FCKEditor与rails的集成（FCK上传图片出现js错误的问题） - Rui - 午后的阳光][FCKEditor_rails_FCK_js_ - Rui -]        File.open(path, " wb " , 0664 )  do   | fp |   
![FCKEditor与rails的集成（FCK上传图片出现js错误的问题） - Rui - 午后的阳光][FCKEditor_rails_FCK_js_ - Rui -]          FileUtils.copy\_stream(@new\_file, fp)  
![FCKEditor与rails的集成（FCK上传图片出现js错误的问题） - Rui - 午后的阳光][FCKEditor_rails_FCK_js_ - Rui -]        end  
![FCKEditor与rails的集成（FCK上传图片出现js错误的问题） - Rui - 午后的阳光][FCKEditor_rails_FCK_js_ - Rui -]        @errorNumber  =   0   
![FCKEditor与rails的集成（FCK上传图片出现js错误的问题） - Rui - 午后的阳光][FCKEditor_rails_FCK_js_ - Rui -]      end  
![FCKEditor与rails的集成（FCK上传图片出现js错误的问题） - Rui - 午后的阳光][FCKEditor_rails_FCK_js_ - Rui -]    rescue  =>  e  
![FCKEditor与rails的集成（FCK上传图片出现js错误的问题） - Rui - 午后的阳光][FCKEditor_rails_FCK_js_ - Rui -]      @errorNumber  =   110   if  @errorNumber.nil ?   
![FCKEditor与rails的集成（FCK上传图片出现js错误的问题） - Rui - 午后的阳光][FCKEditor_rails_FCK_js_ - Rui -]    end  
![FCKEditor与rails的集成（FCK上传图片出现js错误的问题） - Rui - 午后的阳光][FCKEditor_rails_FCK_js_ - Rui -]      
![FCKEditor与rails的集成（FCK上传图片出现js错误的问题） - Rui - 午后的阳光][FCKEditor_rails_FCK_js_ - Rui -]    \# Fix provided by Nicola Piccinini  \--  http: // superfluo.org   
![FCKEditor与rails的集成（FCK上传图片出现js错误的问题） - Rui - 午后的阳光][FCKEditor_rails_FCK_js_ - Rui -]     render :text  =>   % Q ' <script>window.parent.OnUploadCompleted(\#\{@errorNumber\},\\"\#\{UPLOADED\}/\#\{params\[:Type\]\}/\#\{Time.now.year\}/\#\{Time.now.month\}/\#\{@new\_file.original\_filename\}\\",\\"\#\{@new\_file.original\_filename\}\\",\\"\\");</script> '   
![FCKEditor与rails的集成（FCK上传图片出现js错误的问题） - Rui - 午后的阳光][FCKEditor_rails_FCK_js_ - Rui -]  end   
![FCKEditor与rails的集成（FCK上传图片出现js错误的问题） - Rui - 午后的阳光][FCKEditor_rails_FCK_js_ - Rui -]   private   
![FCKEditor与rails的集成（FCK上传图片出现js错误的问题） - Rui - 午后的阳光][FCKEditor_rails_FCK_js_ - Rui -]  def date\_directory\_path  
![FCKEditor与rails的集成（FCK上传图片出现js错误的问题） - Rui - 午后的阳光][FCKEditor_rails_FCK_js_ - Rui -]    base\_dir  =   " \#\{UPLOADED\_ROOT\}/\#\{params\[:Type\]\}/\#\{Time.now.year\}/\#\{Time.now.month\} "   
![FCKEditor与rails的集成（FCK上传图片出现js错误的问题） - Rui - 午后的阳光][FCKEditor_rails_FCK_js_ - Rui -]    \#Dir.mkdir(base\_dir, 0775 ) unless File.exists ? (base\_dir)  
![FCKEditor与rails的集成（FCK上传图片出现js错误的问题） - Rui - 午后的阳光][FCKEditor_rails_FCK_js_ - Rui -]    FileUtils.mkdir\_p base\_dir  
![FCKEditor与rails的集成（FCK上传图片出现js错误的问题） - Rui - 午后的阳光][FCKEditor_rails_FCK_js_ - Rui -]     " \#\{base\_dir\} "   
![FCKEditor与rails的集成（FCK上传图片出现js错误的问题） - Rui - 午后的阳光][FCKEditor_rails_FCK_js_ - Rui -]  end  
![FCKEditor与rails的集成（FCK上传图片出现js错误的问题） - Rui - 午后的阳光][FCKEditor_rails_FCK_js_ - Rui -]

转载于:https://www.cnblogs.com/feichan/archive/2011/11/16/2251666.html

[fckeditor_plugin-0.3.2.zip]: http://rubyforge.org/frs/download.php/13547/fckeditor_plugin-0.3.2.zip
[FCKEditor_rails_FCK_js_ - Rui -]: /images/20211023/036dc900a9864f20ae5a611936798c7d.png
[FCKEditor_rails_FCK_js_ - Rui - 1]: http://www.blogjava.net/Images/OutliningIndicators/ExpandedBlockStart.gif