kindeditor 加入七牛云上传的实例讲解


Posted in PHP onNovember 12, 2017

七牛云上传主要有两种:

服务端上传

前端上传,前端又分两种返回方式:

1).重定向返回,可以解决ajax跨域的问题

2).回调返回,七牛云先向服务端要返回数据,再由七牛云返回前端,解决不支持重定向的请求方式,比如小程序上传

本次使用的是 七牛云 php sdk;

composer require qiniu/php-sdk

在Kindeditor/php 下添加 config.php 主要是配置参数

<?php
error_reporting(0);
 
defined('ROOT_PATH') || define('ROOT_PATH', dirname(__DIR__).'/');
defined('QINIU_ACCESS_KEY') || define('QINIU_ACCESS_KEY', '');
defined('QINIU_SECRET_KEY') || define('QINIU_SECRET_KEY', '');
defined('QINIU_TEST_BUCKET') || define('QINIU_TEST_BUCKET', '七牛云空间名');
defined('QINIU_BUCKET_DOMAIN') || define('QINIU_BUCKET_DOMAIN', '七牛云空间网址');
 
defined('CALLBACK_URL') || define('CALLBACK_URL', '域名/kindeditor/php/callBack.php');
defined('RETURN_URL') || define('RETURN_URL', '域名/kindeditor/php/returnBack.php');
 
require_once ROOT_PATH."vendor/autoload.php";

在Kindeditor/php 下添加 qiniu_token.php 主要是生成上传用的 token

<?php
use Qiniu\Auth;
 
require_once __DIR__."/config.php";
 
// 构建鉴权对象
$auth = new Auth(QINIU_ACCESS_KEY, QINIU_SECRET_KEY);
 
$data = [
  'returnUrl' => RETURN_URL,
];
if (isset($_REQUEST['is_call'])) {
  $data = [
   'callbackUrl' => CALLBACK_URL,
   'callbackBody' => 'key=$(key)&hash=$(etag)&w=$(imageInfo.width)&h=$(imageInfo.height)'
  ];
}
// 生成上传 Token
$token = $auth->uploadToken(QINIU_TEST_BUCKET, null, 3600, $data);
 
echo json_encode([
  'error' => 0,
  'token' => $token
]);

在Kindeditor/php 下添加 callBack.php 主要是回调用

<?php
use Qiniu\Auth;
 
require_once __DIR__."/config.php";
$_body = file_get_contents('php://input');
$auth = new Auth(QINIU_ACCESS_KEY, QINIU_SECRET_KEY);
//回调的contentType
$contentType = 'application/x-www-form-urlencoded';
//回调的签名信息,可以验证该回调是否来自七牛
$authorization = $_SERVER['HTTP_AUTHORIZATION'];
$isQiniuCallback = $auth->verifyCallback($contentType, $authorization, CALLBACK_URL, $_body);
if (!$isQiniuCallback) {
  echo json_encode([
    'error' => 2,
    'message' => '验证失败'
  ]);
  die();
}
 
$body = $_POST;
$qiniu_url = QINIU_BUCKET_DOMAIN;
if (!empty($body['key'])) {
  echo json_encode([
    'error' => 0,
    'url' => $qiniu_url.$body['key']
  ]);
  die();
}
echo json_encode([
  'error' => 1,
  'message' => '视频上传出错'
]);

在Kindeditor/php 下添加 returnBack.php 主要是重定向接收地址

<?php
use Qiniu\Auth;
 
require_once __DIR__."/config.php";
$upload_ret = base64_decode($_GET['upload_ret']);
$upload_ret = json_decode($upload_ret, true);
$qiniu_url = QINIU_BUCKET_DOMAIN;
if (!empty($upload_ret['key'])) {
  echo json_encode([
    'error' => 0,
    'url' => $qiniu_url.$upload_ret['key']
  ]);
  die();
}
echo json_encode([
  'error' => 1,
  'message' => '视频上传出错'
]);

接下来是前端更改,我改的时视频上传

Kindeditor/plugins/media/media.js

