egg上传图片到阿里云服务器

2022-02-23 18:00:08 阅读：134 来源： 互联网

为了使文章清晰，这篇文章主要写上传图片的代码部分，关于数据库的配置，阿里云服务器的配置，oss对象存储的使用，上传图片在本地文件夹等问题在其他文章将会一一解答。

前端代码部分：

上传组件主要代码如下：

render() {
    const { name = "avatar" } = this.props;
    return (
      <Upload
        name={name}
        className="avatar-uploader"
        showUploadList={false}
        action={`${reqUrl/avatar/saveAvatar?user_id=${user_id}&update_time=${update_time}`}
        beforeUpload={beforeUpload}
        onChange={this.handleChange}
      >
      </Upload>
    );
  }

reqUrl ：请求接口地址，

beforeUpload ：对图片的一些处理,

handleChange ：上传成功后对图片的处理,

页面使用

<UploadAvatar name={"cover"} getImageUrl={this.getImageUrl()} />

后端主要代码：

controller下：

const alidata = await ctx.service.avatar.uploadAvatar();

service下：

// 上传头像到阿里云oss
  async uploadAvatar() {
    const { ctx } = this;
    let parts = ctx.multipart({ autoFileds: true });
    let stream;
    const client = new oss({
      accessKeyId: "xxx",
      accessKeySecret: "xxx",
      bucket: "bucketofreactandeggblog",
      region: "oss-cn-beijing",
    });

    while ((stream = await parts()) != null) {
      if (!stream.filename) {
        break;
      }

      let name = new Date() * 1 + path.extname(stream.filename);
      let res = await client
        .putStream(`tests/${name}`, stream)
        .catch(function (err) {
          console.log("error: %j", err);
        });
      return res;
    }

以上为上传头像前后端的主要代码，详细代码后面可以去我的github上看，稍后我会添加上我的github地址，如果又发现什么不成熟的地方请多多指教。给我留言即可。

标签：const,stream,egg,oss,let,服务器,上传,代码
来源： https://www.cnblogs.com/sinceForever/p/15928622.html

本站声明： 1. iCode9 技术分享网（下文简称本站）提供的所有内容，仅供技术学习、探讨和分享；
2. 关于本站的所有留言、评论、转载及引用，纯属内容发起人的个人观点，与本站观点和立场无关；
3. 关于本站的所有言论和文字，纯属内容发起人的个人观点，与本站观点和立场无关；
4. 本站文章均是网友提供，不完全保证技术分享内容的完整性、准确性、时效性、风险性和版权归属；如您发现该文章侵犯了您的权益，可联系我们第一时间进行删除；
5. 本站为非盈利性的个人网站，所有内容不会用来进行牟利，也不会利用任何形式的广告来间接获益，纯粹是为了广大技术爱好者提供技术内容和技术思想的分享性交流网站。

ICode9

egg上传图片到阿里云服务器