Upload and Recover an Image with Angular

Asked

Viewed 1,568 times

0

Let’s assume I have a user registration form where I want to save a photo of it. Send this data by POST to the server (Java) where I include in the database.

What is the best (practical) way to send this photo along with the other data to my server? Save this image in a directory or in a field BLOB in the database? I have to send the image as a Array of bytes? And how can I recover that image when I make an appointment at my bank?

If possible I would like some examples or explanations.

java mysql angularjs rest file-upload

  • To save to the server, the best option is to save the image to the disk and only its path in the database. To recover the image would take the path in the database and make a request in the image path (Ex: my.server.com/images/image.png)

  • Got it, and how do I upload to the server?

  • You can do this in two ways: 1 - uploading the image to the server and saving the link or reference in the database. 2 - creating an image Base64 rash and saving in the bank.

  • 1

    Here is an example generating rash: https://www.base64-image.de/step-1.php?m=1

1 answer

1


If you are using Angularjs I will indicate a javascript plugin for the same.

Is the Flowjs (ng-flow). An example:

<div flow-init="{target: '/upload'}"
     flow-files-submitted="$flow.upload()"
     flow-file-success="$file.msg = $message">

  <input type="file" flow-btn/>
      Input OR Other element as upload button
  <span class="btn" flow-btn>Upload File</span>

  <table>
    <tr ng-repeat="file in $flow.files">
        <td>{{$index+1}}</td>
        <td>{{file.name}}</td>
        <td>{{file.msg}}</td>
    </tr>
  </table>
</div>

  • On the JS part as it would look?

  • Here is an example: https://github.com/flowjs/ng-flow/tree/master/samples/basic

Browser other questions tagged java mysql angularjs rest file-upload

You are not signed in. Login or sign up in order to post.