处理照片上传的最佳方式是什么?

I'm doing a website for a family member's wedding. A feature they requested was a photo section where all the guests could go after the wedding and upload their snaps. I said this was a stellar idea and I went off to build it.

我正在为一个家庭成员的婚礼做一个网站。他们要求的一个功能是一个照片区，所有宾客都可以在婚礼结束后去那里上传他们的照片。我说这是一个很好的想法，然后我就去做了。

Well there's just the one problem: logistics. Upload speeds are slow and photos from modern cameras are huge (2-5+Megs).

只有一个问题:物流。上传速度很慢，而且来自现代相机的照片也很大(2-5+Megs)。

I will only need ~800px wide images and some of them might require rotating so ideally I'm looking about using a client-side editor to do three things:

我只需要~800px宽的图像，其中一些可能需要旋转，所以理想情况下，我希望使用客户端编辑器来完成以下三件事:

Let users pick multiple files
让用户选择多个文件
Let them rotate some images so they're the right way up
让它们旋转一些图像，这样它们就会向上。
Resize them and then upload
调整大小，然后上传

And in my dream world, it'd be free and open source. Any ideas?

在我的梦想世界里，它是免费的，开源的。什么好主意吗?

Just a reminder: this is something the guests have to use. Some of them will be pretty computer savvy but others will be almost completely illiterate. Installing desktop apps isn't really an option. And I assume 98% of them have Flash and Java installed.

提醒一下:这是客人必须使用的东西。他们中的一些人会非常精通计算机，而另一些人则几乎完全不识字。安装桌面应用程序并不是一个好的选择。我假设其中98%都安装了Flash和Java。

Edit: I'd prefer a Flash/Java option over SilverLight, not least because it has a smaller install rate at the moment, but also because I'm on Linux and I'd like to test it =)

编辑:比起SilverLight，我更喜欢Flash/Java选项，不仅仅是因为它的安装速度更小，还因为我在Linux上，我想测试它=)

20 个解决方案

#1

The most common solution for this is a java applet, although most of them are not free. Examples:

最常见的解决方案是java applet，尽管大多数都不是免费的。例子:

http://www.jumploader.com/
http://www.jumploader.com/
http://www.aurigma.com/Products/ImageUploader/OnlineDemo.aspx
http://www.aurigma.com/Products/ImageUploader/OnlineDemo.aspx
http://www.javaatwork.com/java-upload-applet/details.html
http://www.javaatwork.com/java-upload-applet/details.html
JUpload, mentioned by ScArcher2
JUpload ScArcher2提到的

#2

I have had good luck with Gallery. It is free, open source, and has all the features you mentioned.

我在画廊有好运气。它是免费的、开源的，并且具有您提到的所有特性。

It will allow your users to upload photos without any intervention from you.

它将允许你的用户上传照片，而不需要你的任何干预。

#3

Another option could be to allow people to upload their photos to whatever service they're used to using (flickr, google, smugmug, or any other), and just accept a username for that service, or a URL for the folder.

另一种选择是允许人们上传他们的照片到他们习惯使用的任何服务(flickr，谷歌，smugmug，或任何其他服务)，并接受该服务的用户名，或者文件夹的URL。

Then you can have your application grab a copy of those pictures to store locally with a consistent interface.

然后，您可以让应用程序获取这些图片的副本，以便使用一致的接口在本地存储这些图片。

#4

I've used swfupload quite a bit. It's pretty awesome: http://www.swfupload.org/

我已经使用swfupload很多次了。很了不起的:http://www.swfupload.org/

#5

If you are doing this with Flash and using Flickr, then I would check out the AS3 Flickr library:

如果你用Flash和Flickr做这个，那么我会去看看AS3 Flickr库:

http://code.google.com/p/as3flickrlib/

which has support for uploading images.

支持上传图片。

Upload requires authentication. The library also contains a Flex based control for handling this:

上传需要身份验证。该库还包含一个基于Flex的控件来处理此问题:

