上传图片到服务器 对图片进行压缩

iPhone拍照 图片还是有点大    对图片不进行处理  上传到服务器  经查询一张图片大小约1.8M左右   

因为一次性可能要上传几十张图片   1.8M一张图片   这明显有点大了

忘记从哪位网友那看来的,不过我项目中使用了,经过处理后图片一张大约200k吧

图片压缩代码   

.h

#import <UIKit/UIKit.h>

@interface UIImage (lxy)

- (UIImage *)scaleToSize:(UIImage *)img size:(CGSize)size;

- (UIImage *)imageByScalingAndCroppingForSize:(CGSize)targetSize;
@end

.m

#import "UIImage+lxy.h"

@implementation UIImage (lxy)

- (UIImage *)scaleToSize:(UIImage *)img size:(CGSize)size{
    // 创建一个bitmap的context
    // 并把它设置成为当前正在使用的context
    UIGraphicsBeginImageContext(size);
    // 绘制改变大小的图片
    [img drawInRect:CGRectMake(0, 0, size.width, size.height)];
    // 从当前context中创建一个改变大小后的图片
    UIImage* scaledImage = UIGraphicsGetImageFromCurrentImageContext();
    // 使当前的context出堆栈
    UIGraphicsEndImageContext();
    // 返回新的改变大小后的图片
    return scaledImage;
}



- (UIImage*)imageByScalingAndCroppingForSize:(CGSize)targetSize
{
    UIImage *sourceImage = self;
    UIImage *newImage = nil;
    CGSize imageSize = sourceImage.size;
    CGFloat width = imageSize.width;
    CGFloat height = imageSize.height;
    CGFloat targetWidth = targetSize.width;
    CGFloat targetHeight = targetSize.height;
    CGFloat scaleFactor = 0.0;
    CGFloat scaledWidth = targetWidth;
    CGFloat scaledHeight = targetHeight;
    CGPoint thumbnailPoint = CGPointMake(0.0,0.0);
    
    if (CGSizeEqualToSize(imageSize, targetSize) == NO)
    {
        CGFloat widthFactor = targetWidth / width;
        CGFloat heightFactor = targetHeight / height;
        
        if (widthFactor > heightFactor)
            scaleFactor = widthFactor; // scale to fit height
        else
            scaleFactor = heightFactor; // scale to fit width
        scaledWidth  = width * scaleFactor;
        scaledHeight = height * scaleFactor;
        
        // center the image
        if (widthFactor > heightFactor)
        {
            thumbnailPoint.y = (targetHeight - scaledHeight) * 0.5;
        }
        else
            if (widthFactor < heightFactor)
            {
                thumbnailPoint.x = (targetWidth - scaledWidth) * 0.5;
            }
    }
    
    UIGraphicsBeginImageContext(targetSize); // this will crop
    
    CGRect thumbnailRect = CGRectZero;
    thumbnailRect.origin = thumbnailPoint;
    thumbnailRect.size.width  = scaledWidth;
    thumbnailRect.size.height = scaledHeight;
    
    [sourceImage drawInRect:thumbnailRect];
    
    newImage = UIGraphicsGetImageFromCurrentImageContext();
    if(newImage == nil){
    
    }
//        NSLog(@"could not scale image");
    
    //pop the context to get back to the default
    UIGraphicsEndImageContext();
    return newImage;
}


我在项目中的使用方法

