ajaxコール後に画像を表示する

Question

ここで私はちょうど今遭遇した問題です。私は会話に入力すると、それぞれのユーザーのイメージを読み込む自分のラーベルアプリケーションの一部のチャット機能を持っています。私が理解できないのは、プロファイル画像のURLをビューに追加すると、実際に画像が表示されず、画像がどこにあるべきかの「プレースホルダ」が示されるだけです。

アセットフォルダ内の画像の正しいパスをコンソールログに表示できるので、コードが実際に機能することがわかりました。

私の質問は、ajax呼び出しから情報を取得した後に画像を表示する方法です。

$('.chat-wrapper').append(
        "<div class='message " + sent + "'>" + 
        "<div class='media-left'>" + 
        "<a href=''><img scr=" + data.profilePicture + " class='img-circle img-50x50' title=''></a>" + 
        "</div>" + 
        "<div class='media-body'>" + 
        "<small class='small-gray p-l-10 pull-right'>" + data.time + "</small>"+ 
        "<div class='heading'>" + 
        "<span>"+data.authorUserName+"</span>" + 
        "</div>" + 
        "<p>" + messageText + "</p>" + 
        "</div>" + 
        "</div>" 
      ); 

ありがとうございました！

Answer 1

$('.chat-wrapper').append(
       "<div class='message " + sent + "'>" + 
       "<div class='media-left'>" + 
       "<a href=''><img src='" + data.profilePicture + "' class='img-circle img-50x50' title=''></a>" + 
       "</div>" + 
       "<div class='media-body'>" + 
       "<small class='small-gray p-l-10 pull-right'>" + data.time + "</small>"+ 
       "<div class='heading'>" + 
       "<span>"+data.authorUserName+"</span>" + 
       "</div>" + 
       "<p>" + messageText + "</p>" + 
       "</div>" + 
       "</div>" 
     ); 

SRCが正しく入力されていない場合、これを試してみて、またsrcと、srcの終了後に引用符に注意してください。

Answer 2

これは、通常、ベースURLを正しく表していないルートにいる場合に発生します。

asset（）ヘルパ関数を使用して、アセットフォルダへのURLをサーバー上のパブリックディレクトリに関連付けることができます。

https://laravel.com/docs/5.3/helpers#method-asset