http://www.mikechambers.com/blog/2008/08/12/flex-based-flickr-api-authorization-control/

(the rest of the library is ActionScript 3 and can be used in Flex or Flash.

库的其余部分是ActionScript 3，可以在Flex或Flash中使用。

Probably the easiest solution is to just have the images uploaded to Flickr, edited in Picnik (built into Flickr now), and then loaded onto the users site using either the Flickr RSS feeds or APIs:

可能最简单的解决方案是将图片上传到Flickr，在Picnik(现在内置在Flickr中)编辑，然后使用Flickr RSS提要或api将图片上传到用户站点:

http://www.flickr.com/help/picnik/

http://www.flickr.com/services/api/

hope that helps...

希望这有助于……

mike chambers

迈克•钱伯斯

mesh@adobe.com

#6

I'd use an applet. You could do the resizing of the pictures and rotating on the client side.

我使用一个applet。你可以调整图片的大小并在客户端旋转。

It looks like JUpload may do this for you.

看起来JUpload可以为你做这个。

#7

Picasa is a pretty great/free photo management app. It let's you do some pretty impressive editing, and has upload capabilities, though I can't remember if it will upload to anywhere, or just certain popular sites (like Flickr).

Picasa是一款非常棒的免费照片管理应用。它让你做了一些令人印象深刻的编辑，并且有上传功能，尽管我不记得它会不会上传到任何地方，或者只是某些流行的网站(比如Flickr)。

#8

You could use Silverlight or Flash or some custom plugin to allow managed uploads, where you can display a progress bar for example. There isn't much you can do about upload speeds but you can at least show them progress while it's going on.

您可以使用Silverlight或Flash或一些自定义插件来允许托管上传，例如，您可以在其中显示进度条。对于上传速度，你无能为力，但至少可以在上传过程中向他们展示自己的进展。

I don't know of any canned upload programs you can use but it shouldn't be too hard to make one (unless you don't know Flash or Silverlight).

我不知道有什么罐头上传程序你可以使用，但它应该不会太难做一个(除非你不知道闪光灯或Silverlight)。

#9

How about using PhotoShop Online It allows you to edit photos with a web based editor and offers 2GB of storage. I've not used it myself so don't know if it allows for multiple users to access the same account though

如何使用PhotoShop Online它允许你使用基于web的编辑器编辑照片，并提供2GB的存储空间。我自己没有使用过，所以不知道它是否允许多个用户访问同一个帐户

#10

Out of curiosity, on what web stack is this to run? LAMP? 2k3+IIS? etc etc? Many of the open source solutions out there are cross-platform but others are not...

出于好奇，该在哪个web堆栈上运行?灯吗?2 k3 + IIS吗?等等?很多开源解决方案都是跨平台的，但是其他的却不是。

#11

Is E-mailing the photo in an available option?

是否可以通过电子邮件发送照片?

Most people who want to share photos probably already know how to send photos in email. And most email clients has already solved the problems of file uploading.

大多数想要分享照片的人可能已经知道如何用电子邮件发送照片了。大多数的邮件客户端已经解决了文件上传的问题。

Just setup one gmail/whatevermail account and have your website poll the inbox.

只需设置一个gmail/whatevermail帐户，让你的网站在收件箱中投票。

It's something like what TwitPic does for twitter but your requirements seem to be more simpler than that.

这就像TwitPic在twitter上做的一样，但是你的要求似乎比这要简单得多。

#12

Personally most users don't understand DPI and their images even trimmed down end up larger than the php.ini for most hosting companies allow.

就个人而言，大多数用户不理解DPI，他们的图像甚至被修剪得比php还要大。对于大多数托管公司，ini允许。

I'm not sure how much control you want to give them or how you want the public side to behave.

我不知道你想给他们多大的控制权，也不知道你想让公众如何行事。

I'd suggest using a dropbox FTP application such as http://etonica.com/dropbox/index.html (tango dropbox) It's free to your clients and you only have to pay for your version so you can set up the FTP information and secure it.

我建议使用dropbox FTP应用程序，比如http://etonica.com/dropbox/index.html (tango dropbox)，这对客户是免费的，你只需要为你的版本付费，这样你就可以设置FTP信息并保护它。

I'd have them download something link paint.net (which is FREE) have them edit the photos to the proper size and then just drag and drop them to this application. it's easy and doesn't require php.ini to be modified.

我会让他们下载链接paint.net(免费的)，让他们把照片编辑成合适的大小，然后拖拽到这个应用程序。它很简单，不需要php。ini要修改。

You could also use something like slideshowpro's director application.

您还可以使用slideshowpro的director应用程序。

#13

I completly agree with zigdon, allow different sites, but only pick up photos from the web. I you still want to allow uploads, and put a cap on size.

我完全同意zigdon的观点，允许不同的网站，但只从网上获取照片。我，你还是想允许上传，给大小设置一个上限。

Now, if you want to throw yourself into something big, I would suggest putting a cap on size, and then using JQuery (or other library) to work with the images.

现在，如果您想让自己投入一些大的事情，我建议您设置一个大小的上限，然后使用JQuery(或其他库)来处理图像。

Just my 2 cents

只是我2美分

#14

You could also have them email the pictures to picasa. Picasa web has a feature where you can send images to a "secret" email that will post them to a picasa account. Set up a picasa account, distribute the "secret" email, and wait for all the pictures to show up.

你也可以让他们把照片发邮件给picasa。Picasa web有一个功能，可以将图片发送到“秘密”电子邮件，并将其发送到Picasa帐户。设置一个picasa帐户，分发“秘密”邮件，等待所有的图片出现。

#15

Going the Flickr route is easy and will work well.

使用Flickr很容易，也会很好地工作。

If you want to go more advanced, I'd recommend snipshot or picknik (Flickr uses it). Both are free to use and have APIs to use.

如果你想更进一步，我推荐snipshot或picknik (Flickr使用它)。两者都是免费使用的，并且都有api可以使用。

#16

I am currently required to implement the similar requirement as Oli.

我目前需要执行与Oli相似的要求。

I believe Facebook.com use java applet of some sort, and it work pretty well but I am not sure if the applet available as OSS. I am going to look into JUpload suggested by ScArcher2.

我相信Facebook.com使用了某种类型的java applet，它运行得很好，但我不确定该applet是否可用作OSS。我将研究ScArcher2提出的JUpload。

If you guy no of any other good applet please keep it coming.

如果你没有任何其他好的小程序，请继续。

#17

I'd highly suggest using FileBrowser by Lussomo. It's as easy as 'drag and drop' :D

我强烈建议使用Lussomo的FileBrowser。它就像‘拖放’一样简单:D

I've used it for my game development team where we had a raw dump of over 200 concept art images, and we simply extracted FileBrowser to a PHP-enabled webserver and dumped the images in appropriate directories (1 per album), and ran the thumbnailing script. It handles cropping of the images, and optimizing their size for you. So much better than using something like Menalto Gallery where you have to upload them through an awkward upload interface.

我已经在我的游戏开发团队中使用了它，在那里我们有超过200个概念艺术图像的原始转储，我们简单地将FileBrowser提取到启用php的webserver中，并将图像转储到适当的目录中(每个相册1个)，并运行缩略图脚本。它处理图像的裁剪，并为您优化它们的大小。比使用像Menalto Gallery这样的东西要好得多，你必须通过一个笨拙的上传界面上传。

#18

Try this out http://www.lunarvis.com/products/tinymcefilebrowserwithupload.php

试试这个http://www.lunarvis.com/products/tinymcefilebrowserwithupload.php

#19

Depends on the web server. If you can use servlets, try this :

取决于web服务器。如果您可以使用servlet，请尝试以下操作:

// UploadServlet.java : Proof of Concept - Mike Smith March 2006
// Accept a file from the client, assume it is an image, rescale it and save it to disk for later display
import javax.servlet.http.*;
import javax.imageio.*;
import java.io.*;
import java.util.*;
import java.sql.*;
import org.apache.commons.fileupload.*;
import org.apache.commons.fileupload.disk.*;
import org.apache.commons.fileupload.servlet.*;
import java.awt.image.*;
import java.awt.*;

public class UploadServlet extends HttpServlet  {

public static void printHeader(PrintWriter pw)  {
    pw.println("<HEAD><TITLE>Upload Servlet</TITLE><HEAD>");
    pw.println("<BODY>");
}

public static void printTrailer(PrintWriter pw)  {
    pw.println("<img src=\"../images/poweredby.png\" align=left>");
    pw.println("<img src=\"../images/tomcat-power.gif\" align=right>");
    pw.println("</BODY></HTML>");
}


public void init()  {  // Servlet init() : called when the servlet is LOADED (not when invoked)
}

public void service(HttpServletRequest req, HttpServletResponse res)   throws IOException {
    DiskFileItemFactory dfifact;
    ServletFileUpload sfu; 
    java.util.List items;
    Iterator it;
    FileItem fi;
    String field, filename, contype;
    boolean inmem, ismulti;
    long sz;
    BufferedImage img;
    int width, height, nwidth, nheight, pixels;
    double scaling;
    final int MAXPIXELS = 350 * 350;

    res.setContentType("text/html");
    PrintWriter pw = res.getWriter();
    printHeader(pw);

    ismulti = FileUpload.isMultipartContent(req);
    if (ismulti)  {
        pw.println("Great! Multipart detected");
        dfifact = new DiskFileItemFactory(999999, new File("/tmp"));
        sfu = new ServletFileUpload(dfifact);
        try  {
            items = sfu.parseRequest(req);
        } catch (FileUploadException e)  {
            pw.println("Failed to parse file, error [" + e  + "]");
            printTrailer(pw);
            pw.close();
            return;
        }
        it = items.iterator();
        while (it.hasNext())  {
            fi = (FileItem) it.next();
            if (fi.isFormField())  {
                pw.println("Form field [" + fi.getFieldName() + "] value [" + fi.getString() + "]");
            }
            else  {  // Its an upload
                field = fi.getFieldName();
                filename = fi.getName();
                contype = fi.getContentType();
                inmem = fi.isInMemory();
                sz = fi.getSize();
                pw.println("Upload field=" + field + " file=" + filename + " content=" + contype + " inmem=" + inmem
                    + " size=" + sz);
               InputStream istream = fi.getInputStream();
               img = ImageIO.read(istream);
               nwidth = width = img.getWidth();
               nheight = height = img.getHeight();
               pixels = width * height;
               if (pixels > MAXPIXELS)  {
                   scaling = Math.sqrt((double) MAXPIXELS / (double) pixels);
                   nheight = (int) ((double) height * scaling);
                   nwidth = (int) ((double) width * scaling);
               }
               BufferedImage output = new BufferedImage(nwidth, nheight, BufferedImage.TYPE_3BYTE_BGR);
               Graphics2D g = output.createGraphics();
               g.setRenderingHint(RenderingHints.KEY_INTERPOLATION, RenderingHints.VALUE_INTERPOLATION_BILINEAR);
               g.drawImage(img, 0, 0, nwidth, nheight, null);
               ImageIO.write(output, "jpeg", new File("/var/tomcat/webapps/pioneer/demo.jpg"));
               istream.close(); 
            }
        }
    }
    else
        pw.println("Bugger! Multipart not detected");
        printTrailer(pw);
        pw.close();
}

public void destroy()  {
}
}

#20

-1

GIMP (http://www.gimp.org/) is a good tool for doing resize and is open source.

GIMP (http://www.gimp.org/)是进行调整大小的好工具，并且是开源的。

#1