背景图片路径问题
使用编辑器上传文件,存入数据库的路径很多时候像这样:
20180820\6cbb383c55a6078fdf4f2be34fcbf61b.png
在h5的img中直接使用这些路径,没有问题。但是当作为背景图片时,反斜杠\就会导致图片不能显示。
style="background-image:url('/uploads/img/20180820\111.png'});"
这时候需要把反斜杠‘\’替换为‘/’
输入过滤问题
- 我们有一个用户的输入字符:$str = “<span class=“ddf”>抽检通过</span><script>alert(‘666’);</script>”;
- 对于用户提交的文本内容,我们在插入数据库是要通过sql注入过滤。
sql注入过滤一般使用htmlspecialchars,在数据插入数据库前把字符串中的html标签和符号转换为实体,转化后如下:
<span class="ddf">抽检通过</span><script>alert('666');</script>
-
然后把该字符串保存到数据库。该字符串读取到html页面时,会原样输出html标签和符号。
-
当该字符串是由富文本框提交而来时,说明html标签中的样式是需要执行的,此时再原样输出到页面时,就不能正确的展示文本的样式。我们可以使用htmlspecialchars_decode把字符串中的html实体符号还原回html标签。
-
但是这样的话,js标签也被还原了,此时字符串输出到html时,js代码会被执行,造成xss攻击。这个时候我们需要再次处理字符串,把字符串中的script标签转换为实体字符,来避免可能的xss攻击。当前端只需过滤xss时,可直接把字符串中的js代码删除掉。在yii2中可使用\yii\helpers\HtmlPurifier::process($str),把js代码过滤掉。
html代码页面拷贝问题
问题描述
在页面中,我们需要拷贝一个表单时,可以通过outerhtml获取表单的的html。但是当我们在页面输入修改表单的值后,再复制表单,发现拷贝的表单中的值还是原始值。
问题原因
这是因为我们在页面输入和修改表单值后,只是修改了内存中表单对应的值,并没有改变页面中表单的html代码。要修改元素对应的html,可以使用js的setAttribute(‘属性名’,‘属性值’)方法
解决方法
var clone_obj = '要复制的元素对象';
$("input,textarea,button", clone_obj).each(function () {
this.setAttribute('value', this.value);
});
$(":radio,:checkbox", clone_obj).each(function () {
// im not really even sure you need to do this for "checked"
// but what the heck, better safe than sorry
if (this.checked) this.setAttribute('checked', 'checked');
else this.removeAttribute('checked');
});
$("option", clone_obj).each(function () {
if (this.selected) this.setAttribute('selected', 'selected');
else this.removeAttribute('selected');
});
var add_html = clone_obj.prop('outerHTML');
注意
复制时,select表单的name要设置为不重复的值