使用多方将图像从 ipad 应用程序上传到节点 js 服务器

Posted

技术标签:

【中文标题】使用多方将图像从 ipad 应用程序上传到节点 js 服务器【英文标题】:upload image from ipad app to node js server using multiparty 【发布时间】:2015-04-05 22:30:21 【问题描述】:

我对 javascript 和 node js 非常陌生。 我正在使用多方模块将图像从我的 iPad 应用程序上传到 node js(express js)的 rest api。

这是我在目标 c 中的图像上传代码。

NSData *imgData = UIImageJPEGRepresentation(img.image, 0.2);
NSString *urlString = @"http://localhost:3000/api/uploadimage";
NSString *str = @"displayImage";

NSMutableURLRequest *request = [[NSMutableURLRequest alloc] init];
[request setCachePolicy:NSURLRequestReloadIgnoringLocalCacheData];
[request setHTTPShouldHandleCookies:NO];
[request setTimeoutInterval:30];
[request setURL:[NSURL URLWithString:urlString]];

[request setHTTPMethod:@"POST"];

NSString *boundary = [NSString stringWithFormat:@"---------------------------14737809831464368775746641449"];

NSString *contentType = [NSString stringWithFormat:@"multipart/form-data; boundary=%@", boundary];
[request setValue:contentType forHTTPHeaderField: @"Content-Type"];

NSMutableData *body = [NSMutableData data];

[body appendData:[[NSString stringWithFormat:@"\r\n--%@\r\n", boundary] dataUsingEncoding:NSUTF8StringEncoding]];
[body appendData:[[NSString stringWithFormat:@"Content-Disposition: form-data; name=\"currentEventID\"\r\n\r\n"] dataUsingEncoding:NSUTF8StringEncoding]];
[body appendData:[@"52344457901000006" dataUsingEncoding:NSUTF8StringEncoding]];

if (imgData) 
    [body appendData:[[NSString stringWithFormat:@"\r\n--%@\r\n", boundary] dataUsingEncoding:NSUTF8StringEncoding]];
    // [body appendData:[NSString stringWithFormat:@"Content-Disposition: form-data; name=\"displayImage\"; filename=\"myimage.jpg\"\r\n"]];
    [body appendData:[[NSString stringWithFormat:@"Content-Disposition: form-data; name=\"%@\"; filename=\"myimage.jpg\"\r\n", str] dataUsingEncoding:NSUTF8StringEncoding]];

    [body appendData:[@"Content-Type: image/jpeg\r\n\r\n" dataUsingEncoding:NSUTF8StringEncoding]];
    [body appendData:imgData];
    [body appendData:[[NSString stringWithFormat:@"\r\n"] dataUsingEncoding:NSUTF8StringEncoding]];



[body appendData:[[NSString stringWithFormat:@"\r\n--%@--\r\n", boundary] dataUsingEncoding:NSUTF8StringEncoding]];
[request setHTTPBody:body];

[request setURL:[NSURL URLWithString:urlString]];  
NSLog(@"HttpBody = %@",request.HTTPBody);
connectionSave =  [[NSURLConnection alloc] initWithRequest:request delegate:self];

请求正文数据打印在控制台上。

为了在服务器端获取图像,我指的是这个例子。 [https://github.com/strongloop/express/blob/master/examples/multipart/index.js][1]

在这个例子中,他们正在创建 var form = new multiparty.Form();在 post 方法中。 但是我是从应用程序而不是浏览器发送图像,所以我没有任何定义输入类型的表单。如何编写此 REST API 来获取图像和其他字符串参数?

var express = require('express');
var http = require('http');
var util = require('util')
var multiparty = require('multiparty');

var app = express();
var bodyParser = require('body-parser');

app.use(bodyParser.urlencoded(
    extended: true
));

app.use(bodyParser.json());

app.use(bodyParser.urlencoded(limit:'10mb', extended: true));
app.use(bodyParser.json(limit:'10mb')); 

app.post('/api/uploadimage', function(req, res, next)
    var form = new multiparty.Form();

    console.log(req.body);
);

我的 req.body 也变空了。 提前致谢!! :)

【问题讨论】:

我不能说 node.js 的东西,但你似乎确实在添加 imgData 之后和最后一个“--(边界)- 之前添加了一个额外的 \r\n ——”终结者。我的理解是,在有效负载和下一个边界分隔符之后只需要一个 \r\n。 谢谢,但我认为这不会造成任何问题 :) 但是有一个问题:您在文件末尾不必要地添加了两个字节 0d 0a。事实证明,大多数图像例程都会忽略这些额外的字节,但这样做是不正确的。 你是对的。我删除了多余的\r\n。 【参考方案1】:

您的目标代码看起来很完美。 您需要使用 connect-multiparty 模块。 这是保存文件的示例代码。

    app.post('/api/uploadimage', multipartMiddleware, function(req, res) 
         console.log(req.body, req.files); // check console 

    fs.readFile(req.files.urForm-data_name.path, function (err, data) 
            //here get the image name and other data parameters which you are sending like image name etc.
           fs.writeFile(newPath, data, function (err) 
          );
   //dont forgot the delete the temp files.
        );
     );

【讨论】:

谢谢。我正在处理它,我能够在临时位置找到文件。再次感谢! 如何删除临时文件? @茉莉花 @ChenyaZhang 你可以使用 fs.unlink(临时文件路径)【参考方案2】:

我不知道ios代码是对是错,但是在nodejs的情况下,你应该使用multiparty作为中间件,你可以使用connect-multiparty

var multipart = require('connect-multiparty');
var multipartMiddleware = multipart();
app.use(require('body-parser').urlencoded(
    extended: true
))
app.post("/api/upload", multipartMiddleware, function(req, res)
    files = req.files;
    // Do ....
);

【讨论】:

以上是关于使用多方将图像从 ipad 应用程序上传到节点 js 服务器的主要内容,如果未能解决你的问题,请参考以下文章

MonoTouch - 上传/保存图像(或访问图库图像)

如何使用节点、createPresignedPost 和 fetch 将图像文件直接从客户端上传到 AWS S3

如何使用来自iPhone应用程序的SOAP请求将图像+ xml上传到Web服务器

如何在节点中使用 multer 将图像上传到 cloudinary 并与其他数据一起表达

将图像文件从 IOS 上传到 Web 服务器

如何在没有表单的情况下将图像上传到节点 js 服务器?