I am trying to build up a web application with javascript and nodejs. In order to hide the ApplicationID/Key, I use API to handle the data saving.
For example, if I need to save a object on Parse. Instead of using Parse Javascript SDK on the client side, I send the object to the server and then ask server to save the parse.
Everything was working fine until I try to upload images to the server. It turns out I need to somehow upload the images to server before I can save these images to parse class because PFFile need urls to upload the images. But the image at this time is still in local. I was thinking to convert image to base64 string and then server can convert it back to image data and then save it to the parse. However, I didn't succeed with this approach. Can anyone provides some insight? Thanks
When uploading a image, you can just use
uploadImg(photo):void{
var parseFile = new Parse.File("image.png", {base64:photo});
parseFile.save();
}
the parameter photo is base64.
*Are you using AWS s3 to store your images?
Related
I am using cloudinary API to get different resolution of the image/video files.I am able to use upload API using following code and get the required resolutions from java code
Map uploadResult = cloudinary.uploader().upload(file, options);
Now i need to perform the same from aws lamda using java code since I need to get resolutions of content stored in s3 bucket. I can think of 2 possible ways of doing the same 1) point cloudinary to use s3 urls - this requires setup 2)byte array buffer or IO input stream. Is there any sample java code available to option 2 ?
I am referring to upload API here
https://cloudinary.com/documentation/image_upload_api_reference#upload
This has some reference with python
Correct way for uploading image bytes to cloudinary
Please check this example:
File file = new File("<image_path>");
byte[] fileContent = Files.readAllBytes(file.toPath());
cloudinary.uploader().upload(fileContent, ObjectUtils.emptyMap()));
--Yakir
I have an Angular webapp that uses a Spring Boot REST service as its backing web service.
I am adding a "Profiles" feature for users, and as part of this I want to stand up an endpoint that allows users to upload profile images for themselves and immediately upload those files to S3 (where I will host all the images from).
Looking at several Spring Boot/file upload tutorials :
http://www.mkyong.com/spring-boot/spring-boot-file-upload-example/
I update avatar image and display it but the avatar does not change in Spring Boot , why?
Many others
It seems that the standard way of handling such file upload is exposing a controller endpoint that accepts MultipartFiles like so:
#RestController
#RequestMapping("/v1/profiles")
public class ProfileController {
#PostMapping("/photo")
public ResponseEntity uploadProfilePhoto(#RequestParam("mpf") MultipartFile mpf)
// ...
}
Looking at all this code, I can't tell if the MultipartFile instance is in-memory or if Spring sets its location somewhere (perhaps under /tmp?) on the disk.
Looking at the AWS S3 Java SDK tutorial, it seems the standard way to upload a disk-based File is like so:
File file = new File(uploadFileName);
s3client.putObject(new PutObjectRequest(bucketName, keyName, file));
So it looks like I must have a File on disk in order to upload to S3.
I'm wondering if there is a way to keep everything in memory, or whether this is a bad idea and I should stick to disks/File instances!
Is there a way to keep the entire profile image (MultipartFile) in-mempory inside the controller method?
Is there a way to feed (maybe via serialization?!) a MultipartFile instance to S3's PutObjectRequest?
Or is this all a terrible idea (if so, why?!)?
Is there a way to keep the entire profile image (MultipartFile) in-mempory inside the controller method?
No, there is NO way to keep an image File in-memory because File object in java represents a path in file system.
Is there a way to feed (maybe via serialization?!) a MultipartFile instance to S3's PutObjectRequest?
No, from S3's API documentation, there is no way for S3 to deserialize to the image file for you after/during the upload.
Or is this all a terrible idea (if so, why?!)?
It depends on your specific case but it is generally not preferred.
If - there are not many users uploading images at the same time, your memory is probably enough to handle.
Else - You can easily get out-of-memory problems.
If you insist on doing so, S3 API can upload an InputStream (If I remember correctly). You can convert your Multipart File to an InputStream.
This SO thread talks about uploading to S3 with InputStream
You can also take a look at File.createTempFile() to create a temp file.
I have been looking at the same thing. Basically you want a user to be able to be able to upload a photo album and have those photos served from S3 and probably have them secured so only that user can upload/delete/etc.
I believe the simpler answer is in spring boot to get a Pre-signed URL from S3. https://docs.aws.amazon.com/AmazonS3/latest/dev/PresignedUrlUploadObjectJavaSDK.html
which basically gives you a token defining the bucket, and object key ("/bobs_profile/smiling_bob.jpg") and a time limit for that image to be uploaded.
Give that to your angular app (or ionic app) to upload the image to that location.
That should do it. but someone let me know if I'm wrong.
The only issue that I see is if bob wants to upload "bobs_nude_photo.jpg" and only wants spring security logged in people to be able to see it... well I'm sure there is an S3 solution for that??
I'm writing a Swift Server that accepts and saves a base64 String which has encoded a UIImage via UIImageJPEGRepresentation (so I can compress it). This string is then sent as JSON, where it is saved to a Swift Cloudant database. However, the server doesn't have access to UIKit, so I can't refer to a UIImage in it's code to decode it back into a picture. Is there a way to turn the String back into a picture without using UIImage?
Pure Swift would be the best option, but I don't know if it's actually possible. My server is a Kitura one, hosted on IBM Bluemix. Thank you!
(The goal is to show the picture on a webpage.)
I don't know if it can help but as you need to show this image on a website I, in an application where I need to show a webview with a image,used this (in the .html file containing my webpage)
<img src="data:image/png;base64,#IMAGE_STRING#">
and when I run the application the "#IMAGE_STRING#" is replaced by the base64 string containing the image , the result is : my image is showing perfectly in the webpage
I have a client written in xcode and I would like to upload the user pic to be stored on the server.
The server run node js and I store the uploaded files with gridfs
How should I send the picture in nodejs query.
Is it suppose to be binary format of the pic?
If so, does this mean -
the client should create a binary format of the image in xcode
the client should send the binary format as string appended to the url request for node
the server stores the string in gridfs
the client retrieves the image and parse/present it as jpg/png image?
I would just use an HTTP POST similar to how you would do the same in a web form. Check this post for an example of how to do this with iOS/cocoa.
ios Upload Image and Text using HTTP POST
Once the file gets to your nodejs server, its up to you how you want to handle. If using express framework setup middleware thusly:
/** Form Handling */
app.use(express.bodyParser({
uploadDir: app.settings.tmpFolder,
keepExtensions: true
}))
app.use(express.limit('5mb'))
Then you can access the uploaded image with req.files, pre-process and then store in gridfs with your MongoDB module of choice.
I'm new and just developing on J2EE.
I am modifying an existing application (an OpenSource project).
I need to save an image on a client sent by the server, but I do not know how.
This activity must be done in a transparent manner without affecting the existing operation of the application.
From the tests done I get this error:
java.lang.IllegalStateException: getWriter () has Already Been Called for this response.
How should carry out this task, according to your own opinion?
How do I save on the client, locally, the image?
Update:
Thanks for the answers.
My problem is that:
the image is generated on the server, but not for direct client request (there is no link to click on web page), the picture is composed using other services on the Internet.
reconstruct the image on the server.
This image must be sent to the client to be saved locally.
so I'd like it to appear a window where you assign the destination image
plus I'd like the rest of the application were not affected by this activity.
The application is yet on production.
Thank you very much for your response.
From the tests done I get this error: java.lang.IllegalStateException: getWriter () has Already Been Called for this response.
In other words, you were trying to mix the binary data of the image with the character data of the HTML output, or you were trying to do this in a JSP instead of a Servlet. This is indeed not going to work. You need to send either the image or the HTML page exclusively in response to fully separate requests.
In your JSP/HTML page just have a link to the image, like so:
click to download image
Then, in a servlet listening on an url-pattern of /imageservlet/*, you just get the image as InputStream from some datasource (e.g. from local disk file system as FileInputStream) and then write it to the OutputStream of the response the usual Java IO way.
You only need to set at least the Content-Disposition response header to attachment to make sure that the client get a Save As popup dialogue, else it will be displayed straight in the browser. Setting the Content-Type and Content-Length are also important so that the browser knows what the server is sending and can predict how long the download may take.
response.setHeader("Content-Type", getServletContext().getMimeType(file.getName()));
response.setHeader("Content-Length", String.valueOf(file.length()));
response.setHeader("Content-Disposition", "attachment;filename=\"" + file.getName() + "\"");
You can find complete basic servlet example in this article.
Note: you cannot control where the client would save the image, this would be a security hole. This way websites would be able to write malicious files on client's disk unaskingly.
Update: as per your update, there are two options:
You need to let the client itself fire two HTTP requests (I've answered this in your subsequent question)
Create a client side application which does all the task directly at the client side and then embed this in your webpage, for example a Java Applet. With an applet you have full control over the client environment. You can execute almost all Java code you'd like to execute and you can write files to disk directly without asking client for the location to save. You only need to sign the applet by a 3rd party company or the client needs to confirm a security warning before running.
Its up to the browser how all types of output are handled. Web pages are given a content type of html which the browser understands and ends up rendering ass a page that we can see. Images are given content type of image/jpeg etc which are rendered as images when in a page etc. To force a download prompt one needs to use a content type of a binary file rather than that of an image so the browser forces the download rather than shows the image. To ensure this use something like "application/octetstream"... i cant recall exactly but its easy to google for.