KindEditor.plugin('media', function(K) {
  var self = this, name = 'media', lang = self.lang(name + '.'),
    allowMediaUpload = K.undef(self.allowMediaUpload, true),
    allowFileManager = K.undef(self.allowFileManager, false),
    formatUploadUrl = K.undef(self.formatUploadUrl, true),
    extraParams = K.undef(self.extraFileUploadParams, {
      'token': ''//添加token
    }),
    filePostName = K.undef(self.filePostName, 'file'), //更改文件上传名
    uploadJson = K.undef(self.uploadJson, 'https://up.qbox.me'); //更改上传地址,我用的时华东区的空间使用https
 
     
    ....
 
      function getQToken() {
        $.getJSON('/includes/kindeditor/php/qiniu_token.php', function (data) {
          K('[name="token"]', div).val(data.token);
        });
      }
            // 获取设置上传token
      getQToken();
 
      if (allowMediaUpload) {
        var uploadbutton = K.uploadbutton({
          button : K('.ke-upload-button', div)[0],
          fieldName : filePostName,
          extraParams : extraParams,
          url : uploadJson,//去除添加参数
          afterUpload : function(data) {
      ...
});

这要就可以上传视频到七牛云了。

以上这篇kindeditor 加入七牛云上传的实例讲解就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持三水点靠木。

PHP 相关文章推荐
PHP 将图片按创建时间进行分类存储的实现代码
Jan 05 PHP
PHP中Date()时间日期函数的使用方法小结
Apr 20 PHP
JS 网站性能优化笔记
May 24 PHP
php提示Call-time pass-by-reference has been deprecated in的解决方法[已测]
May 06 PHP
phpcms模块开发之swfupload的使用介绍
Apr 28 PHP
解析PHP中DIRECTORY_SEPARATOR,PATH_SEPARATOR两个常量的作用
Jun 21 PHP
PHP中实现接收多个name相同但Value不相同表单数据实例
Feb 03 PHP
php筛选不存在的图片资源
Apr 28 PHP
php实现有趣的人品测试程序实例
Jun 08 PHP
Yii框架批量插入数据扩展类的简单实现方法
May 23 PHP
PHP使用openssl扩展实现加解密方法示例
Feb 20 PHP
php7连接MySQL实现简易查询程序的方法
Oct 13 PHP
Thinkphp5 微信公众号token验证不成功的原因及解决方法
Nov 12 #PHP
PHP 断点续传实例详解
Nov 11 #PHP
PHP+AJAX 投票器功能
Nov 11 #PHP
PHP实现双链表删除与插入节点的方法示例
Nov 11 #PHP
PHP实现基于栈的后缀表达式求值功能
Nov 10 #PHP
PHP实现基于图的深度优先遍历输出1,2,3...n的全排列功能
Nov 10 #PHP
PHP根据树的前序遍历和中序遍历构造树并输出后序遍历的方法
Nov 10 #PHP
You might like
php中几种常见安全设置详解
2010/04/06 PHP
解析zend studio中直接导入svn中的项目的方法步骤
2013/06/21 PHP
PHP curl CURLOPT_RETURNTRANSFER参数的作用使用实例
2015/02/07 PHP
PHP连接sftp并下载文件的方法教程
2018/08/26 PHP
JavaScript学习历程和心得小结
2010/08/16 Javascript
详解JavaScript函数绑定
2013/08/18 Javascript
javascript的渐进增强与平稳退化浅谈
2013/11/12 Javascript
JS运动相关知识点小结(附弹性运动示例)
2016/01/08 Javascript
JS实现控制文本框的内容
2016/07/10 Javascript
深入理解Vue生命周期、手动挂载及挂载子组件
2017/09/27 Javascript
Angular如何在应用初始化时运行代码详解
2018/06/11 Javascript
详解koa2学习中使用 async 、await、promise解决异步的问题
2018/11/13 Javascript
Vue2.0+Vux搭建一个完整的移动webApp项目的示例
2019/03/19 Javascript
Smartour 让网页导览变得更简单(推荐)
2019/07/19 Javascript
JS实现进度条动态加载特效
2020/03/25 Javascript
Python实现的飞速中文网小说下载脚本
2015/04/23 Python
python连接字符串的方法小结
2015/07/13 Python
python如何查看系统网络流量的信息
2016/09/12 Python
儿童python练习实例
2018/05/27 Python
Python使用pymysql从MySQL数据库中读出数据的方法
2018/07/25 Python
Python+Pandas 获取数据库并加入DataFrame的实例
2018/07/25 Python
python实现网站用户名密码自动登录功能
2019/08/09 Python
Python操作qml对象过程详解
2019/09/26 Python
Rodd & Gunn澳大利亚官网:新西兰男装品牌
2018/09/25 全球购物
下面这个程序执行后会有什么错误或者效果
2014/11/03 面试题
个人简历中的自我评价怎么写
2014/01/26 职场文书
小学优秀教育工作者事迹材料
2014/05/09 职场文书
县政府领导班子四风问题对照检查材料思想汇报
2014/09/26 职场文书
工作保证书
2015/01/17 职场文书
社区青年志愿者活动总结
2015/05/06 职场文书
离婚起诉书范本
2015/05/18 职场文书
新闻稿件写作范文
2015/07/18 职场文书
2015年成本会计工作总结
2015/10/14 职场文书
学习心得体会
2019/06/20 职场文书
Python 的演示平台支持 WSGI 接口的应用
2022/04/20 Python
vue实现登陆页面开发实践
2022/05/30 Vue.js