rails上传图片代码实例

今天讲解一下rails的图片上传，就是最平常的上传图片 这里的rails版本2.3.5

首先新建一个write_pic model内容如下：


代码如下:

class WritePic
require "RMagick"
require "uuid"
def self.write(pic_data,ori_name,resize = nil,file_type = "jpg",tag=false)
#File.delete("c:/programData/ruby-uuid") if RAILS_GEM_VERSION == '2.1.2'
uuid = ori_name || "#{UUID.new.generate}.#{file_type}"
i = Magick::Image.from_blob(pic_data).first
if resize
p=resize[:width].to_i*1.00 /i.columns
i.resize!(resize[:width],resize[:height]|| i.rows*p)
end
wh=0
width = i.columns
height = i.rows
if width > height
wh =1
end
i.write("#{RAILS_ROOT}/public/images/user_pic/#{uuid}")
if tag
return wh,uuid
else
return uuid
end
end
def self.get_pic(url)
uuid = "#{UUID.new.generate}.#{file_type}"
img_orig1 = Magick::Image.read(url).first
image1 = img_orig1.resize_to_fit(300,300)
image1.write("#{RAILS_ROOT}/public/images/weibo_pic/#{uuid}")
return uuid
end
end

上传 图片是用的插件所以最上面加载了插件。

调用write_pic 这个model的model文件写法如下


代码如下:

class Theme < ActiveRecord::Base
require "RMagick"
require "uuid"
def _image=(picture_field)
if picture_field != ""
self.image = WritePic.write(picture_field.read,self.image,nil)
end
end
def _image
self.image
end
def suoluetu=(picture_field)
if picture_field != ""
self.thumbnail = WritePic.write(picture_field.read,self.thumbnail,nil,"png")
end
end
def suoluetu
self.thumbnail
end
end

controller里面不用在乎太多，直接上view


代码如下:

<h1>New theme</h1>
<% form_for(@theme,:html=>{:multipart=>'true'}) do |f|%>
<%= f.error_messages %>

<p>
<%= f.label :name %><br />
<%= f.text_field :name %>
</p>
<p>
<%= f.label :color %><br />
<%= f.text_field :color %>
</p>
<p>
<%= f.label :lastcolor %><br />
<%= f.text_field :lastcolor %>
</p>
<p>
<%= f.label :image %><br />
<%= f.file_field :_image %>
</p>
<p>
<%= f.label :thumbnail %><br />
<%= f.file_field :suoluetu %>
</p>
<p>
<%= f.submit "Create" %>
</p>
<% end %>

<%= link_to 'Back', themes_path %>

赞 (0)

