React中上传图片到qiniu(2017-05-10更新)

之前有写过类似的一篇文章,有位同学突然找来解惑,发现自己采用了另外的一个方法,这里也分享下,希望对使用reactjs的同学有帮助。

逻辑思路是这样子的,在componentDidMount中实现更新dom的操作,异步加载需要的资源文件,然后在加载完后实现qiniu的初始化操作。这里就不需要在webpack或者其他打包工具中去引入qiniu的包文件,导致打完包的文件过大了。

我这里使用了nodejs的库

...

Koa+React实现form表单上传文件

在nodejs里面通过html的表单上传图片,跟php比较起来还是麻烦一些,特别是在react中使用表单提交含有文件的数据。

最近也在做这个操作,找了很多资料,一直都是有个co-busboy这个,其实它也是基于busboy去封装的,不过这个更适合在koa里面使用。

以往的表单提交,我们用浏览器去debug的时候,会看到,提交了一个post提交的数据,这个一般只是值的提交,不包括有文件,但是在react

...

React中上传图片到qiniu

在React中使用qiniu上传图片,实现方式有很多种,一种是在web端实现上传,一种是在server端实现上传

这里我说下我是如何在web端实现上传图片到七牛的

七牛的官方已经有了javascript的使用说明我这里就不重复了。

使用React首先是要把qiniu提供的js引入,由于我这里是使用的webpack,所以我就直接放在了引入文件中,

这样我就可以全局引用了。

require('./qiniu.j
...