当前位置: 首页 > 编程笔记 >

Angular Js文件上传之form-data

唐兴发
2023-03-14
本文向大家介绍Angular Js文件上传之form-data,包括了Angular Js文件上传之form-data的使用技巧和注意事项,需要的朋友参考一下

前言:很久没更新博客,最近公司pc端技术选型用angular,这几天就赶鸭子上架,硬着头皮直接上手angular。其中有许多小坑陆陆续续踩起走。今天就遇到一个比较常见的问题:图片上传。

主题:图片上传服务器,然后通过服务器传阿里云。

不废话了直接贴前端代码:

$http({
  method: ‘POST‘,
  url: ‘/wechatapp/User/setAvatar‘,
  data: data,
  headers: {
    ‘Content-Type‘: undefined
  },
  transformRequest: function(data) {
    var formData = new FormData();
    formData.append(‘avatar_data‘, data.adata);
    formData.append(‘avatar_file‘, data.file);
    return formData;
  },
  data: {
    adata: scope.avatar_data,
    file: scope.avatar_file
  }
  }).success(function(d) {
    //请求成功
    cb(d);
  }).error(function(err, status) {
    console.log(err);
    cb(err);
  });

其实没神马难点,主要是取消post默认的Content-Type,然后已FormData的方式上传。一般ajax上传文件都是以FormData方式传。

以上就是本文给大家介绍Angular Js文件上传之form-data,希望大家喜欢。

 类似资料:
  • 这是我的超文本标记语言形式: 我想从本地机器上传图像,并希望读取上传文件的内容。所有这些我都想使用AngularJS来完成。 当我试图打印它是未定义的。

  • 问题内容: 这是我的HTML表单: 我想从本地计算机上传图像,并想读取上传文件的内容。我想使用AngularJS进行的所有操作。 当我尝试打印时,它的值是未定义的。 问题答案: 这里的一些答案建议使用,但不幸的是,这是Internet Explorer 9及更低版本中不可用的浏览器对象。如果需要支持那些较旧的浏览器,则需要使用或使用Flash 的备份策略。 已经有许多Angular.js模块可以执

  • 问题内容: 我正在尝试使用伪装完成多部分文件上传,但似乎在任何地方都找不到很好的示例。我本质上希望HTTP请求类似于以下内容: 甚至… 我是否需要手动构建请求主体,包括生成多部分边界?考虑到此客户端可以执行的其他所有操作,这似乎有点过头了。 问题答案: 不,你没有。您只需要定义一种代理接口方法,将content-type指定为:multipart / form- data和其他信息,例如远程API

  • 我试图使用feign完成一个多部分文件上传,但是我似乎在任何地方都找不到一个好的例子。我基本上希望HTTP请求的结果类似如下: 或者甚至… 我需要手动构建请求体吗,包括生成多部分边界?考虑到这个客户端可以做的所有其他事情,这似乎有点过分。

  • 问题内容: 我有一个Java Spring MVC Web应用程序作为服务器。并且基于AngularJS的应用程序作为客户端。 在AngularJS中,我必须上传文件并发送到服务器。 这是我的 html 这是我的 UploadController.js 它要发送到服务器。这是我的 DocumentUploadController.java 运行此命令时,出现以下异常 在我的 application

  • 问题内容: Java控制器类: html文件: 角js: 这是我在服务器日志中无法理解的错误: 问题答案: 尝试以下方法。对我来说很好。 HTML你应该有 注意输入的名称。 然后在JS控制器方法中 现在在您的Java Controller类中 希望这对您有用。并且也要进行异常处理。