作者:死神邀请我 | 来源:互联网 | 2022-12-02 16:17
这更像是一种“您能确认这是正确的”问题吗,因为我认为我在编写问题的过程中已解决了该问题,但希望对其他有些犹豫的人有所帮助实施DOMPurify。
简洁版本
DOMPurify
在前端js文件中像这样导入和使用是否安全/有效:
npm install dompurify --save
import DOMPurify from 'dompurify';
var clean = DOMPurify.sanitize(' ', {SAFE_FOR_JQUERY: true});
详细版本
目前,我的主要前端js文件使用以下约定导入:
import ClipboardJS from 'clipboard';
// date-fns functions
import getYear from 'date-fns/get_year';
import getMonth from 'date-fns/get_month';
import getDaysInMonth from 'date-fns/get_days_in_month';
import startOfMonth from 'date-fns/start_of_month';
import getDay from 'date-fns/get_day';
import format from 'date-fns/format';
import COOKIEs from './js.COOKIE';
我尝试了以下方法:
npm install dompurify --save
import DOMPurify from 'dompurify';
console.log(DOMPurify.sanitize(' ', {SAFE_FOR_JQUERY: true}));
console.log(DOMPurify.sanitize('', {SAFE_FOR_JQUERY: true}));
console.log(DOMPurify.sanitize('abcdef', {SAFE_FOR_JQUERY: true}));
console.log(DOMPurify.sanitize('', {SAFE_FOR_JQUERY: true}));
console.log(DOMPurify.sanitize('HELLO ', {SAFE_FOR_JQUERY: true}));
console.log(DOMPurify.sanitize('', {SAFE_FOR_JQUERY: true}));
字符串示例来自此处:
https://github.com/cure53/DOMPurify#some-purification-samples-please
并使用SAFE_FOR_JQUERY
此处提到的标志:
https://github.com/cure53/DOMPurify#can-i-configure-it
一切都按预期方式记录,即:
abcdef
这样很好。
题
该官员DOMPurify自述显示以下方式来进口和使用:
// method 01
var clean = DOMPurify.sanitize(dirty);
// method 02
require(['dompurify'], function(DOMPurify) {
var clean = DOMPurify.sanitize(dirty);
});
// method 03
npm install dompurify
const createDOMPurify = require('dompurify');
const { JSDOM } = require('jsdom');
const window = (new JSDOM('')).window;
const DOMPurify = createDOMPurify(window);
const clean = DOMPurify.sanitize(dirty);
// method 04
const createDOMPurify = require('dompurify');
const jsdom = require('jsdom').jsdom;
const window = jsdom('').defaultView;
const DOMPurify = createDOMPurify(window);
const clean = DOMPurify.sanitize(dirty);
即使未列出我的实现方式,这仍然是一种安全/有效的方法:
npm install dompurify --save
import DOMPurify from 'dompurify';
PS,如果上下文需要...
实现方案为:
01)
用户以范围开始:
here is previously saved value
02)
单击范围时,会将的值data-previous_value
添加到input
替换的元素中span
。
03)
用户修改input
元素中的文本,然后单击“保存”。
04)
我使用markdown-it,将html
选项设置为,false
并将markdown-it-attrs(添加css样式)和markdown-it-span(定义spans
)用于将任何markdown呈现为html(链接,图像,类,跨度等)。
05)
新值将添加到新span
元素(用渲染markdown-it
)和data
属性(未渲染)中,以替换该input
元素。
06)
未渲染的新值MongoDB
通过保存在数据库中Node/Express
。
例如,以下输入:
![img](/img/my_thumb.jpg){.video_thumb} [Video](https://www.youtube.com/watch?v=dQw4w9WgXcQ)
转换为此HTML:
Video
我正在考虑在输入DOMPurify
到达markdown-it
之前(步骤04之前)对输入进行消毒。
推荐阅读
Iwouldliketobeabletohaveasidebarthatcanbetoggledinandoutonabuttonpress.However ...
[详细]
蜡笔小新 2023-10-13 12:28:22
IjustinheritedsomewebpageswhichusesMooTools.IneverusedMooTools.NowIneedtoaddsomef ...
[详细]
蜡笔小新 2023-12-12 13:43:58
本文介绍了sklearn数据集库中常用的数据集类型,包括玩具数据集和样本生成器。其中详细介绍了波士顿房价数据集,包含了波士顿506处房屋的13种不同特征以及房屋价格,适用于回归任务。 ...
[详细]
蜡笔小新 2023-12-13 17:45:15
本文记录了学习Python正则表达式的过程,介绍了re模块的常用方法re.search,并解释了rawstring的作用。正则表达式是一种方便检查字符串匹配模式的工具,通过本文的学习可以掌握Python中使用正则表达式的基本方法。 ...
[详细]
蜡笔小新 2023-12-13 16:37:19
关键词:Golang, Cookie, 跟踪位置, net/http/cookiejar, package main, golang.org/x/net/publicsuffix, io/ioutil, log, net/http, net/http/cookiejar ...
[详细]
蜡笔小新 2023-12-13 15:47:22
Ihavethefollowingonhtml我在html上有以下内容<html><head><scriptsrc..3003_Tes ...
[详细]
蜡笔小新 2023-12-12 15:59:36
本文详细介绍了Python中使用SQLAlchemy库的方法。首先对SQLAlchemy进行了简介,包括其定义、适用的数据库类型等。然后讨论了SQLAlchemy提供的两种主要使用模式,即SQL表达式语言和ORM。针对不同的需求,给出了选择哪种模式的建议。最后,介绍了连接数据库的方法,包括创建SQLAlchemy引擎和执行SQL语句的接口。 ...
[详细]
蜡笔小新 2023-12-12 15:23:06
本文介绍了Android实战中使用jsoup实现网络爬虫的方法,以糗事百科项目为例。对于初学者来说,数据源的缺乏是做项目的最大烦恼之一。本文讲述了如何使用网络爬虫获取数据,并以糗事百科作为练手项目。同时,提到了使用jsoup需要结合前端基础知识,以及如果学过JS的话可以更轻松地使用该框架。 ...
[详细]
蜡笔小新 2023-12-11 09:19:45
本文介绍了DataTables插件的官方网站以及其基本特点和使用方法,包括分页处理、数据过滤、数据排序、数据类型检测、列宽度自动适应、CSS定制样式、隐藏列等功能。同时还介绍了其易用性、可扩展性和灵活性,以及国际化和动态创建表格的功能。此外,还提供了参数初始化和延迟加载的示例代码。 ...
[详细]
蜡笔小新 2023-12-09 17:40:33
本文详细介绍了在Linux虚拟化部署中进行VLAN配置的方法。首先要确认Linux系统内核是否已经支持VLAN功能,然后配置物理网卡、子网卡和虚拟VLAN网卡的关系。接着介绍了在Linux配置VLAN Trunk的步骤,包括将物理网卡添加到VLAN、检查添加的VLAN虚拟网卡信息以及重启网络服务等。最后,通过验证连通性来确认配置是否成功。 ...
[详细]
蜡笔小新 2023-12-09 03:55:11
我正在尝试使用scrapycrallsingle运行完美运行的scrapy蜘蛛,但我无法在python脚本中运行它.主要问题是从不执行SingleBlogSpider.parse方 ...
[详细]
蜡笔小新 2023-10-17 12:11:15
本文介绍了在满足特定条件时如何在输入字段中使用默认值的方法和相应的代码。当输入字段填充100或更多的金额时,使用50作为默认值;当输入字段填充有-20或更多(负数)时,使用-10作为默认值。文章还提供了相关的JavaScript和Jquery代码,用于动态地根据条件使用默认值。 ...
[详细]
蜡笔小新 2023-12-10 12:35:46
本文介绍了影响网站打开时间的两个因素,即网页加载速度和网站页面大小。重点讲解了如何通过压缩网站页面来减少页面加载时间。具体包括图片压缩、Javascript压缩、CSS压缩和HTML压缩等方法,并推荐了相应的压缩工具。此外,还提到了一款Google Chrome插件——网页加载速度分析工具Speed Tracer。 ...
[详细]
蜡笔小新 2023-12-09 09:17:00
Ihaveaforminadirectivetemplate:我在指令模板中有一个表单:<formn ...
[详细]
蜡笔小新 2023-10-17 12:22:38
篇首语:本文由编程笔记#小编为大家整理,主要介绍了python之Bottle框架相关的知识,希望对你有一定的参考价值。一、简单的Bottle框架1)bott ...
[详细]
蜡笔小新 2023-10-13 12:28:34