# a.html

<!DOCTYPE html>

<html lang="en">

<head>

    <meta charset="UTF-8">

    <meta name="viewport" content="width=device-width, initial-scale=1.0">

    <title>Document</title>

    <link rel="stylesheet" href="/static/layui/css/layui.css">

    <script src="/static/layui/layui.js"></script>

</head>

<body>

    <div>

        <form action="/index2/" method="POST" enctype="multipart/form‐data">

            {% csrf_token%}

            <textarea name="content" id="demo" style="display: none"></textarea>

            <input type="submit" class="layui‐btn">

        </form>

    </div>

    <script>

        layui.use('layedit', function(){

            var layedit=layui.layedit;

            layedit.set({

                // 上传图片

                uploadImage:{

                    url:'/index1/',

                    accept:'image',

                    acceptMine:'image/*',

                    exts:'jpg|png|gif|bmp',

                    size:'10240'

                },

                // 代码设置

                codeConfig:{

                    hide: true

                }

            })

            layedit.build("demo");

        })

    </script>

</body>

</html>
# settings.py

MEDIA_URL='/files/'

MEDIA_ROOT=os.path.join(BASE_DIR,'files')
# urls.py

from django.conf.urls.static import static

from django.conf import settings

urlpatterns += static('/files/',document_root=settings.MEDIA_ROOT)
# views.py

from django.views.decorators.csrf import csrf_exempt

@csrf_exempt

def index1(request):

    id=request.FILES.get('file')

    # filename='201907031819001'+id.name

    filename=id.name

    f=open('files/'+filename,'wb')

    for i in id :

        f.write(i)

    f.close()

    dicts = {

        "code": 0,

        "msg": "ok",

        "data": {

            "src": "files/" + filename,

            "title": filename

        }

    }

    return JsonResponse(dicts)

Django集成layui 的 layedit 之图片上传接口的更多相关文章

  1. Asp.NetCoreWebApi图片上传接口(二)集成IdentityServer4授权访问(附源码)

    写在前面 本文地址:http://www.cnblogs.com/yilezhu/p/9315644.html 作者:yilezhu 上一篇关于Asp.Net Core Web Api图片上传的文章使 ...

  2. springMVC框架下——通用接口之图片上传接口

    我所想要的图片上传接口是指服务器端在完成图片上传后,返回一个可访问的图片地址. spring mvc框架下图片上传非常简单,如下 @RequestMapping(value="/upload ...

  3. django中博客后台将图片上传作为用户头像

    添加上传目录 # 如果不添加上传目录,仍然可以上传成功,默认为project目录,如果models.py定义了upload_to="目录名称",则会上传到"project ...

  4. layedit图片上传接口案列

    html部分 <divclass="layui-form-item"> <labelfor="tname"class="layui- ...

  5. VS2019 开发Django（六）------Admin中图片上传

    导航:VS2019开发Django系列 该篇继续完善在Django的管理界面上传图片,因为LazyOrders小程序中菜单需要展示图片,而不是一个文本路径,所以我们还需要继续改造一下. 1)安装pil ...

  6. thinkphp5图片上传接口

    public function avatarUpload() { $file = request()->file('file'); $filePath = 'avatar'; $width = ...

  7. layui 富文本 图片上传 后端PHP接口

    <!DOCTYPE html> <html> <head> <link rel="stylesheet" type="text/ ...

  8. asp.net core 如何集成kindeditor并实现图片上传功能

     准备工作 1.visual studio 2015 update3开发环境 2.net core 1.0.1 及以上版本  目录 新建asp.net core web项目 下载kindeditor ...

  9. django 发帖时碰到的图片上传

    所用编辑器 [wangEditor.js] 图片上传接口 '/edit/image/' 返回内容  参照 https://www.kancloud.cn/wangfupeng/wangeditor3/ ...

  10. Asp.Net Core Web Api图片上传(一)集成MongoDB存储实例教程

    Asp.Net Core Web Api图片上传及MongoDB存储实例教程(一) 图片或者文件上传相信大家在开发中应该都会用到吧,有的时候还要对图片生成缩略图.那么如何在Asp.Net Core W ...

随机推荐

  1. Node.JS http server

    一.自动更新刷新 http server browser-sync dist --files "**/*" 二.http-server 三.webpack-dev-server的c ...

  2. 【Azure 事件中心】Event Hub 消费端出现 Timeout Exception，errorContext中 LINK_CREDIT为0的解释

    问题描述 在使用Event Hub SDK消费数据过程中,出现大量的Timeout Exception,详细消息为: com.microsoft.azure.eventhubs.TimeoutExce ...

  3. 【Azure API 管理】讨论APIM是否适合直接存储文件到Azure Storage Account呢？

    问题描述 需要从 APIM 直接将大文件存入Azure Storage,没看到这方面的官方文档,所以是否有这方面的实践案例,或者APIM是否支持引用SDK (如Azure Storage SDK)? ...

  4. 2024年，提升Windows开发和使用体验实践 - 终端&命令行篇

    前言 经过前面的铺垫,终于继续更新了,这个大概率是本系列近期的最后一篇了. 同时之前有些内容更新,我也补充到这一篇里面. 关于 scoop 管理器的补充 scoop 常用命令 scoop help # ...

  5. 【简历模板】极简Markdown程序员简历模板

    前言 最近在找工作,一份好的简历是敲门砖,所以跟大家分享下简洁明了大方MarkDown的简历模板和在线编辑工具 在线工具 冷熊 Java工程师简历模板 下载 点击下载 预览 个人信息 xxx/男/19 ...

  6. TimeLine 时间轴 网站 分享 time.graphics - nodejs 10年图

    话说20年 弹指一挥间 https://time.graphics/line/682014 nodejs 10年图 https://time.graphics/line/598790 资料 2022, ...

  7. GDB简洁指南

    启动gdb:gdb program 设置运行参数:set args 10 20 30 启动程序: run(r),start 显示源代码:list(l) 显示当前栈帧和运行行:frame(f) 设置显示 ...

  8. 3、Azure Devops之Azure Repos篇

    1.什么是Azure Repos Azure Repos,就是我们常说的代码仓库,相当于gitee,github,git,svn工具.主要是提供给开发人员使用的,管理.查看代码的部件.通过Files. ...

  9. NJUPT自控第一次积分赛的小总结（一）题目感受

    快开学了事情真的好多啊 -_- 忙完积分赛就赶紧要去复习期末了...线代还是依托答辩啥都不懂 先看题目吧,RT,我们队(我)选择的是第一题(仅仅是因为很简单罢啦) 一开始看题目,心想不就调调pid吗, ...

  10. 记录--一行代码修复100vh bug

    这里给大家分享我在网上总结出来的一些知识,希望对大家有所帮助 你知道奇怪的移动视口错误(也称为100vh bug)吗?或者如何以正确的方式创建全屏块? 一.100vh bug 什么是移动视口错误? 你 ...