AngularJS从base64生成二进制数据图像并作为图像文件发送到服务器

2024-04-28

我正在使用这个工具在我的 AngularJS 应用程序中裁剪图像:https://github.com/fengyuanchen/cropper https://github.com/fengyuanchen/cropper

然后我尝试将数据存储到服务器,但现在我发送base64代码...我如何发送正常的裁剪图像二进制代码,而不是base64?这是真的吗?

我的上传代码是这样的:

var addImage = function(files) {
      var deferred = $q.defer();
      var fd = new FormData();      

      var blob = new Blob([files], { type : "image/png"});
      fd.append("file", blob);

      $http.post(settings.apiBaseUri + "/files", fd, {
          withCredentials: true,
          headers: {
            'Content-Type': undefined
          },
          transformRequest: angular.identity
        })
        .success(function(data, status, headers, config) {
          url = data.Url;
          deferred.resolve(url);
        })
        .error(function(err, status) {

        });
      return deferred.promise;
    };

这里我发送base64代码:

  $scope.photoChanged = function(files) {
    $scope.oldImg = angular.element(document.querySelector('#avatar-id'));
    $scope.files = files;        
    var reader = new FileReader();
    reader.onload = function(e) {
      $scope.imagecontent = e.target.result;
    };
    reader.readAsDataURL(files[0]);
  };

and

  $scope.setCroppedData = function(data) {
    $('#avatar-id').attr('src', data);
    $scope.nImg = new Image();
    $scope.nImg.src = data;  // data - is base64 image code
  }
  ...
  uploaderService.addImage($scope.nImg.src).then(function(url) {
    $scope.person.AvatarUrl = url;
    $scope.updateContactQuery();
  });
  ...

我怎样才能像我一样发送而不进行任何裁剪:发送图像文件,以便我可以通过浏览器中的链接查看图像,而不是base64代码???


您可以将 base64 数据包装在 ArrayBuffer 中,然后转换为二进制图像数据,如下所示:

var binaryImg = atob(base64Image);
var length = binaryImg.length;
var arrayBuffer = new ArrayBuffer(length);
var uintArray = new Uint8Array(arrayBuffer);
for (var i = 0; i < length; i++) {
    uintArray[i] = binaryImg.charCodeAt(i);
}

我想uintArray就是你想要的。

本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

AngularJS从base64生成二进制数据图像并作为图像文件发送到服务器 的相关文章

