最近公司的项目开始要使用ueditor了,但是ueditor却没有提供rails的版本,因此需要自己去定制化ueditor来满足项目的需求。不多说了,先简要说明下使用方法:

 ueditor目录下:

  注意:需要将ueditor目录放在工程/public/plugins/目录下  

  1 ueditor根目录下的ueditor.config.js

  

  和原本的ueditor一样,在红色部分处配置处理上传文件的controller和action,此处我已经做了修改,所以这里配置好之后,提交表单会直接上传到这里配置好的action

  2 ueditor根目录下的config.json

  注意,该文件和原始的ueditor config.json文件的配置方法是完全一样的,我这里展示下我的一些配置

  

  只修改了imageActionName选项,这里对应的名称将在前面所配置的action里面通过params[:ueditor_action]中取出(ueditor原本的是action,但是和rails冲突,所以我对其进行了修改)

  压缩包根目录下:

 resource_controller.rb

   该文件只用作示例,其应该根据使用者的需求对应相应的controller。

   在controller中可以需要这样进行处理:

 #encoding:utf-8
require 'json'
require 'tempfile'
require 'base64'
#用于上传项目相关的资源
class ResourceController < ApplicationController
#ueditor的配置
def handle_file
#ueditor是通过在url中的传入ueditor_action(原本为action,但是由于其与rails冲突,所以我将其改为了ueditor_action)字段来区分具体的操作的
return if params[:ueditor_action].blank?
cur_action = params[:ueditor_action] #刚进入页面时editor会进行config的访问
if (cur_action == "config")
#打开config.json文件,将其返回,注意,我这里是将config.json文件放在/public/plugins/ueditor/目录下,可以自己的需求,对这里进行相应的更改
json = File.read("#{Rails.root.to_s}/public/plugins/ueditor/config.json")
#正则替换,使其成为ueditor可以识别的格式
json = json.gsub(/\/\*[\s\S]+?\*\//, "")
result = JSON.parse(json).to_s
result = result.gsub(/=>/,":")
#返回结果
render :text => result
#图片上传
elsif (cur_action == "upload_image")
upload_image_video
#视频上传
elsif (cur_action == "upload_video")
upload_image_video
#涂鸦上传
elsif (cur_action == "upload_scrawl")
upload_scrawl
else
respond_result
end
end private
#涂鸦文件的处理,ueditor使用base64编码,并且为png格式
def upload_scrawl
status = 'SUCCESS'
if params[:upfile].blank?
return
end
scrawl_base64 = params[:upfile]
tempfile = Tempfile.new("upload_scrawl.png")
tempfile.binmode
tempfile.write(Base64.decode64(scrawl_base64))
tempfile.close
#开始保存文件
filename = get_random_string(10) + "_" + get_random_string(10) + "_" + get_random_string(10) + ".png" #保存文件到项目指定的路径,该方法未实现,需要自己去实现
save_file(tempfile,filename) respond_result(filename,status)
end #上传图片和视频的处理
def upload_image_video
status = 'SUCCESS'
#对视频文件或者图片文件进行保存,需要自己实现
respond_result(filename,status)
end #负责向客户端返回数据
def respond_result(filename='', status='')
#该变量是根据ueditor自带的demo写的,不知道为什么,demo没有也没有传这个字段
callback = params[:callback]
response_text = ''
#构造需要返回的数据,这个是ueditor已经约定好的,不能随意对字段进行修改。也不能使用rails内置的render :json语句,因为这样最后得到的数据格式是无法被ueditor解析的。
if filename.blank?
response_text = "{\"name\":\"\"," +
"\"originalName\":\"\"," +
"\"size\":\"\",\"state\":\"#{status}\",\"type\":\"\",\"url\":\"\"}"
else
response_text = "{\"name\":\"#{filename}\"," +
"\"originalName\":\"#{filename}\"," +
"\"size\":\"#{File.size(TalentUtils.get_upload_file(filename)).to_s}\",\"state\":\"#{status}\",\"type\":\"#{File.extname(filename)}\",\"url\":\"#{filename}\"}"
end if callback.blank?
render :text => response_text
else
render :text => "<script>"+ callback +"(" + response_text + ")</script>"
end
end #生成随机的字符串
def get_random_string(num = 5)
#5是指生成字符串的个数,默认为5
rand(36 ** num).to_s(36)
end
end

ueditor中改变的文件为ueditor.all.js,在文件中搜索“李江涛”可以快速定位到我所更改的地方,部分地方可能未标识:

我的邮箱:seancheer@163.com

工程地址:https://github.com/seancheer/ueditor_with_rails

  

ueditor之ruby on rails 版的更多相关文章

  1. 如何从 0 开始学 ruby on rails (漫步版)

    如何从 0 开始学 ruby on rails (漫步版) ruby 是一门编程语言,ruby on rails 是 ruby 的一个 web 框架,简称 rails. 有很多人对  rails 感兴 ...

  2. (转) 如何从 0 开始学 ruby on rails (漫步版)

    原文:http://readful.com/post/12322300571/0-ruby-on-rails ruby 是一门编程语言,ruby on rails 是 ruby 的一个 web 框架, ...

  3. Ruby on Rails Tutorial 第2版 学习笔记

    Ruby on Rails Tutorial 第2版 在线阅读:http://railstutorial-china.org/ 英文版:http://ruby.railstutorial.org/ru ...

  4. ubuntu 14.04中安装 ruby on rails 环境(填坑版) 呕血推荐

    环境:在win7 上Vmware虚拟机环境中安装的ubuntu 14.04 开发相关: ruby 2.2.0 rails 4.2.0 sublime text 3 本文说明:所有的命令均在$ 之后,若 ...

  5. ruby on rails 实战(一)

    通过ruby on rails 一步一步搭建个人站点,涉及到的技术有:ruby,rails,javascript,jquery 操作系统:win7 IDE: rubymine 5.4. 第一步,下载安 ...

  6. [Ruby on Rails系列]1、开发环境准备:Vmware和Linux的安装

    Ruby on Rails是一个采用Ruby语言的遵循MVC模式的Web开发框架.使用RoR会得到更加快速爽快的Web开发体验.相比于Java EE,该框架使Web开发的速度和效率变得更加轻快和敏捷. ...

  7. [Ruby on Rails系列]2、开发环境准备:Ruby on Rails开发环境配置

    前情回顾 上次讲到Vmware虚拟机的安装配置以及Scientific Linux 6.X系统的安装.这回我们的主要任务是在Linux操作系统上完成Ruby on Rails开发环境的配置. 在配置环 ...

  8. Ruby on Rails创始人DHH谈如何进行混合移动APP开发

    混合型APP兼具原生型APP软件良好用户交互体验的优势和网页型APP软件跨平台开发的优势,并且其开发成本和网页型APP软件接近,其开发效率也远高于原生型APP软件.混合型APP已经被众多企业所认可.最 ...

  9. Ruby on Rails 實戰聖經阅读(二)

    1.操作系统 centos5.4 2.安装ruby yum install ruby 会安装得到 1.8.5 如果你公司用的是1.8.X就无所谓了, 拿这个学习就行了 如果你们公司用的是1.9.X,那 ...

随机推荐

  1. openstack kvm 虚拟机磁盘差异衍生

    1, openstack虚拟实例备份之--多镜像格式多镜像文件合并为一个镜像文件衍生-差异镜像文件    /var/lib/nova/instances/b0abc22f-1a73-4079-b1bc ...

  2. 2 weekend110的zookeeper的原理、特性、数据模型、节点、角色、顺序号、读写机制、保证、API接口、ACL、选举、 + 应用场景:统一命名服务、配置管理、集群管理、共享锁、队列管理

    在hadoop生态圈里,很多地方都需zookeeper. 启动的时候,都是普通的server,但在启动过程中,通过一个特定的选举机制,选出一个leader. 只运行在一台服务器上,适合测试环境:Zoo ...

  3. 2 weekend110的hadoop的自定义排序实现 + mr程序中自定义分组的实现

    我想得到按流量来排序,而且还是倒序,怎么达到实现呢? 达到下面这种效果, 默认是根据key来排, 我想根据value里的某个排, 解决思路:将value里的某个,放到key里去,然后来排 下面,开始w ...

  4. jQuery CSS 的操作函数

    jQuery CSS 操作函数 下面列出的这些方法设置或返回元素的 CSS 相关属性. CSS 属性 描述 css() 设置或返回匹配元素的样式属性. height() 设置或返回匹配元素的高度. o ...

  5. 解决Ubuntu Server 12.04换了网卡MAC地址后 网络不可用的问题.

    重装了系统,新建了一个ubuntu虚拟机,加载原来的镜像,结果启动后网络变得不正常了,提示信息 Waiting for network configuration...Waiting up to 60 ...

  6. SecureCRT 无法删除字符

    1. 2.

  7. PHP开发Apache服务器配置

    照此配置流程,绝对一路畅通,可保无虞. 昨天弄了个PHP小程序,想在本地跑一下测试,可是工作电脑没有安装环境,于是下载了一个wamp,一路畅通,Apache.Mysql.PHP就 全有了.启动wamp ...

  8. Android解析qq聊天记录表情

    偶然在一个需求中需要解析qq聊天记录表情,表情的格式是以/开始,比如:你好啊?/微笑,在网上找了半天,也没能找到一个比较合适的,所以准备自己实现一下,首先要将表情图片和表情字符对上号,我想了几种解决方 ...

  9. (7/18)重学Standford_iOS7开发_视图、绘制、手势识别_课程笔记

    第七课: 1.View 一般来说,视图是一个构造块,代表屏幕上一块矩形区域,定义了一个坐标空间,并在其中绘制及添加触控事件等. ①视图的层级关系 一个视图只能有一个父视图,可以有多个子视图 - ( - ...

  10. 站在巨人的肩膀上学习Android开发

    我们知道,一開始最好的学习方法是模仿,尤其是模仿巨人. 那说到Android开发的模仿自然就是分析并研究主流程序的布局.实现方法.进而提升自己的技术. 第一招----逆向project 要分析&quo ...