V2EX = way to explore
V2EX 是一个关于分享和探索的地方
现在注册
已注册用户请  登录
推荐学习书目
Learn Python the Hard Way
Python Sites
PyPI - Python Package Index
http://diveintopython.org/toc/index.html
Pocoo
值得关注的项目
PyPy
Celery
Jinja2
Read the Docs
gevent
pyenv
virtualenv
Stackless Python
Beautiful Soup
结巴中文分词
Green Unicorn
Sentry
Shovel
Pyflakes
pytest
Python 编程
pep8 Checker
Styles
PEP 8
Google Python Style Guide
Code Style from The Hitchhiker's Guide
sugarkeek
V2EX  ›  Python

前后端页面分离如何 JSON 传输富文本?

  •  
  •   sugarkeek · 2019-07-09 14:14:44 +08:00 · 5002 次点击
    这是一个创建于 1745 天前的主题,其中的信息可能已经有所发展或是发生改变。

    基于 Flask 和 Vue 的前后端分离页面,后端使用富文本编辑器后保存的包含富文本的数据如何通过 JSON 接口传输。

    目前想到的方案:

    1. JSON 转义,前端在转义回去解析。=>感觉比较麻烦;
    2. 富文本编辑器换成 Markdown 语法。=>对于没接触 Markdown 的人来说不友好,而且 Markdown 语法中也涉及到特殊字符,也需要转义,还不如直接用富文本转义。

    一个疑问:

    1. 学长之前和我讲 JS 对象保持习惯用单引号 '', Html 标记语言习惯用双引号 "", 这样就不会引起歧义了。可是 JSON 文件中不都是双引号 "":""; 的形式吗?
    第 1 条附言  ·  2019-07-09 15:25:24 +08:00
    json 转义是指 json 里传输的富文本部分转义,不是整个 json 转义。
    16 条回复    2019-07-09 18:19:33 +08:00
    jinksw
        1
    jinksw  
       2019-07-09 14:43:32 +08:00
    不是很懂
    你自己手动拼接的 json 吗? 那样才涉及你自己去转义吧?
    Mutoo
        2
    Mutoo  
       2019-07-09 14:46:52 +08:00   ❤️ 1
    A1:JSON 是一种跨语言的协议,所以规范里规定 key 以及 string 都用双引号包围。以更好的兼容不同语言的解释器。

    至于你的问题,应该是如何正确将 HTML 文档存到字符串中。可以参考这篇文章:
    https://www.thorntech.com/2012/07/4-things-you-must-do-when-putting-html-in-json/

    前端 vue 可以用 v-html 直接引用这个字符串即可。但还需要考虑安全问题,防止 XSS。
    https://github.com/vuejs/vue/issues/6333
    zjyl1994
        3
    zjyl1994  
       2019-07-09 14:50:18 +08:00
    嗯?你的 json 是手拼的?我们 json 都会自动处理转义啊?
    icy37785
        4
    icy37785  
       2019-07-09 14:54:38 +08:00 via iPhone
    json 的转义不都是自的么。你手拼的话容易出错呀,还是让他自动转吧。
    mnssbe
        5
    mnssbe  
       2019-07-09 15:02:14 +08:00   ❤️ 2
    这时候可以用到“加密算法” base64 来解决你的烦恼
    sugarkeek
        6
    sugarkeek  
    OP
       2019-07-09 15:17:13 +08:00
    @zjyl1994 #3 还有这种操作吗?我试试。
    est
        7
    est  
       2019-07-09 15:17:57 +08:00   ❤️ 1
    富文本有多富?

    一般空格换行直接 <pre> 梭哈就行了。
    sugarkeek
        8
    sugarkeek  
    OP
       2019-07-09 15:19:36 +08:00
    @icy37785 #4 不知道原来能自动转义,我一直以为 json 里传特殊符号会可能会引起歧义,一直都是没敢加。我试试吧。
    sugarkeek
        9
    sugarkeek  
    OP
       2019-07-09 15:21:03 +08:00
    @Mutoo #2 感谢您的理解,确实是这个意思。我试试。
    IsaacYoung
        10
    IsaacYoung  
       2019-07-09 15:21:45 +08:00
    {
    html: "<div></div>"
    }
    sugarkeek
        11
    sugarkeek  
    OP
       2019-07-09 15:23:50 +08:00
    @est #7 哈哈,没想到那么多,目前能想到的就是富文本里双引号、空格、换行
    sugarkeek
        12
    sugarkeek  
    OP
       2019-07-09 15:25:48 +08:00
    @mnssbe #5 高级的玩法,复盘的时候试试。
    zjyl1994
        13
    zjyl1994  
       2019-07-09 15:43:55 +08:00
    @chenkeyan1 正常的 json 处理库都会自动转义的,不需要你自己操心
    Asice
        14
    Asice  
       2019-07-09 17:26:16 +08:00
    感觉要发明个三引号,引号不够用
    doublleft
        15
    doublleft  
       2019-07-09 17:30:55 +08:00
    js 处理可以 split 一下 \r \n 这种的,起码换行就搞定了
    est
        16
    est  
       2019-07-09 18:19:33 +08:00
    @chenkeyan1 那就<pre> 就行了。
    关于   ·   帮助文档   ·   博客   ·   API   ·   FAQ   ·   我们的愿景   ·   实用小工具   ·   1462 人在线   最高记录 6543   ·     Select Language
    创意工作者们的社区
    World is powered by solitude
    VERSION: 3.9.8.5 · 25ms · UTC 17:17 · PVG 01:17 · LAX 10:17 · JFK 13:17
    Developed with CodeLauncher
    ♥ Do have faith in what you're doing.