在WinJS中将位图流转换为jpeg图像

时间:2013-07-02 15:05:34

标签: javascript windows-store-apps winjs

我正在尝试使用我的应用中的剪贴板功能实现上传图片,代码如下:

var clipboard = Windows.ApplicationModel.DataTransfer.Clipboard.getContent();

            if (clipboard.contains(Windows.ApplicationModel.DataTransfer.StandardDataFormats.bitmap)) {
                clipboard.getBitmapAsync().done(function (stream) {
                    stream.openReadAsync().then(function (bitmapStream) {
                       //TODO
                    });

                });

                return;
            }

有效,我可以上传,但只能作为位图。 我想要实现的是将图像上传为jpeg。 我知道我可以使用canvas元素将位图转换为jpeg,但还有其他方法吗? 也许来自http://msdn.microsoft.com/en-us/library/windows/apps/windows.graphics.imaging的东西?

1 个答案:

答案 0 :(得分:1)

经过几次试验,我找到了解决方案,代码如下。不漂亮但工作正常,将位图从剪贴板转换为png / jpeg,并将文件上传到服务器(这里几乎没有ajax请求)。 希望它能帮助有类似问题的人。

if (clipboard.contains(Windows.ApplicationModel.DataTransfer.StandardDataFormats.bitmap)) {
    clipboard.getBitmapAsync().done(function(bitmap) {
        bitmap.openReadAsync().then(function(bitmapStream) {
            Windows.Graphics.Imaging.BitmapDecoder.createAsync(bitmapStream).then(function(decoder) {
                decoder.getPixelDataAsync().then(function(pixelDataProvider) {
                    var pixels = pixelDataProvider.detachPixelData();
                    var memoryStream = new Windows.Storage.Streams.InMemoryRandomAccessStream();

                    Windows.Graphics.Imaging.BitmapEncoder.createAsync(Windows.Graphics.Imaging.BitmapEncoder.pngEncoderId, memoryStream).then(function(encoder) {
                        encoder.setPixelData(decoder.bitmapPixelFormat, Windows.Graphics.Imaging.BitmapAlphaMode.ignore,
                                            decoder.orientedPixelWidth, decoder.orientedPixelHeight, decoder.dpiX, decoder.dpiY, pixels);

                        encoder.flushAsync().then(function() {
                            var fileName = 'screenshot_' + moment().format('MMDDYYYY_HHmm') + '.png';
                            var imageblob = MSApp.createBlobFromRandomAccessStream('image/png', memoryStream);

                            var formData = new FormData();
                            formData.append('upload', imageblob, imageName);
                        });
                   });
                });
           });
         });
  });
}