tp5.1两个插件的方法upload.js+jquery.html5-fileupload.js上传穿图片

tp5 也是需要跑命令，安装七牛的包

1. 启动代码：（upload.js）

var opts = {                   //就是一个ajax请求，请求到方法当中
    url: "/photos",              //接口地址，首先点击要进入启动这个
    type: "POST",
    success: function (result) {
        //console.log(result);return;
        if (result.status == 0) {
            alert(result.msg);
            return false;
        }
        $("input[name='image']").val(result.image_url);    //搞清楚要给谁设置值
        $("#img_show").attr("src", result.image_url);  //搞清楚要给谁设置属性src
    },
    error: function (request) {
        //console.log(request)
    }
};
$('#image_upload').fileUpload(opts);          //点别的要等于点这个id为image_upload来启动,这里有一个fileUpload的方法，所以我们引入含有这个fileUpload方法的插件

2. 创建控制器和方法与上面的接口地址要对应：

  public function store(Request $request)
    {

        $file = request()->file('image');      //这里接收上传到的图片，进行验证，利用验证器
        $info = $file->validate(['size' < 1024 * 1024 * 5, 'ext' => 'jpg,png,gif'])->rule('md5')->move('images');             //这是一个验证，然后给了一个本地的存储地址，用了md5加密，其实也可以不要
        if ($info) {
        //上传图片到本地
       // $result['msg'] = '/uploads/' . $info->getSaveName();
        //$photo = Photos::create(['image' => $result['msg']]);
       // $result['photo_id'] = $photo->id;
       // $result['status'] = 1;
       // return $result;
            $path = $info->getSaveName();           //
            $file_path = getcwd() . '/images/' . $path;    //获取磁盘全路径，加上app/获取图片，这里其实已经上传到本地去了，可以在这个目录下面看到图片
            //上传七牛云
            $this->qiniu_upload($file_path);    //调用七牛的那个方法，这个方法是七牛文档里面的。不过需要自己拼凑一下
            $file_path = 'http://xxx.com/' . $info->getFilename();
            $modelphoto = new ModelPhoto;
            $modelphoto->img = $file_path;             //插入photo表
            $modelphoto->save();
            return $modelphoto;   //注意这里返回的需要是一个json，这个时候就可以去前台打印看到信息了
        } else {
            // 上传失败获取错误信息
            return $file->getError();
        }
    }

注：我这里使用了一个静态调用的方法，当然可以用自定义辅助函数啦，放在common.php文件当中，可以直接使用

总结，和vue的区别就是用了插件的方法ajax请求进入了控制器，vue直接action过去了，我感觉直接发个ajax请求到控制器里面去，应该也是可以的

common.php当中qiniu_upload方法

public function qiniu_upload($file_path)
    {
        $accessKey = 'El9QkMPSBKzNdWFwjtjCXn9_K5mGoeHIBEhJ_OaL';
        $secretKey = 'sc4PAKi-OCVSrJ-qHQ9MvlSoTGqYJZL2WvZETrz6';

        // 构建鉴权对象
        $auth = new Auth($accessKey, $secretKey);

        // 要上传的空间
        $bucket = 'wanghao';

        // 生成上传 Token
        $token = $auth->uploadToken($bucket);

        // 上传到七牛后保存的文件名
        $key = basename($file_path);

        // 初始化 UploadManager 对象并进行文件的上传
        $uploadMgr = new UploadManager();

        // 调用 UploadManager 的 putFile 方法进行文件的上传
        $uploadMgr->putFile($token, $key, $file_path);

         unlink($file_path);//删除本地图片

    }