#pragma mark---ImagePickerControllerDelegate---
- (void)imagePickerController:(UIImagePickerController *)picker didFinishPickingMediaWithInfo:(NSDictionary<NSString *,id> *)info{
    
    
    UIImage *image = [info valueForKey:UIImagePickerControllerOriginalImage];
    //通过判断picker的sourceType,如果是拍照则保存到相册去
    if (picker.sourceType == UIImagePickerControllerSourceTypeCamera) {
        UIImageWriteToSavedPhotosAlbum(image, self, @selector(image:didFinishSavingWithError:contextInfo:), nil);
    }
    
    
    CGSize size = image.size;
    if (size.width > 800) {
        
        size.height = size.height*800/size.width;
        size.width  = 800;
    } else if (size.width < 500) {
        size.width = 500;
        size.height = size.height;
    }
    
    image =  [[[UIImage alloc]init]scaleToSize:image size:size];
    
    
    
    SafeCheck *model = _dataArray[subNumber];
    [model.imageList addObject:image];
    _dataArray[subNumber] = model;
    
    
    
    NSString *title = model.imageList.count?[NSString stringWithFormat:@"已拍:%ld",(long)model.imageList.count]:@"拍照";
    [((SafeCheckCell *)[_mainTBV cellForRowAtIndexPath:[NSIndexPath indexPathForRow:subNumber inSection:0]]).photoBtn setTitle:title forState:UIControlStateNormal];

    [picker dismissViewControllerAnimated:NO completion:nil];
    
}

- (void)image:(UIImage *)image didFinishSavingWithError:(NSError *)error contextInfo:(void *)contextInfo {
    
}




  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
可以通过以下步骤使用 HTML 和 JavaScript 实现图片压缩并上传到服务器: 1. 在 HTML 文件中创建一个 input 元素,使用户可以选择要上传的图片文件: ```html <input type="file" id="file-input"> ``` 2. 使用 JavaScript 获取用户选择的图片文件,并将其转换为 base64 格式: ```javascript const fileInput = document.getElementById('file-input'); const file = fileInput.files[0]; const reader = new FileReader(); reader.readAsDataURL(file); reader.onload = function() { const base64Image = reader.result; }; ``` 3. 使用 JavaScript 创建一个 Image 对象,加载用户选择的图片文件,并在加载完成后将其绘制到一个 Canvas 上: ```javascript const img = new Image(); img.src = base64Image; img.onload = function() { const canvas = document.createElement('canvas'); const ctx = canvas.getContext('2d'); // 设置 Canvas 大小为图片大小 canvas.width = img.width; canvas.height = img.height; // 在 Canvas 上绘制图片 ctx.drawImage(img, 0, 0); // 获取 Canvas 上的压缩后的图片数据 const compressedImage = canvas.toDataURL('image/jpeg', 0.5); }; ``` 在这个例子中,我们将图片压缩为质量为 50% 的 JPEG 格式。 4. 创建一个 XMLHttpRequest 对象,将压缩后的图片数据作为请求体发送到服务器: ```javascript const xhr = new XMLHttpRequest(); xhr.open('POST', '/upload'); xhr.setRequestHeader('Content-Type', 'application/x-www-form-urlencoded'); xhr.send(`image=${encodeURIComponent(compressedImage)}`); ``` 在这个例子中,我们将压缩后的图片数据作为 image 参数发送到服务器。 完整的 HTML 和 JavaScript 代码如下: ```html <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>图片上传</title> </head> <body> <input type="file" id="file-input"> <button id="upload-btn">上传</button> <script> const fileInput = document.getElementById('file-input'); const uploadBtn = document.getElementById('upload-btn'); fileInput.addEventListener('change', function() { const file = fileInput.files[0]; const reader = new FileReader(); reader.readAsDataURL(file); reader.onload = function() { const base64Image = reader.result; const img = new Image(); img.src = base64Image; img.onload = function() { const canvas = document.createElement('canvas'); const ctx = canvas.getContext('2d'); // 设置 Canvas 大小为图片大小 canvas.width = img.width; canvas.height = img.height; // 在 Canvas 上绘制图片 ctx.drawImage(img, 0, 0); // 获取 Canvas 上的压缩后的图片数据 const compressedImage = canvas.toDataURL('image/jpeg', 0.5); uploadBtn.addEventListener('click', function() { const xhr = new XMLHttpRequest(); xhr.open('POST', '/upload'); xhr.setRequestHeader('Content-Type', 'application/x-www-form-urlencoded'); xhr.send(`image=${encodeURIComponent(compressedImage)}`); }); }; }; }); </script> </body> </html> ``` 请注意,这只是一个简单的示例,实际应用中还需要考虑更多的因素,例如图片大小限制、上传进度显示、错误处理等等。

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值