Technical requirements for Flash AS3 image manipulation and saving application - php

I am building a Flash AS3 application that allows users to modify images, and then submit-save them to a server.
The user will then have the ability to log in and access these saved images in a thumbnail gallery. They can either delete an image or click a thumbnail to view it at original size.
I am comfortable with the front end having built something similar in AS2 and Flash 8 a few years back.
What will be required for the backend?
I assume some type of PHP-MySQL database is needed. Not sure about hosting issues requirements as the AS2 application I built never sent any actual binary data, but rather data describing the image transformations. I assume I will need to make use of byteArray?
Is there an existing tutorial or code sample that does something similar available for viewing-download?
Are there any security restriction 'gotchas' associated with FP9 -10 I need to be aware of?

the most simple way is to create the image in the client ... get a BitmapData snapshot of the image using BitmapData::draw ... convert this to JPEG or PNG using the as3corelib, that offers encoders for both formats ... and then just send the raw binary data to the server (store it into the data property of your URLRequest) and there, store it to the file system (retrieve it in $HTTP_RAW_POST_DATA) ... so the whole storage process is just a couple of lines ...
you will need a database of course, for session management (you could rely on PHPSESSION only, but personally i don't trust it), login, registration and to store which image belongs to which user ...
so yeah, the whole netcode/backend/storage thing etc. will be quite a piece of cake (btw. you might wanna look into amfphp) ... designing a good interface and implementing the galery view etc. will be the biggest chunk i guess ...
there are no real security gotchas, as long as your SWF comes from the same server, that it communicates to ...
so good luck then ... ;)
greetz
back2dos

If you are on a shared host, php and mysql are probably already available to you, that is a good way to get started.
In terms of flash communicating with the server, you will have to find a way to turn your pictures into a stream of bytes (byteArray sure), and then use flash's send() to post them to the server. Sending XML Out From Flash
Using php you can receive the images and save them to the db, and show them (turn the stream of bytes back into an image with gd -- gd docs)
Also: you may not ever have to send a stream of bytes if you can find a way to have flash describe the transformations, and have gd repeat them, just a thought.
Are there any security restriction 'gotchas' associated with FP9 -10 I need to be aware of?
Maybe, if you are posting data to a different server, you have to enable it with some xml Send data from Flash to PHP on a different server

Related

AS3 BitmapData source code

A mobile AIR app needs to send a large image to the back end for later display in a web page.
It takes for ever for PNGEncoder in the AIR app to complete, so the idea is to convert the image data to a ByteArray, compress it and send it to the PHP backend where it is saved as PNG by the PHP code. So I'm looking to port PNGEncoder.as and BitmapData class to PHP to accomplish this. I found PNGEncoder.as in as3corelib but can't find source for BitmapData class that it uses.
So the questions are
1. Is there code out there that does what I'm trying to do?
2. Where can I find BitmapData source code?
3. Is there another way to accomplish this that I'm missing?
Note1. I realize that I can decompile airglobal.swf where BitmapData resides, but looking for a cleaner way
Note2. I'm aware of AMFPHP but it does not support BitmapData type
Thanks
Andy
I see two solutions to this issue.
First, you can consider using a Worker to do just the conversion and sending routine, because image conversion is a pretty standalone and straightforward task to offload, and since most modern devices have more than one core anyway, it's better to put the hardware to work on the client rather than on server. Of course, you will have to take some measures to provide the worker instance with required data and to properly upload the image (cookies might not be handled well in a worker), but this approach is generally cleaner and requires no server side alterations.
The second approach is to use BitmapData.getPixels() to convert a region of pixels into a sequence of bytes, then send them unaltered to the server for conversion. Be warned however, the amount of data in a raw bitmap can be too large for the server to accept, you are looking to no less than 4 bytes per pixel, as bitmaps in AS3 are 32-bit. You can use a server side image encoder to convert raw data on the server after uploading.

When loading multiple images from network requests, should I return the image data or a link to the image?

I have an iOS app that lists local places in a table view. Each cell has a picture, text, and subtext.
Each cell's detail view also has multiple pictures of the relevant location, as well as a decent amount of text. JSON is the interchange format.
Currently I am sending bit blobs and constructing it into a jpeg once loaded to the device but I am worried this is intensive on both the device and the server. So I was considering sending a link to the picture and asynchronously downloading each picture, but I am unaware of what repercussions this would have. Especially considering that I am currently using a cheap PHP/MySQL shared hosting plan for the backend.
I am looking for a list of pros and cons for sending the raw image data through JSON vs a link to that image. Any other options for quickly and efficiently populating a view with multiple network images is welcome.
I think the difference is as following:
1- the user will download : (link+image > image) more data stream.
2- if the image is on another server -> might be slower than your server or faster -> affect the image loading speed provided for the user and minimize transmitted data size between your server and the client.
3- if the image is on another server -> do you guarantee that it will be there when your website is up ?
4- loading data using ajax is already an asynchronous method and you don't have to worry about another server if you use it. well, unless your server is as slow as hell then you should consider using another server for the big images as the synchronization won't be your major concern as it is the load you are applying to your server.
if other points come to my mind, I'll post them here ..
I've done a little bit of research into this and asked a few colleagues, so I'll share what tidbits I've come up with.
At some point, the raw image data is going to have to be sent- that is unavoidable.
But I can benefit from lazily loading the image data- so that if my user only looks through 14 tableview cells, I only spend time loading 14 images instead of however many total results are returned from the server (And even less if I implement proper caching).
My solution so far is to return 30 (the number of tableview cells I load at one time) JSON objects, each having an "Image_URL":"..." field and putting those into a dictionary. Then, in cellForRowAtIndexPath:, I check to see if the image for that cell is already cached and if not, I make a request for that picture and update the cell.image in the network callback.
This is pretty simple to do on your own, but SDWebImage seems like a pretty good library for handling corner cases, caching, and other things that aren't covered in a basic implementation. I should note that AFNetworking also includes functionality for asynchronous image downloading.

