Questions & Help>Questions

How to upload an image to a Phoenix JSON API back-end٩

/phoenix#file-uploading
acrolink

acrolink

How to upload an image to a Phoenix JSON API back-end٩

Is converting to base64 the only way to go? Or is it possible to post the image to a JSON API back-end using multipart/form-data.

I am using Vue-JS on front-end, can an image 10 MB in size be converted client side to base64 and then posted to to Phoenix as JSON without making the browser freeze?

All I need is to upload an image from VueJs to Phoenix, save its path on server and get an id identifier for it sent back to client.

4 comments
/phoenix#file-uploading
3 4044 4

Most Liked

kokolegorille

kokolegorille

JSON Api is a typical case…

I have done it the base64 way, but You need to increase Plug.Parsers length in your endpoint. This was otherwise not working for HiRes photos from mobile.

PRO: It is just acting like a string.
CON: There is an increase of the file size transmitted, due to encoding.

I saw someone mixing both… JSON Api + support for Plug.Uploads, but could not remember where.

2
Post #3
seanc

seanc

Here’s a page in the Phoenix docs that should get you started @acrolink! http://phoenixframework.org/blog/file-uploads

1
Post #2

Where Next?

View thread on forum
phoenix
file-uploading
Home Questions & Help>Questions
/phoenix#file-uploading
3 4044 4
Last post

Popular in Questions Top

earth10
Questions & Help>Questions

Understanding Elixir/Phoenix performance
Hi, I’m just starting to build a side-project with Elixir and Phoenix and doing some basic test with Elixir alone. What strikes me is th...
/phoenix#performance#concurrency#raw-speed
222 19319 43
New
shahryarjb
Questions & Help>Questions

How to convert map to string (separated with ,)
Hello, I have map which I want to convert it to string like this: the map: %{last_name: "tavakkoli", name: "shahryar"} the string I ne...
#maps#strings
15 15646 2
New
jononomo
Questions & Help>Questions

Where / How does the Mix environment variable get set?
I am trying to figure out how Mix knows whether the environment is test, dev, or prod -- where is this set? Thanks.
#mix
31 23022 9
New
minhajuddin
Questions & Help>Questions

Using List.first instead of Enum.at(0)
I have seen a lot of code which picks the first element from a list using Enum.at(0) instead of List.first. Is there a reason why people ...
#code-style
76 33635 14
New
RisingFromAshes
Questions & Help>Questions

How to get the current URL?
I've read in another post that it may be possible with a router helper - but I couldn't find an appropriate one, and tbh, I'm still just ...
/phoenix
20 18724 18
New
Lily
Questions & Help>Questions

How do I put an IF statement in a templates file in Elixir Phoenix?
In templates/appointment/index.html.eex: <%= for appointment <- @appointments do %> <tr> <td><%= appoi...
/phoenix#ecto#databases#postgres
22 18257 34
New
fayddelight
Questions & Help>Questions

Installing elixir via asdf shows zsh: command not found: iex
I tried installing elixir 1.11.2 erlang 23.3.4 via asdf in my zsh shell. Enabled the versions locally and globally. When I list them ...
#erlang#asdf
44 16927 17
New
baxterw3b
Questions & Help>Questions

Anonymous functions with multiple body
Hi guys, i’m new in the Elixir world, and i have to say, that i love it! i’m having some problem to understand anonymous functions with ...
19 21662 4
New
senggen
Questions & Help>Questions

