关于WebUploader的跨域请求

引言: 在项目上传文件根据项目需求使用了 WebUploader , 遇到了跨域,发现总是上传失败, 在网上找了许多的博客, 很少有正确的, 并且解释的对我这种渣来说比较捉急, 最终通过整理及实践解决了问题, 遂把解决方案贴出来,希望能帮助到其他遇到此问题的朋友.

1: 在使用WebUploader 时会发现上传时有两个请求, 一个是OPTIONS, 一个是POST, 这就注定了你的api接口需要能接收这两种方式的请求, 如 :

$this->add("/index/save-file", array(
'controller'    => "index",
'action'        => "saveFile",
            )
        )->via(["OPTIONS","POST"]);

注 :上述使用的是phalcon的路由, 同理, 其他框架也一样, 如laravel框架的 any.

2: 因为是跨域上传, 必然要对头信息进行设置, 在你当前的方法起始处加入:

header('Access-Control-Allow-Origin: *');
header('Access-Control-Allow-Methods: *');
header('Access-Control-Max-Age: 1000');

注: header('Access-Control-Allow-Origin: *') 此设置可能会造成安全的隐患: 你可以这样, 如:

header("Access-Control-Allow-Origin: 'http://localhost:7779'");　　　　　　//7779, 你当前api项目的域名地址

3: 因为有两个请求, 第一个OPTIONS可以"先尽快结束它", 如:

if ($_SERVER['REQUEST_METHOD'] == 'OPTIONS') {
return $this->toSuccess(200,'成功');
   }

4: 以上操作ok后就应该可以顺利操作了:

if ($this->request->hasFiles() == false) {
return $this->toError(500,"未获取到上传的文件");
   }

$Files = $this->request->getUploadedFiles();        //获取文件

......     //后续操作

5: 若有错误. 欢迎指正.

秒客网

关于WebUploader的跨域请求

相关文章