【问题标题】:how to upload image with form data with ionic angular.js如何使用 ionic angular.js 上传带有表单数据的图像
【发布时间】:2016-09-05 17:12:03
【问题描述】:

您好,我正在尝试为我的移动应用程序上传带有 ionic angular.js 中其余表单数据的图像。我正在使用 ngCordova 插件。但没有找到该过程的任何文件。

示例: 我在此表格中有注册表,必须输入他的详细信息并上传个人资料图片。但作为示例,我无法在一个请求中将所有数据发送到服务器。

谢谢

【问题讨论】:

    标签: angularjs ionic-framework image-uploading ngcordova image-upload


    【解决方案1】:

    尝试为此使用 $cordovaFileTransfer。具体实现描述在这里:Upload image to server angularjs

    您可以从本地存储上传图像或使用相机插件拍摄的图像。

    【讨论】:

      【解决方案2】:

      要使用 Ionic 2 框架将图像上传到服务器,您必须使用 Transfer 插件。使用安装传输插件

      ionic plugin add cordova-plugin-file-transfer npm install --save @ionic-native/transfer

      然后调用 Transfer 类的上传函数。

      const fileTransfer: TransferObject = this.transfer.create();
      
        let options1: FileUploadOptions = {
           fileKey: 'file',
           fileName: 'name.jpg',
           headers: {}
      
        }
      
       fileTransfer.upload(imageDataLocalURL, 'http://localhost/ionic/upload.php',  options1)
      .then((data) => {
       // success
       alert("success");
      }, (err) => {
       // error
       alert("error"+JSON.stringify(err));
      });
      

      使用链接了解更多https://ampersandacademy.com/tutorials/ionic-framework-version-2/upload-an-image-to-the-php-server-using-ionic-2-transfer-and-camera-plugin

      2018 年 2 月 26 日更新

      对于 Ionic 3,文件传输插件有一些变化。

      安装文件传输插件

      ionic cordova plugin add cordova-plugin-file-transfer npm install --save @ionic-native/file-transfer

      并且类在 Ionic 版本 3 中从 Transfer 重命名为 FileTransfer。

      import { FileTransfer, FileUploadOptions, FileTransferObject } from '@ionic-native/file-transfer';

      如需完整演示,请访问以下链接。

      https://ampersandacademy.com/tutorials/ionic-framework-3/upload-image-to-the-php-server-using-ionic-3-file-transfer-and-camera-plugin

      【讨论】:

        猜你喜欢
        • 1970-01-01
        • 1970-01-01
        • 2018-08-22
        • 2018-09-03
        • 2015-12-15
        • 1970-01-01
        • 2017-03-22
        • 1970-01-01
        • 1970-01-01
        相关资源
        最近更新 更多