How to fix *Bad argument in call to erlang:'++'(<<"xxx/crash.log">>, ".3") in lager_rotator_default:rotate_logfile/2 line 84*
Erlang/OTP 25 [erts-13.2.2] [source] [64-bit] [smp:8:8] [ds:8:8:10] [async-threads:1] 15:22:35.803 [error] gen_event {lager_file_backend...
#production#error#log
2 46349 2
New
lanycrost
Questions & Help>Questions

How To Implement if...else if...else condition
Hi everyone! I need implement if…else if…else condition from my elixir code, and anymore of this control flow structures not work proper...
#how-to-question
40 52209 6
New

Other popular topics Top

marius95
Questions & Help>Questions

Javascript Event Handler is firing twice
Hello everyone, I try to use an Javascript Event Handler in my root.html.leex file. Therefore I created a function in the app.js file: ...
/phoenix
0 15164 6
New
lastday4you
Questions & Help>Questions

How to check Elixir version
I wanted to check elixir version in phoenix because i found that my elixir is 1.5 but when i use Enum.chunk_by it said the function is un...
#how-to-question
11 18822 3
New
mcarvalho
Questions & Help>Questions

System.get_env vs. Application.get_env
What is the difference between System.get_env and Application.get_env? For example, what are best practices to use one versus another.
#environment
13 17179 6
New
chrismccord
News>Phoenix News

Phoenix v1.3.0-rc.0 released
As promised, the first release candidate of Phoenix 1.3.0 is out! This release focuses on code generators with improved project structure...
/phoenix#phoenix-release
434 29869 96
New
JorisKok
Questions & Help>Questions

How is it possible to get 2 million websocket connections when you have 65536 available ports?
I have a server on AWS, and was running a load test using artillery. When looking at the Phoenix dashboard I see the Ports going to 100% ...
/phoenix
20 18472 4
New
dokuzbir
Questions & Help>Questions

Visual Studio Code - how to highlight html closing tags in html.eex?
I want to highlight html closing tags when i click a html tag. That works in .html files but doesnt work for html.eex templates. How can...
/phoenix#eex#troubleshooting#code-editors
12 20986 3
New
Qqwy
Questions & Help>Questions

Updating structs: Map.put vs %Foo{oldfoo | new: value} vs put_in
Original source of discussion: This topic on the Pragmatic Programmers' Functional Web Development with Elixir, OTP, and Phoenix forum. ...
#maps#structs#pipeline#access
115 28742 31
New
ashish173
Questions & Help>Questions

Difference in between :utc_datetime and :naive_datetime in Ecto
I am using Ecto timestamps with postgres, I can see the timestamps() use the :naive_dateime but for my use case I wanted to store the ti...
#ecto#timestamps
79 28163 15
New
AstonJ
Chat & Discussions>Chat / Discussions

LiveView demos, examples, and sample apps thread!
Seen any cool LiveView demos, sample apps or examples? Please post them here! :003:
/phoenix#liveview
232 30538 60
New
lanycrost
Questions & Help>Questions

How To Implement if...else if...else condition
Hi everyone! I need implement if…else if…else condition from my elixir code, and anymore of this control flow structures not work proper...
#how-to-question
40 52209 6
New
Back to top

Latest Phoenix Threads

Phoenix Forum ❯

Questions & Help>Questions

Questions Questions ❯

Latest on Elixir Forum

Elixir Forum ❯

Sponsor Spotlight

Coders51

We build reliable cloud platforms for business-critical systems.

Our Sponsors

Dashbit

Build Elixir applications with speed and confidence.

EEF

Supporting innovation across the BEAM ecosystem.

Coders51

We build reliable cloud platforms for business-critical systems.

AppSignal

Catch errors, track performance, monitor hosts and more.

Manning

Develop your skills with books, videos, and courses.

ElixirCasts

Producing high quality Elixir screencasts since 2017.

WyewWorks

Enabling companies to succeed by building software people love.

Pragmatic Studio

Courses that'll move you from confusion to "Aha, now I get it!"

View all our sponsors ❯

Categories:

Sub Categories:

Forums

Our Sponsors

Dashbit

Build Elixir applications with speed and confidence.

EEF

Supporting innovation across the BEAM ecosystem.

Coders51

We build reliable cloud platforms for business-critical systems.

AppSignal

Catch errors, track performance, monitor hosts and more.

Manning

Develop your skills with books, videos, and courses.

ElixirCasts

Producing high quality Elixir screencasts since 2017.

WyewWorks

Enabling companies to succeed by building software people love.

Pragmatic Studio

Courses that'll move you from confusion to "Aha, now I get it!"

View all our sponsors ❯

We're in Beta

About us Mission Statement