Télécharger et rogner l'image avant de l'envoyer au serveur

Est-il des composants client (jquery/swf) qui donnera la possibilité à la télécharger et de la culture (l'utilisateur doit être en mesure de sélectionner la zone à découper) une image dans le navigateur, puis envoyer l'image recadrée pour le serveur?

Je suis sur asp.net mvc (je ne sais pas si c'est important)

InformationsquelleAutor Omu | 2010-04-29
  1. 20

    jcrop

    Jcrop est la manière rapide et facile d'ajouter un recadrage de l'image des fonctionnalités à votre application web. Il combine la facilité d'utilisation typique d'un plugin jQuery avec un puissant multi-plateforme DHTML recadrage moteur qui est fidèle aux familiers de bureau applications graphiques.

    • J'avais second de cette. Voir towardsnext.wordpress.com/2009/04/13/... pour un tutoriel en utilisant dans MVC.
    • oui jcrop est bon pour le recadrage, mais vous devez télécharger l'intégralité de l'image avant de la recadrer, je voudrais savoir si il y a quelque chose qui va recadrer l'image sur le client avant de l'envoyer au serveur
    • Recadrage côté client aurait besoin d'une sorte de plugin comme Flash ou Silverlight (vous ne pouvez pas le faire via JavaScript).
    • Diplo, je suis ok avec Flash, est-il quelque chose de fait en Flash pour ce but ?
    • voir ce post stackoverflow.com/questions/2008836/... j'Espère que ça aide?
    InformationsquelleAutor CD..
  2. 9

    La Jcrop Plugin Image pourrait être bon à l'affichage de la délibération de l'INTERFACE utilisateur et l'obtention de la rognée coordonnées dans le navigateur. Cependant, il ne fait pas culture l'image. Par conséquent, le processus de découpage se fait sur le serveur, ce qui est assez mauvais pour les performances du serveur.

    La réponse ici introduit un Jcrop extension des cultures de l'image dans le navigateur et téléchargements
    le recadrée image sur le serveur. "Il utilise Jcrop plugin pour recadrer les images, attire la zone recadrée dans le HTML 5 canvas, convertit la toile à un blob et télécharge le fichier image sur le serveur en AJAX".

    La partie la plus importante est la canvasToBlob fonction qui convertit le HTML 5 canvas à un type Blob qui peut être téléchargé sur le serveur en tant qu'images. Malheureusement, cette méthode fonctionne uniquement en AJAX et ne peut pas soumettre un formulaire directement, parce que la goutte ne peut pas être mis dans le standard de l'élément de formulaire HTML comme un fichier d'entrée. En réalité, nous avons rarement utiliser le formulaire pour envoyer les images directement lors du cadrage d'eux.

    • Bon travail point pour la bonne réponse mais juste un lien sans votre contribution n'est pas une réponse meilleure mise à jour de votre réponse pour ajouter des détails ou ajouter comme commentaire à la question et supprimer cette réponse
    InformationsquelleAutor
  3. 4

    Vous avez besoin de combiner un recadrage de l'INTERFACE utilisateur avec un uploader pour effectuer cette tâche complexe. Le recadrage de l'INTERFACE utilisateur est responsable de l'affichage du recadrage de l'INTERFACE utilisateur et de donner le recadrage coordonnées, et l'uploader cultures & redimensionne l'image, de les convertir en un blob et l'envoyer à un serveur.

    Le recadrage de l'INTERFACE utilisateur est commune, mais les uploader est dur à trouver. Je recommande le recadrage de l'INTERFACE utilisateur ImgAreaSelect qui est facile à utiliser et ce Uploader qui est simple et extensible, mais il n'est pas libre.

    InformationsquelleAutor