相关推荐

  • js实现上传图片之上传前预览图片

    上传图片对图片进行一下预览,可以了解图片上传后大概会是什么样子,此功能用js实现,然后在fileupload控件的change事件中调用,这样当用fileupload选择完图片以后,图片就会自动显示出来了.功能很简单,却很实用. 预览图片的js代码: 复制代码 代码如下: <script type="text/javascript"> function setImagePreview(docObj,localImagId,imgObjPreview) { if(docObj

  • 简单PHP上传图片、删除图片实现代码

    上传图片: 复制代码 代码如下: if (!empty($_FILES["img"]["name"])) { //提取文件域内容名称,并判断 $path="uppic/"; //上传路径 if(!file_exists($path)) { //检查是否有该文件夹,如果没有就创建,并给予最高权限 mkdir("$path", 0700); }//END IF //允许上传的文件格式 $tp = array("image

  • ASP.NET下上传图片到数据库，并且读出图片的代码(详细版)

    首先在SQL Server中建立一个图片存储的数库表,ImageData Column为图象二进制数据储存字段,ImageContentType Column为图象文件类型记录字段,ImageDescription Column为储蓄图 象文件说明字段,ImageSize Column为储存图象文件长度字段,结构如下: 复制代码 代码如下: CREATE TABLE [dbo].[ImageStore] ( [ImageID] [int] IDENTITY (1, 1) NOT NULL , [

  • asp.net MVC实现无组件上传图片实例介绍

    例子: 如我想上传一个图片到服务器端:asp页面 复制代码 代码如下: <form id="form1" runat="server" action="/bookIndex/fileUpLoad/(你准备处理的 ActionResult)" method="post" enctype="multipart/form-data"> <input type="file" i

  • asp.net上传图片保存到数据库的代码

    数据库:保存图片的数据格式 图象二进制数据储存字段前台: 复制代码 代码如下: <%@ Page Language="C#" AutoEventWireup="true" CodeBehind="UploadWork.aspx.cs" Inherits="meishuguan.UploadWork" %> <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Tr

  • rails上传图片代码实例

    今天讲解一下rails的图片上传,就是最平常的上传图片 这里的rails版本2.3.5 首先新建一个write_pic model内容如下: 复制代码 代码如下: class WritePicrequire "RMagick"require "uuid"def self.write(pic_data,ori_name,resize = nil,file_type = "jpg",tag=false)#File.delete("c:/pr

  • SpringMVC上传图片代码实例

    这篇文章主要介绍了SpringMVC上传图片代码实例,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友可以参考下 1.前端H5 <div class="container-fluid"> <!-- <div id="panel-advancedoptions"> --> <div class="row"> <div class="col-md-1

  • springmvc+ajax+formdata上传图片代码实例

    最近工作涉及到了上传图片的情况,在网上看了很多,就着重学习了下.上传文件的方式有多种,这里对使用FormData的方式进行说明. 1.springmvc项目想要上传文件,需要使用multipart方式,所以在spring-mvc.xml配置文件中需要增加multipart相关配置,代码如下 <bean id="multipartResolver" class="org.springframework.web.multipart.commons.CommonsMultip

  • JavaTCP上传图片代码实例

    JavaTCP上传图片代码实例

    1.客户端代码 public class UploadPicClient { public static void main(String[] args) throws UnknownHostException, IOException { // TODO Auto-generated method stub //1,创建客户端socket Socket s = new Socket("localhost",10088); //2,读取客户端要上传的图片文件 FileInputStre

  • 基于JS实现前端压缩上传图片的实例代码

    具体代码如下所示: <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>前端压缩上传图片</title> <script src="https://cdn.bootcss.com/jquery/3.2.1/jquery.min.js"></script> </head> <body>

  • jQuery AjaxUpload 上传图片代码

    本次使用AJAXUPLOAD做为上传客户端无刷上传插件,其最新版本为3.9,官方地址:http://valums.com/ajax-upload/ 在页面中引入 jquery.min.1.4.2.js 和 ajaxupload.js <script src="Scripts/jquery-1.4.2.min.js" type="text/javascript"></script> <script src="Scripts/aj

  • TinyMCE汉化及本地上传图片功能实例详解

    TinyMCE我就不多介绍了,这是下载地址:https://www.tinymce.com/download/ 下载下来是英文版,要汉化也很简单. 首先去网上随便下载个汉化包,然后把汉化包解压后的langs文件夹里的zh_CN.js拷到你下载的TinyMCE的langs文件夹中就行.最后在 tinymce.init中加上"language: "zh_CN","(后面会贴出代码) 本地图片上传我用到了Jquery中的uploadify和UI,所以需要引用jquery.

  • 用iframe实现不刷新整个页面上传图片的实例

    经常用到上传图片即时预览的功能,实现方式很多,用flash+js实现的比较多,今天遇到同事不想用flash之类也不想用网上的插件,那么我给了他一种解决办法: 思路: 1. 页面上传图片的部分放到一个iframe中,iframe设置无边框无滚动条,和所嵌入的页面风格一致,根据需要设置固定大小 2. 在iframe中提交上传图片的表单,提交后再次返回原页面(iframe所指向的页面)并从服务器带回刚上传的图片地址,调用父页面的js代码加载图片 3. 如果用到要进度条等效果,就在表单提交后,在serv

  • vue axios 表单提交上传图片的实例

    项目中用的element 的框架,然后在项目有一个添加数据需求是图片可上传,也可不上传, 然后问题就是element 中的上传控件在没有图片的时候是不会触发提交的,但接口写的是有file的  multipart/form-data    接收模式 所有只能自己另个模仿一个表单上传 <input class="file" name="file" type="file" accept="image/png,image/gif,imag

  • 微信小程序 拍照或从相册选取图片上传代码实例

    这篇文章主要介绍了微信小程序 拍照或从相册选取图片上传代码实例,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友可以参考下 upload.wxml <!--pages/upload/upload.wxml--> <button bindtap='uploadPhoto'>拍照选取照片上传</button> upload.js // pages/upload/upload.js Page({ data: { imgData: [] }

随机推荐