I'd like to implement uploading a profile picture for users. I'm using a VueJs frontend with a Rails API. What I'm trying to do is upload the image only using the frontend. I'd like for the file to get uploaded without any calls API calls. I could then store the location of the file in the picture attribute in the backend and retrieve it. Is that possible? I'm also using Element library.
<el-upload :http-request="addAttachment">
<el-button size="small" type="primary">Click Upload</el-button>
</el-upload>```
What you are looking at is called,
direct uploads or browser based uploads.
There should be support from storage service you are using.
Example: using S3 and GCS it is possible.
Upload without any API calls? -
Not sure, I once had to make a small API call to get the signature key and use it with POST params to upload file to storage service(GCS)
Once the API response is returned, you then might want to write to db about the file path.
Related
I'm writing rails application. My task is to show data from old java application. One of the objects has images attached, I have to display these images and allow user to add new ones.
I want to know what is the best way to let user uploading images to old app.
Old app has http post method for adding images with params: multipart file, md5 hash of the image and object id.
I tried using paperclip or carrierwave but their documentation is about saving uploaded images and I just want to transfer them somewhere else and not save anything.
there are few ways to communicate with java from ruby.
REST API - expose Java functionalities through endpoints. then use an HTTP client.
Remote Procedure Call - Apache Thrift
JRuby - embedded java programme into Ruby
however, I think maybe you can just proxy the Java API without going through the rails application.
Is it possible to use carrier wave to upload directly to amazon's S3 without using my server?
What i mean is, I don't want the images first going to my ec2 instance, and then uploaded to s3. I believe there is a way to upload directly to S3 to save my server's resources from having to process/stream the file.
I am just looking into carierwave, does it support nice html5 uploads where the user can just drag and drop the file on the web page?
If you want to upload directly to S3 from the browser you must do it with Javascript.
Heroku provides a nice tutorial : https://devcenter.heroku.com/articles/direct-to-s3-image-uploads-in-rails
Once uploaded, you can pass the finale S3 public URL of the image in a hidden field and download it server-side with carrierwave for further manipulation (resizing, ...)
I have a rails-api project, which provide the api to access my data.
I use carrierwave to store my file, my model called User and file attribute called image.
So, the image attribute contained the file_name, url and some other info.
In order to translate the file through the api, I added the gem carrierwave-base64.
I understand the Upload process. The client app encode the file to base64 code, then sent to backend by a json message. For example:
{user: {email: "test#email.com", image: "data:image/jpg;base64,#{base64_image}"}
So when the backend receive the json request, the carrierwave will parse the base64 code to a file and store it to local or S3
What I do not understand, is the Download process:
When I request the user info, what I assume is that the image file would be transfered as a base64 code in a json message, and then the client app will encode the base64 code to a file(image), and then display.
But actually, what I can provide for the json data, is the file url, not the base64 code.
The reason I want to get the file(image) from the api-server is because I don't want to the client app directly access s3 by url. So every time when the client app want to get a file, it will request the api-server, and api-server will get the file and transfer to the client.
Does anyone can explain how to do the download?
Or if I was thought in a wrong strategy, that I need another api endpoint to response a file object, not just accompany with user model.
Cheers.
Restricting Access to Objects Stored on Amazon S3
https://github.com/thoughtbot/paperclip/wiki/Restricting-Access-to-Objects-Stored-on-Amazon-S3
you did a good thing with uploading ,But while downloading you need to send URL no base64 and its traditional
Also for securrity purpose you can put public read permission on s3 while uploading and use expiring_url(60, :thumb) for your clients
In this URL get expired in time that you have specified
I'm setting up the back end for an Android/iOS app that, among other things, allows users to share an image via Twitter. It's hosted on Heroku, which has no local image hosting, so the images are hosted elsewhere.
It looks like if you want to tweet an image you're supposed to POST to /statuses/update_with_media and send the image as multi-part data. But I don't have the images stored locally, so I would have to copy the image over to temp storage on Heroku, POST it to Twitter, and then delete it, which seems... inefficient.
Is there any way I can use Twitter's API to tweet an image and only supply the URL for the image?
It does not look like it's possible to send Twitter a link via their API, presumably because they would then have to download the image themselves. You could upload the image to a third party and link to that, but you have the same problem in that case.
You shouldn't need to copy the file over as such though, you could read the file into memory and serialize it to multi-part form data in order to send to Twitter.
Do you have any code to show?
When uploading files to Amazon S3 using the browser http upload feature, I know I can specify a success_action_redirect field/value that will tell my browser where to go when the upload is done.
I'm wondering: is it possible to ask Amazon to make a web hook style POST request to my web server whenever a file gets uploaded?
Basically, I want a way of being notified whenever a client uploads a new file, so that my server can process the upload. I'd like to do this without relying on the client to make the request to my server to tell me the file has been uploaded (never trust the client, right?).
They just recently announced AWS Lambda which lets you run code in response to events, with S3 uploads being one of the supported events.
Amazon can publish a notification to SNS or SQS when an object has been created in your specified S3 bucket.
http://docs.aws.amazon.com/AmazonS3/latest/dev/NotificationHowTo.html
There is no support from Amazon regarding this as yet but we can get around this with other tools like s3cmd etc, which allow us to write cronjobs to notify us of any change in the keys on S3. So if a new key is created (notified via timestamp) we could have it send a GET request to our server endpoint listening for updates from S3 with the associated metadata.
We could use GET or POST here as the data would be very minimal I think. Probably a form data with POST should do.