2009-05-29 6 views
7

クイックバージョン:FlashからASP.NETにイメージを渡すにはどうすればよいですか?

ユーザーのブラウザで生成されたイメージをサーバーに戻すにはどうすればよいですか?

現在の計画はこれです:

  1. Flash開発者は、彼はその後、サイトのページにJPEGを掲載する予定JPEG
  2. にビットマップを変換します。
  3. 私はを使って投稿を読んでファイルとして保存するWebServiceを作成できると思っています。

これは機能しますか?これを行うための既存のコード/サンプルはありますか?

私はASP.NETにファイルをアップロードするためのコードを見ることができるはずです。

+0

これはAS2かAS3ですか? –

+0

これはAS3になります。 – EfficionDave

答えて

13

この例では、ステージ上にボタン付きのFlashファイルを作成しました。そのボタンをクリックすると、FlashはそのボタンのイメージをASPXファイルに送信し、そのファイルをJPEGとして保存します。これは、DisplayObjectBitmapDataオブジェクトに描画することによって行われているため、ボタンへの参照をDisplayObject(ペイントアプリケーションなどのキャンバスを含むムービークリップを含む)から継承するものに簡単に置き換えることができます。 。

最初にFlash要素を、次に.NETバックエンドを順を追って説明します。

フラッシュ

フラッシュからASP.NETには、このような生成された画像(またはその他のバックエンド)を送信するには、サードパーティのライブラリのカップルを必要とするつもりです。私たちには、AS3コアライブラリhttp://code.google.com/p/as3corelib/から入手できるJPEGエンコーダ(Flashにはないが、最近のバージョンのFlex)が必要です。また、ワイヤを介してデータを送信するためのBase64エンコーダが必要です。 Dynamic Flashのものを使用します(http://dynamicflash.com/goodies/base64/)。

これらのファイルをダウンロードして、ハードディスク(C:\ libフォルダなど)のどこかに分かりやすくしてください。

新しいAS3フラッシュファイルを作成し、uploader.flaという名前で保存しました。ステージにボタンコンポーネントを追加し、と名付けました。btnUpload。次に、ActionScriptの設定を編集し、c:\ libフォルダをクラスパスに追加しました。次に、ドキュメントにクラス名Uploaderを渡してファイルを保存しました。

次に、私は、ActionScriptファイルを作成し、そこに次のコードを追加しました:

package 
{ 
    import flash.display.BitmapData; 
    import flash.display.MovieClip; 
    import flash.events.MouseEvent; 
    import flash.net.URLLoader; 
    import flash.net.URLRequest; 
    import flash.net.URLRequestMethod; 
    import flash.net.URLVariables; 
    import flash.utils.ByteArray; 
    import fl.controls.Button; 
    import com.adobe.images.JPGEncoder; 
    import com.dynamicflash.util.Base64; 


    public class Uploader extends MovieClip 
    { 
     // Reference to the button on the stage 
     public var btnUpload:Button; 

     // Encoder quality 
     private var _jpegQuality:int = 100; 

     // Path to the upload script 
     private var _uploadPath:String = "/upload.aspx"; 

     public function Uploader() 
     { 
      btnUpload.addEventListener(MouseEvent.CLICK, buttonClick); 
     } 

     private function buttonClick(e:MouseEvent):void 
     { 
      // Create a new BitmapData object the size of the upload button. 
      // We're going to send the image of the button to the server. 
      var image:BitmapData = new BitmapData(btnUpload.width, btnUpload.height); 

      // Draw the button into the BitmapData 
      image.draw(btnUpload); 

      // Encode the BitmapData into a ByteArray 
      var enc:JPGEncoder = new JPGEncoder(_jpegQuality); 
      var bytes:ByteArray = enc.encode(image); 

      // and convert the ByteArray to a Base64 encoded string 
      var base64Bytes:String = Base64.encodeByteArray(bytes); 

      // Add the string to a URLVariables object 
      var vars:URLVariables = new URLVariables(); 
      vars.imageData = base64Bytes; 

      // and send it over the wire via HTTP POST 
      var url:URLRequest = new URLRequest(_uploadPath); 
      url.data = vars; 
      url.method = URLRequestMethod.POST; 

      var loader:URLLoader = new URLLoader(); 
      loader.load(url); 
     } 
    } 
} 

私は名前Uploader.asでFLAの隣にこのファイルを保存しました。

SWFを自分のAsp.NET Webサイトのルートに公開しました。 このコードでは、100%の品質でjpegをアップロードし、データを受け取るスクリプトはupload.aspxと呼ばれ、サイトのルートに配置されていることを前提としています。私はupload.aspxという名前のWebフォームを作成し、私のウェブサイトのルートで

ASP.NET

。 .aspxファイルでは、私はページディレクティブとは別にすべてのコンテンツを削除しました。な保存パスとしてハードコードされた値は明らかにあります

using System; 
using System.IO; 

public partial class upload : System.Web.UI.Page 
{ 
    protected void Page_Load(object sender, EventArgs e) 
    { 
     // Get the data from the POST array 
     string data = Request.Form["imageData"]; 

     // Decode the bytes from the Base64 string 
     byte[] bytes = Convert.FromBase64String(data); 

     // Write the jpeg to disk 
     string path = Server.MapPath("~/save.jpg"); 
     File.WriteAllBytes(path, bytes); 

     // Clear the response and send a Flash variable back to the URL Loader 
     Response.Clear(); 
     Response.ContentType = "text/plain"; 
     Response.Write("ok=ok"); 
    } 
} 

が、これから次のことができるようにすべきである:分離コードで次に

<%@ Page Language="C#" AutoEventWireup="true" CodeFile="upload.aspx.cs" Inherits="upload" %> 

、私は次のように追加しました:それはこのようなコンテンツを見です必要なシステムを作成します。

+0

,, dynamicflash.comからBase64エンコーダをダウンロードするために提供したリンクは動作していないようです。いくつかの代替オプションを提案できますか?ありがとうございます。 – freebird

+0

@freebird "ActionScript Base64エンコーダ"はGoogleでしたか?最近AS3に組み込まれているようです... –

+0

,,,私はwww.sociodox.comからダウンロードしました。 – freebird

0

彼に標準HTMLフォームのようなファイルを投稿させてもらいましたか?あなたは、これは単なるするFileUploadコントロールが何をするかのようにHttpPostedFilesのコレクションを返します

次のコレクションを使用して、彼はに投稿されたページのPage_Loadイベントに

Request.Filesをそれらのファイルにアクセスすることができます。

1

画像を操作する必要がある場合は、POSTされたファイルのバイト[]またはストリームを取得できる限り、画像を作成することができます。

+0

イメージをmyImageに格納したら、それをSQLに保存したり、イメージコントロールのユーザーに表示したりすることができます。 – freebird

関連する問題