Django+Jquery实现本地图片显示到前端

django2.0 python3.6

需求：做自动化的过程中需要截图并将截图显示在前端

实现：因为服务是部署到Mac本地的，所以把图片也保存到本地，把图片的路径存到数据库中，然后ajax请求接口时返回图片路径，在前端显示

问题：尝试了很多方法把本地图片显示到前端，包括canvas和img标签，一直不显示图片，根据日志报错发现是路径的问题

解决：
1、首先，要在settings.py中设置，media是保存图片的文件夹

MEDIA_URL = '/media/'
MEDIA_ROOT = os.path.join(BASE_DIR,'media/')

2、url.py中，加入

from django.conf.urls.static import static
from . import settings

urlpatterns = [
    path('admin/', admin.site.urls),
    path('',views.index),
]
urlpatterns += static('/upload/', document_root=settings.MEDIA_ROOT)  #加上这一行

/upload/是html文件对应的路径，比如我这个页面的是0.0.0.0/admin/result/，就把/upload/替换成/admin/result/
3、要加载的图片，放到media文件夹中，在html文件中

<img src="7.jpg" alt="图片无法显示"/>

或者在script中

<img  id="myCanvas" src="" alt="图片无法显示"/>
<script>
var objUrl = res.data.shot;#从接口返回值取图片名称
$("#myCanvas").attr("src", objUrl);
$("#myCanvas").show();
</script>