杂谈:最近在玩一个第三方的微信开发平台,里面的图片都是上传到【七牛云存储】的,用了一下非常的好用,支持各种语言,SDK齐全。支持全分布式系统架构以及存储技术和数据加速,于是决定将网站的图片都存储到七牛上(之前存储在本地服务器,不仅耗费流量,而且占空间,像我准备使用新浪云SAE,没有备案的话要消耗双倍的云豆,晕死)。如果和我一样希望把你的图片存储到海量云空间的朋友,请继续往下看,高手请掠过·····。

言归正传:这里直接贴出修改好的代码 和 操作步骤。想详细研究的童鞋可以登录七牛的官网查看 http://developer.qiniu.com/docs/v6/index.html

请自行下载:我使用的是php,其他语言的原理相同,请参考七牛SDK自行修改。

1.百度UEditor编辑器:点击下载 (版本:1.3.6 utf-8版)

2.七牛SDK(php版本):点击下载 (版本 :V6.1.9)

-----------------------------------------------------------------------------------

本地开发的话

首先要开启php扩展 php_curl 我使用的是WAMP 很方便 可自行找到php.ini文件 取消 php_curl 模块之前的注释

   

在测试七牛接口的时候报错 Fatal error: Call to undefined function curl_init()
解决办法:

1、在php.ini中找到extension=php_curl.dll,去掉前面的,php.ini一般在c:\windows下面。

2、在php.ini中找到extension_dir = "ext",去掉前面的;,改为extension_dir = "C:\php5\ext"。
"C:\php5\ext"只是示例,即扩展指向的路径要对 3、php_curl.dll、libeay32.dll、ssleay32.dll、php5ts.dll都拷到system32下面去。重启apache服务

步骤:

1.申请七牛空间 假设创建一个名称为abc的空间

取得 域名:abc.qiniudn.com ,

开发者平台-->帐号设置 里面取得:Ak SK

2.解压SDK,将qiniu 文件夹copy到 ueditor\php\ 目录下 如图:

2.修改 ueditor.config.js

只需要修改一个地方找到 ,imagePath:"" 设置为空串 因为前台使用的都是七牛给的绝对路径(URI) 不需要加本项目的修正前缀

还是贴个图吧

3.修改 Uploader.class.php

(1)给 $stateMap 数组添加一个元素:错误提示 为了国际化采用了unicode编码 (不需要提示错误这一步可省略)

//"QINIU" => "远程上传失败"
'QINIU'=> '\u8fdc\u7a0b\u4e0a\u4f20\u5931\u8d25',

(2)修改 private function upFile( $base64 )

这里贴出修改后的全部代码,里面的注视代码请忽略,留下是为了后续修改方便阅读  (假设:仓库名为 abc)

/**
* 上传文件的主处理方法
* @param $base64
* @return mixed
*/
private function upFile( $base64 )
{
//处理base64上传
if ( "base64" == $base64 ) {
$content = $_POST[ $this->fileField ];
$this->base64ToImage( $content );
return;
} //处理普通上传
$file = $this->file = $_FILES[ $this->fileField ];
if ( !$file ) {
$this->stateInfo = $this->getStateInfo( 'POST' );
return;
}
if ( $this->file[ 'error' ] ) {
$this->stateInfo = $this->getStateInfo( $file[ 'error' ] );
return;
}
if ( !is_uploaded_file( $file[ 'tmp_name' ] ) ) {
$this->stateInfo = $this->getStateInfo( "UNKNOWN" );
return;
} $this->oriName = $file[ 'name' ];
$this->fileSize = $file[ 'size' ];
$this->fileType = $this->getFileExt(); if ( !$this->checkSize() ) {
$this->stateInfo = $this->getStateInfo( "SIZE" );
return;
}
if ( !$this->checkType() ) {
$this->stateInfo = $this->getStateInfo( "TYPE" );
return;
} //上传图片到云端 start
require_once("qiniu/io.php");
require_once("qiniu/rs.php"); $bucket = "abc"; //仓库名
//截取原始文件后缀名
$key1 = "Uploads/".time().mt_rand(10,99).$this->getFileExt();
$accessKey = '填写你的AK';
$secretKey = '填写你的SK'; Qiniu_SetKeys($accessKey, $secretKey);
$putPolicy = new Qiniu_RS_PutPolicy($bucket);
$upToken = $putPolicy->Token(null);
$putExtra = new Qiniu_PutExtra();
$putExtra->Crc32 = 1;
//$file[ "tmp_name" ] ueditor上传的临时文件路径
list($ret, $err) = Qiniu_PutFile($upToken, $key1, $file[ "tmp_name" ], $putExtra); //成功返回$ret
//array
// 'hash' => string 'FsgE4pr0atgeRut7zwam2kw1-DSB' (length=28)
// 'key' => string 'Uploads/139964935320' (length=20) //失败返回$err
// object(Qiniu_Error)[6]
// public 'Err' => string 'no such bucket' (length=14)
// public 'Reqid' => string 'hSsAAA2QUiTHjWwT' (length=16)
// public 'Details' => string '' (length=0)
// public 'Code' => int 631 //不能随便输出 否则上传进度条无法完成
// echo "====> Qiniu_PutFile result: \n";
// if ($err !== null) {
// var_dump($err);
// } else {
// var_dump($ret);
// }
//end //判断保存是否成功 //将完整的路径返回给前端 img[src]
// $this->fullName = $this->getFolder() . '/' . $this->getName();
$this->fullName = "http://abc.qiniudn.com/".$key1;
// if ( $this->stateInfo == $this->stateMap[ 0 ] ) {
// if ( !move_uploaded_file( $file[ "tmp_name" ] , $this->fullName ) ) {
// $this->stateInfo = $this->getStateInfo( "MOVE" );
// }
// }
}