How can I save a movie clip symbol in as3 as a PNG on my server?

I'm developing a website in flash for a company and it's going well so far. The website allows people to create custom railings. The owner of the company wants me to save out the demo picture that's shown in flash (movie clip) as an image (pref PNG) so that I can include it in the validation email. Does anyone know how to do this please? I need to save a movie clip symbol on the web server. Thanks in advance!
You need a couple of components to work in order to make this happen. AS3 doesn't execute on the server side (has no access to the servers hard disk) so you'll have to use some other language on the server to receive the file. I would personally recommend PHP as it's great for this kind of simple task and there are lots of tutorials out on the web for handling uploaded files using PHP.
On the AS3 side of things you can use BitmapData.draw method to draw you Sprites or whatever other IBitmapDrawable objects to a BitmapData. Then using PNG encoder (can use the built in or search around there's some other implementations out there) to encode the BitmapData into a PNG. Last step send the encoded PNG to the server and have it save the file somewhere the script has write permissions.
For some references here's some code I wrote:
Basically a save button in my app is clicked and the instance of the class below is shown, this then has the methods for saving. After getting the flattened image it makes a call using a third party PNGEncoder I found called PNGEncoder2
https://github.com/wafflejock/FingerPainting/blob/master/FlashBuilderProject/FingerPainting/src/com/shaunhusain/fingerPainting/view/optionPanels/SaveOptions.as
Below I have a separate class that manages all of the "layers" which are just sprites really for my drawing app. The "LayerManager" below has the method that uses BitmapData.draw to "flatten" all the layers into a single Bitmap/raster drawing.
https://github.com/wafflejock/FingerPainting/blob/master/FlashBuilderProject/FingerPainting/src/com/shaunhusain/fingerPainting/view/managers/LayerManager.as

jPlayer Stream MP3 but prevent from downloading and hotlinking

I am building a site similar to thefuture.fm. DJs are able to upload MP3 files and set if the file only can be streamed or streamed and downloaded.
Visitors to the site don't have to login to listen to music. They should be able to stream/download these MP3 songs depending on the users settings.
I am using the jPlayer to play songs. I have searched all over the web but can't find any solution. Does jPlayer have any facility like prevent downloading of MP3 files? Or is there any way I can prevent this?
It's actually impossible to prevent downloading. You can make it harder for somebody, but he still needs to download all the data to hear the song. So even if you use some encryption to send the data to a flash player you write yourself, the player will have to decrypt it and play the audio. And since you can decompile flash it wouldn't be to hard to find out the algorithm. He could also just record the music again when playing it (similar to the first DVD decrypt tools, who just took a screenshot 30 times/sec to pass million dollar security measurements)
So the goal is to make it harder, not impossible.
Personally I would go for temporary available links in combination with a cookie, so I can still use jplayer and don't have to reinvent the wheel. Also use some obfuscating to make it harder to read the URL.
When somebody request the main URL (where you show your player) generate a unique key and save it in a cookie. The unique key should link to the IP address and request time stored in session.
Now create a link to the music file like playfile.php?file=music.mp3 or whatever. Just make sure that PHP will handle the file request. If you obfuscate this link it will be a little harder to find it.
In playfile.php check for the unique code in the cookie and check if it matches the IP address in session and the request time is less then EG 15 seconds (any longer and music won't play anyway with slow internet connection). If it is, stream the file. If it's not, block it.
Now if somebody would write a program/script to download the music, he can. But if somebody has the knowledge and time to do that, nothing will stop him from downloading it.
This will prevent any normal user from downloading it.
Preventing hotlinking is a bit easier, since in general you'll have a referrer string to check. If this is present then you'll know not to serve the content. Here is a code example.
Preventing downloading on the other hand is much harder - the best approach would be for a Flash application to decrypt data in realtime - if you use a simple encryption scheme, most client hardware should be fast enough. I couldn't find much for this on the web, so I wonder whether you'd have to do some Flash/Flex development yourself: download MP3 data in chunks, apply decryption routines from a library, and send them to some sort of MP3 decoding buffer. I suspect the password would be hard-coded.
Addendum: I've found that in later versions of Flash you can play dynamically generated sounds from a buffer (see here). So, if you're willing to get stuck into some Flash/Flex development, a solution is in sight. I couldn't find anything that accesses low-level MP3 routines, but don't forget that files don't have to be MP3 as transmitted from your server - convert them to whatever your app needs.
What you are searching for can't be achieved with JavaScript solution. If you want javascript to play something, it has to download it and in order to download it, JavaScript needs a URL.
Most common way to tackle this problem is using Adobe Flash and making a player in it. You can make your player stream content (mp3 in your case) without explicitly exposing actual data location to user.
Put the file(s) in a location that isn't accessible from the browser and use PHP to stream them out as a series of chunks using HTTP/1.1 206 Partial Content. Then use a method like this to edit the context menu to add/remove the 'save as'.
Use a session var to eliminate direct linking.
Actually, there is a player that DOES scramble the url and it works pretty good. We used it because of this excellent feature. It is not impossible to download/save the audio, but at least it is not a matter of just opening the inspector and copying the url. It also prevents from sharing to outside sources by URL. So, contrary to the above, it IS possible and it IS available :)
Check the plugin out here:
https://wordpress.org/plugins/mp3-jplayer/

PHP chart Libraries VS JavaScript Chart Libraries

I am just stuck a little in making a choice between PHP chart Lib and JavaScript Chart Lib. I do understand that PHP if for the server side and Javascript for the client side. My problem is what difference does it make when using their charting libraries. Is it performance issue or what?
I want to understand the difference in using PHP chart Libs and JavaScript Chart Libs. Please am not looking for examples of their chart libraries. I am looking for why i should choose one over the other.
I tried to google 'php chart vs javascript chart' but didn't get any links that can give me
the difference.
EDIT 1
1)
If this question has been answered before, then point me there.
2)
Am developing the application for internet
EDIT 2
1)
I have found out about PHPChart PHPChart which has both PHP source code and JavaScript source code. If anyone has experience in that library, does it may be solve the problem of server side load (bandwidth issues) etc.. I am thinking since it has both the PHP and JavaScript source then it may be the best to use. Am just assuming. :-)
Thank you very much
Both ways of creating graphs have their own pros and cons.
If you decide to do it using PHP, first you need to make sure that you have all the required graphical libraries installed (e.g. GD, which might not always available on shared hosts).
Assuming you have them, the first negative thing in my opinion is that you will end up with static images. Of course, it's not always a bad thing, as that ensures compatibility with all the clients, be those with or without javascript support, however, it takes away the dynamics of graphs generated on the client side using javascript. Your users won't be able to zoom, move, slide, full screen or do anything that they could with the likes of Highcharts or Flot.
Another con is that images take up more bandwidth than, say, JSON. The bigger you want to have your graph, the more colors it contains, the longer your clients will have to wait till your page loads. And just because those loads are not asynchronous, they will have to wait for the images to load before they will see the rest of the page.
With javscript libraries everything is different though. You only request the data required for your graph and you only request it when your page loads. The amount of data is usually smaller than an image would be plus you can compress your output with GZ to make it even smaller. Users will see nice spinners informing them that the graph is loading instead of some incomplete webpage.
Another thing to take into account is - what if you decide to show a nice table with data in them below each graph? If you chose to render images on the server, you would end up having to add new functionality just to get the data. With JSON, however, you just make one call, render the graph and display the table. Maybe calculate totals or do whatever you want with it. Hand it out to people as an API if you wish, after all :)
If you ask me, I would definitely go with client-side graphs as most of the devices have nice HTML5 support nowadays and being able to display a graph on an Android phone, or an iPhone or an iPad shouldn't pose a problem. If you only need images and you don't wish to expose the original data, go with PHP.
My opinion is that having a server side solution (i.e. php) takes away any browser compatibility issues you may have with a client side solution (i.e. javascript) and hence support issues.
A benfit of using JS is that it does offload resources from your server to the client because you may only have to generate some light weight data (e.g. JSON , XML) and the rendering occurs on the client. You will have to investigate how many hits your server is likely to get, etc to determine if resource is an isuse with PHP or JS.
However, using Php to create images of charts you can always get around the performance/resource issue by using a cache of the image files and serving from the cache (it's a just a folder of images) instead of generating a new one. Whether you cna use a cache will depend on your usage. If clients require up to the second data and its always changing, obviously a cache may not be of use.
Here's what I see :
Using PHP
Increase load on the server for the request
Will work everywhere
Also, like someone said here and made me think of it, you can cache the image that PHP give you, reducing bandwith (no lib to download) and reducing load (cache)
Using Javascript
Decrease load but increase the bandwitch and addition http request (to load the JS lib)
Will work where JS is available
But remember, PHP take more load then an HTTP request.
Also, always remember, Javascript is made for effects and specials stuffs you need to display.
There is one PHP render advantage that no one told about. Since sometime you need to include chart as image into PDF, DOC, XLS etc. file or email it – you have no other way except to render chart on server and store it as image to be inserted.
For data manipulation you use PHP.
For visual and behavioral effects you use JavaScript.
For that reason, you should use Javascript as its designed for visual behavior. Plus it will put less load on your server as all processing will be client side. As more people use your application simultaneously, it will start to slow down as your server will be doing a lot more then it has to.
Hope that helps :)

Categories