title: Vue.js - Error when displaying base64 image strings (431, request header field too large)
body: <p>we are encountering this error where we try to display a base64 string from the backend using the following code:
  <a href="https://i.stack.imgur.com/EWxya.png" rel="nofollow noreferrer">Our code </a></p>
  <pre><code>&lt;img v-bind:src=&quot;`data:image/jpg;base64,${atob(photo.path)}`&quot;
  
  &lt;img v-bind:src=&quot;data:image/jpg;base64,${photo.path}&quot;
  </code></pre>
  <p>Where photo.path == \x13r23p9rd0823hr4c9fnp23h4n-9f8c2hn438hf293hfpweu9fhpweiufnwe</p>
  <p>We just constantly encounter a 431 request header field too large error (screenshot attached below).</p>
  <p>Any help is greatly appreciated. Thank you.</p>
  <p><a href="https://i.stack.imgur.com/mZnvi.png" rel="nofollow noreferrer">Our error </a></p>