一个用于将文件以multipart/form-data格式上传到iOS和Android服务器的NativeScript插件。需要NS 6.1.0及以上版本。如果您安装了较旧的NS平台版本，请使用旧版本。

版本

[3.1.1] 修复了构建问题。感谢 NathanWalker

[3.0.0] 升级到NS 8.0.0。感谢 Fr3nky88

[2.1.0] 升级到NS 6.3.0。修复了Kotlin问题。更多 信息

[2.0.0] 升级到NS 6.2.0。修复了Kotlin问题。更多 信息

[1.6.0] 在iOS和Android中添加了常见的响应，而不是由本地API返回。感谢 virtualbjorn

[1.5.0] 现在支持自定义头部

添加插件

tns plugin add nativescript-http-formdata

依赖项

TypeScript

import { TNSHttpFormData, TNSHttpFormDataParam, TNSHttpFormDataResponse } from 'nativescript-http-formdata';

使用ImagePicker插件或其他任何插件。https://github.com/NativeScript/nativescript-imagepicker

    private test() {
        let context = imagepicker.create({
            mode: "single" // use "multiple" for multiple selection
        });
        context.authorize()
        .then(function() {
            return context.present();
        })
        .then((selection) => {
          let item = selection[0];
          //UIImage for iOS and android.graphics.Bitmap for Android
          item.getImageAsync(async (image, error) => {
            let fd = new TNSHttpFormData();
    
            //create params. You can upload an array of params i.e multiple data. For every parameter you need to give unique name
            //so you can get it on server. Check below how to grab it in ASP.Net MVC
            let params = [];
            let imageData: any;
            
            if(!image) {
                throw 'Could not get image';
            }

            if(image.ios) {
                imageData = UIImagePNGRepresentation(image);
            } else {
                //can be one of these overloads https://square.github.io/okhttp/3.x/okhttp/okhttp3/RequestBody.html
                let bitmapImage: android.graphics.Bitmap = image;
                let stream = new java.io.ByteArrayOutputStream();
                bitmapImage.compress(android.graphics.Bitmap.CompressFormat.PNG, 100, stream);
                let byteArray = stream.toByteArray();
                bitmapImage.recycle();

                imageData = byteArray;
            }
            let param: TNSHttpFormDataParam = {
                data: imageData,
                contentType: 'image/png',
                fileName: 'test.png',
                parameterName: 'file1'
            };
            params.push(param);
            let param2: TNSHttpFormDataParam = {
              data: "John Doe",
              parameterName: "firstName"
            };
            params.push(param2);

            console.log('submitting', params);
    
            try { 
                const response: TNSHttpFormDataResponse = await fd.post('http://10.10.10.149:10025/home/fileupload', params, {
                    headers: {
                        test1: "test1 value",
                        "x-version-no": "2.0"
                    }
                });
                console.log(response);
            } catch (e) {
                console.log('---------------home.component.ts---------------');
                console.log(e);
            }
          });
        }).catch(function (e) {
            console.log('-------------------error----------------')
            console.log(e);
        });
    }

现在在服务器上抓取文件（在ASP.Net MVC中），您可以参考 https://stackoverflow.com/a/16256106/859968 或以下

[HttpPost]
//file1 and file2 are parameters name as given in NativeScript object. They must match
public ActionResult FileUpload(HttpPostedFileBase file1, HttpPostedFileBase file2, string firstName)
{
    //grab your headers
    var headers = Request.Headers;
    if (file1 != null)
    {
        string pic = System.IO.Path.GetFileName(file1.FileName);
        string path = System.IO.Path.Combine(Server.MapPath("~/App_Data"), pic);
        // file is uploaded
        file1.SaveAs(path);
    }
    if (file2 != null)
    {
        string pic = System.IO.Path.GetFileName(file2.FileName);
        string path = System.IO.Path.Combine(Server.MapPath("~/App_Data"), pic);
        // file is uploaded
        file2.SaveAs(path);
    }

    // after successfully uploading redirect the user
    return RedirectToAction("Index", "Home");
}

TNSHttpFormDataResponse 属性

• headers - 响应头
• statusCode - HTTP状态码（数字）
• statusMessage - HTTP状态码消息（字符串）
• body - 响应体（如果是JSON则解析，否则为原始字符串）

捐赠

捐赠不会让我变得富有，但您的感激让我很高兴 😁