这样就大功告成了 ,非常的简单。上面的代码没有判断之前添加的错误码 QINIU 需要可自行判断。

成功会返回 $ret 数组

失败会返回 $err 数组

并且最后一定要将完整的文件路径返回给前端:

$this->fullName = "http://abc.qiniudn.com/".$key1;

【UEditor】远程上传图片到【七牛云存储】的更多相关文章

  1. ueditor上传图片到七牛云存储(form api,java)

    转:http://my.oschina.net/duoduo3369/blog/174655 ueditor上传图片到七牛云存储 ueditor结合七牛传图片 七牛的试炼 开发前的准备与注意事项说明 ...

  2. js上传图片到七牛云存储

    项目开发过程中遇到一个需求,运营人员需要上传图片到七牛云,最开始的做法是,后台对接七牛,然后出一个接口,前端调用接口,先将图片传到后台,然后后台再上传七牛云,用的过程中发现,图片小的情况下还好,图片一 ...

  3. Ueditor上传图片到本地改造到上传图片到七牛云存储

    作为新手说多了都是泪啊!我特别想记录一下作为菜鸟时的坑.看看以后是否会看着笑出来. 为什么要改到云存储上就不说了.好处多多. 视频教程上使用的又拍云同时也提到了七牛云.下来我自己也查了下.又拍云是试用 ...

  4. Kindeditor上传图片到七牛云存储插件(PHP版)

    由于工作需要,要使用第三方存储作为图床,发现七牛云挺不错,又可以免费使用10G的空间,决定先试试. 项目中使用的是Kindeditor作为网页编辑器的,七牛云的插件里没有现成的Kindeditor的插 ...

  5. JavaWeb结合七牛云存储搭建个人相册服务

    JavaWeb结合七牛云存储搭建个人相册服务 一.引言1. 课程概述 相信很多人都知道网站一般会有很多图片,对于小型网站来说,图片放在网站服务器上不算什么,但当图片数量很大时,会造成服务器很臃肿,相应 ...

  6. 在ThinkPHP框架(5.0.24)下引入Ueditor并实现向七牛云对象存储上传图片同时将图片信息保存到MySQL数据库,同时实现lazyload懒加载

    这是我花了很多天的时间才得以真正实现的一组需求. 文章后面有完整Demo的GitHub链接. 一. 需求描述 1. 应用是基于ThinkPHP5开发的: 2. 服务器环境是LNMP,PHP版本是7.2 ...

  7. Ueditor结合七牛云存储上传图片、附件和图片在线管理的实现和最新更新

    最新下载地址: https://github.com/widuu/qiniu_ueditor_1.4.3 Ueditor七牛云存储版本 注意事项 老版本请查看 : https://github.com ...

  8. 用ueditor上传图片、文件等到七牛云存储

    ueditor上传文件,是用数据流的形式上传的. 而七牛云存储官方文档中,只提供了文件路径上传的方式. 但是,仅仅是在官方文档中写了这一种方式. 事实上,利用VS的对象管理器,打开Qiniu的dll, ...

  9. C#/.net七牛云存储上传图片(文件)操作

    七牛云存储官方: C#SDK(http://developer.qiniu.com/docs/v6/sdk/csharp-sdk.html) 注册成为标准用户就可获得:10GB永久免费存储空间/ 每月 ...

随机推荐

  1. Eclipse中构建Fluent风格到Formatter

    The place to set this is on the "Line Wrapping" tab of the code formatting preferences pag ...

  2. nvelocity模板引擎

    using NVelocity.App;using NVelocity.Runtime;using NVelocity; VelocityEngine vltEngine = new Velocity ...

  3. Bridge桥接模式

    当我们的功能要在多个维度进行扩展时,各个维度之间可以交叉组合,就可以考虑使用桥接模式. 将抽象部分与实现部分分离,使它们都可以独立的变化.                                ...

  4. 如何设置BIOS使服务器断电后再来电能自动开机

    不同的主板及CMOS型号相对应的选项会有所不同,但我想应该不会差太多,一般都在[POWER MANAGEMENT SETUP]和[Integrated Peripherals]这两个选项中.下面介绍两 ...

  5. [Other] 自定义MIME类型支持FLV的相关设置

    刚测试知道为何服务器无法播放flv的原因,特此记录而已. 网络空间支持FLV的相关设置,就是自定义一个MIME类型,一般虚拟主机管理里面都有这个选项 自定义MIME类型 扩展名: .flv MIME类 ...

  6. JAVA中抽象类的一些总结

    抽象类和普通类一样,有构造函数.抽象类中有一些属性,可以利用构造方法对属性进行初始化.子类对象实例化的时候先执行抽象类的构造,再执行子类构造. 抽象类不能用final声明.因为抽象类必须有子类继承,所 ...

  7. CSS从大图中抠取小图完整教程(background-position应用)

    CSS从大图中抠取小图完整教程(background-position应用)  转自: http://www.cnblogs.com/iyangyuan/archive/2013/06/01/3111 ...

  8. 在weblogic11g上发布项目遇到的一个错误(不支持web-app_3_0)

    错误信息如下: 消息图标 - 错误 [HTTP:101064][WebAppModule(ssh1:ssh1.war)] Error parsing descriptor in Web appplic ...

  9. Chapter Configuration

    Chapter Configuration 在Web.config 或App.config的configuration节,插入如下配置: <configuration> …… <co ...

  10. 在虚拟机上安装红帽Linux.5.5.for.x86.服务器版系统(按针对安装oracle 10g作的配置)

    在虚拟机上安装红帽Linux.5.5.for.x86.服务器版系统(按针对安装oracle 10g作的配置)   软件版本: 虚拟机版本:vmwareworkstation 7.11 build-28 ...