随机推荐

  • 当我不使用 CoreData 时,为什么我的 iOS 或 OSX 应用程序会出现 CoreData 错误?

    我在构建过程中收到以下错误 API 滥用 尝试在非拥有协调器上序列化存储访问 PSC 0x7fb5ae208890 存储 PSC 0x0 CoreData 为什么我的应用程序中出现 CoreData 错误 我没有使用 CoreData 此消
  • 从文件中读取第n行的快速方法

    介绍 我有一个名为的 C 进程MyProcess我称之为nbLines时间 地点nbLines是一个名为的大文件的行数InputDataFile txt在其中可以找到输入数据 例如调用 MyProcess InputDataFile txt
  • 为什么我无法“停用”pyenv / virtualenv?如何“修复”安装

    我是新安装的乌班图16 04并考虑到使用最新版本的开发pandas我安装了Python 3 6 0使用虚拟环境 选择 3 6 0 的一个原因是因为我在某处读到这个版本的 Python 可以原生处理虚拟环境 即无需安装任何其他东西 无论如何安
  • 为什么 AnyVal 不能用于 isInstanceOf 检查?

    我想知道 为什么 AnyVal 不能在 isInstanceOf 检查中使用 这种行为背后的原因是什么 scala gt val c t c Char t scala gt c isInstanceOf AnyVal
  • 在 Windows 任务栏中对单独的进程进行分组

    我有许多逻辑上相关的独立进程 但所有进程都是单独启动的 没有共同的 父 进程 是否可以使它们在 Windows 任务栏中显示为一组 工作样本 这是一些受雷米答案启发的工作代码 using System using System Runtim
  • Angular 4:响应式网格列表

    昨晚开始探索 Angular 4 我只是想知道是否有办法使mat grid listMaterial Design 组件响应式与 Boostrap 如何处理它一样简单 任何人 提前谢谢您 不是纯 html 不过你可以找到一些 html ts
  • 不间断破折号 html [重复]

    这个问题在这里已经有答案了 我知道有一个不间断的空白 nbsp 是否有不间断的破折号 我可以使用这样我的单词就不会在该位置换行 中断 另外 有人可以向我指出一个列表 其中包含在断开句子时优先考虑的字符 例如空格 提前致谢 Use 8209
  • iOS Objective-C 以编程方式获取 VPN IP

    我使用第三方应用程序连接VPN 我们可以在以下位置获取详细信息Settings gt VPN gt information 我怎样才能得到Assigned IP通过 Objective C 在我们的应用程序中以编程方式 NSString a
  • 是否可以在 Android 中动态更改 EditTextPreference 的摘要?

    我设置了一个首选项屏幕来编辑应用程序中的设置 我想插入一个 EditTextPreference 其中包含一个标题 如 设置您的名字 和一个包含输入名称的摘要 那可能吗 先感谢您 当然 这是一个简短的例子 EditTextPreferenc
  • VS2010 中使用 lambda 参数捕获的 C++ 嵌套 lambda bug?

    我使用的是 Visual Studio 2010 它显然在 lambda 上有一些错误行为 并且有这个嵌套 lambda 其中内部 lambda 返回包装为 std function 的第二个 lambda 参见MSDN 上的 高阶 Lam
  • 从函数调用动态 SQL

    我正在编写一个返回表的函数 有两个参数传递给该函数 并构建并执行查询并将其插入到返回的表中 但是我收到这个错误 只能从函数内执行函数和一些扩展存储过程 我不想使用存储过程 因为这是一个简单的实用函数 有谁知道这是否可以做到 我的函数编码如下
  • 跨多个类使用 SharedPreferences?

    我有一个 SharedPreferences 目前适用于一类 但不适用于第二类 我想我可能把它称为错误的 因为我得到的错误说 The method getSharedPreferences String int is undefined f
  • Firefox 中忽略的图像最大高度百分比

    HTML div class container div
  • android中无法绕过的Root检测方法

    我知道在 root 设备上运行拥有敏感信息的应用程序根本不安全 因此 开发人员通常在这种情况下进行 root 检测 如果发现设备已 root 则该应用程序将不会安装 一切都好 开发者在root检测中使用的主要技术是检查superuser a
  • Inno Setup,APP启动 Windows启动时

    对于 Inno 设置 我想为 Windows 启动时 MyAPP 自动启动创建一个复选框任务 我的代码如下 并且 如何编写下面的代码 DO Set AutoStart WhenWindowsStart Tasks Name StartMen
  • 使用 .Net 检测外部应用程序中的拖放操作

    我需要检测拖放操作外用 是否可以 我想到写一个钩子来检测这些操作 任何人都可以指出我可以尝试挂钩哪些消息或 api 函数来检测拖放事件的正确方向吗 我想用 C 来做这个 提前致谢 您可以通过两条明显的路径来尝试此操作 第一个是挂钩参与调解拖
  • 使用 Ruby OpenSSL 库时公钥无效

    我正在尝试在 Ruby 中生成 RSA 密钥对 主要使用来自这篇博文 http stuff things net 2009 12 11 generating rsa key pairs in ruby 这是我稍微修改过的代码 def gen
  • Java 中的匿名类是如何编译的?

    我听说 Java 字节码实际上不支持任何类型的未命名类 javac 如何将未命名的类转换为命名的类 它综合了形式的名称EnclosingClass n 其中 n 是匿名类的计数器EnclosingClass 因为使用 不鼓励使用标识符 这些
  • 让 Akka.NET 连接到远程地址

    我发现的所有演示如何开始在 Akka NET 中进行远程处理都演示了最简单的用例 其中两个参与者使用 localhost 在同一台计算机上运行 我试图让 Akka NET actor 连接到远程计算机 但遇到了一些困难 代码非常简单 客户端
  • AngularJS从base64生成二进制数据图像并作为图像文件发送到服务器

    我正在使用这个工具在我的 AngularJS 应用程序中裁剪图像 https github com fengyuanchen cropper https github com fengyuanchen cropper 然后我尝试将数据存储到