Ajax htmlの中の値の指定方法

Question

非同期通信で、挿入するHTML中の値の指定方法

railsでinstagramのような簡単な画像投稿アプリケーションを作成しています。
非同期通信を使って投稿する際、画像をクリックすると投稿の詳細ページに飛ぶようなリンクをHTMLの中に入れたいのですが、srcの値の指定方法がわかりません。。

初心者で単語など使い方が間違っていたら申し訳ありませんが、ご教示いただけると幸いです。

該当のソースコード

$(function(){
  //非同期通信の際に生成されるHTML
  function buildHTML(instagram){
    var html = `<span class="contents__images">
    <a href="/instagram/${instagram.id}">
    <img class="contents__images__image" src="${ここの指定方法がわかりません}">
    <i class="fa fa-heart contents__images__image__icon">
    </i>
    </a>
    </span>`
    return html;
  }

//非同期通信
$('#new_instagram').on('submit', function(e){
    e.preventDefault();
    var formData = new FormData(this);
    var url = $(this).attr('action')
    $.ajax({
      url: url,
      type: 'post',
      data: formData,
      dataType: 'text',
      processData: false,
      contentType: false
    })
    .done(function(data){
      var html = buildHTML(data);
      $('.contents__all').append(html);
      $('#new_instagram')[0].reset();
      $('#new_instagram').val('');
    })

補足情報（FW/ツールのバージョンなど）

同期通信で投稿した時の画像タグです。srcの部分の指定方法を知りたいです。

<img class="contents__images__image" src="/uploads/instagram/image/116/%E3%82%B9%E3%82%AF%E3%83%AA%E3%83%BC%E3%83%B3%E3%82%B7%E3%83%A7%E3%83%83%E3%83%88_2019-07-11_4.30.17.png">

Answer 1

apiはご自身で用意するのですよね？
railsが返すdataに当該のデータがうめこまれていればそれを抜き出して
処理するだけですよね？
dataType: 'text',で受けていますが、apiならjsonで入出力したほうが
効率的に取り出せると思います

Answer 2

画像のパス、もしくは画像をbase64エンコードしたものを指定すれば良いと思います。