python学习之web框架 dgango 使用markdown文本编辑器

前端使用markdown书写博客,使用ajax提交数据到后台保存到数据库
调用后台接口时,出现403

 # 报错Forbidden (CSRF cookie not set.)

解决:修改settings.py文件,将MIDDLEWARE 的
django.middleware.csrf.CsrfViewMiddleware, 注释掉
问题2:post如何传递参数到后台??
前端代码

<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="utf-8">
    <title>EditorMD</title>
{% load static %}
    <link type="text/css" href="../static/markdowneditor/lib/codemirror/codemirror.min.css" >
    <script type="text/javascript" src="../static/markdowneditor/jquery/jquery-3.1.1.min.js"></script>
    <script type="text/javascript" src="../static/markdowneditor/editormd.min.js"></script>
    <link rel="stylesheet" href="../static/markdowneditor/css/editormd.css">
</head>

<body>
<img src="../static/test.png" alt="测试访问静态资源 ">
标题<input type="text" name="title"><br>
正文<div class="editormd" id=""$id>
    <textarea class="editormd-markdown-textarea" name="$id-markdown-doc"></textarea>
    <!-- html textarea 需要开启配置项 saveHTMLToTextarea == true -->
    <textarea class="editormd-html-textarea" name="$id-html-code"></textarea>
</div>
<div id="layout">
    <header>
        <h1>动态创建 Editor.md</h1>
        <p>Dynamic create Editor.md</p>
        <br>
        <div class="btns" style="margin:0;">
            <button id="create-btn">动态创建一个 Editor.md</button>
            <button id="remove-btn">移除 Editor.md</button>
        </div>
    </header>
</div>
<button id="publish">发布</button>
显示提交内容<div id="content"></div>
<script type="text/javascript">
    var testEditormd;

    $(function () {
        $("#create-btn").click(function () {

            $("#layout").append("<div id=\"test-editormd\"></div>");

            testEditormd = editormd("test-editormd", {
                width: "90%",
                height: 640,
                emoji: false,
                markdown: "### 动态创建 Editor.md\r\n\r\nDynamic create Editor.md",
                path: '../static/markdowneditor/lib/',
                saveHTMLToTextarea:true
            });

        });

        $("#remove-btn").click(function () {
            testEditormd.editor.remove();
        });
        $("#publish").click(function(){
            alert("点击了发布!")
            alert(testEditormd.getPreviewedHTML())
            //ajax提交数据
            $.post("publishblog",{title:$("#title").val(),content:testEditormd.getPreviewedHTML()},function(data){
                alert(data)
            })
            $("#content").append(testEditormd.getPreviewedHTML())

        })
    });
</script>
<p>{{ rlt }}</p>


<script>


</script>
</body>



后台代码:urls.py

urlpatterns = [
   path('publishblog',ArticleService.publishArticle),
   ]

ArticleService.py

from django.http import HttpResponse

from pyBlog.dao import BlogDao
import json

#发表博客,暂时不接受参数,
def publishArticle(request):
    resp = {'errorcode': 100, 'detail': '保存成功!'}
    print("request:",request)
    # if BlogDao.saveOrUpdate(title,content) != True:
    #      resp['detial'] = "保存失败"

    return HttpResponse(json.dumps(resp), content_type="application/json",)

def getArticlesList(request):
    resp = {'errorcode': 100, 'data': 'null'}
    resp['data']= BlogDao.getArticles()
    return HttpResponse(json.dumps(resp), content_type="application/json")

效果:可以访问到后台,并且返回json格式数据
截图:
这里写图片描述

猜你喜欢

转载自blog.csdn.net/qq_36922927/article/details/80819229
今日推荐