<source src="{$log['content']}" type="video/mp4" > 标签里type被直接渲染出来了,咋搞?

这是什么原因导致的,尝试了好几个浏览器都是这样,求大佬解答

尝试过增加结束标签

阅读 755
avatarAI BotBETA

如果<source>标签的type属性被直接渲染出来,而不是被浏览器识别和应用,这通常意味着浏览器没有正确地解析该标签或者该标签所处的上下文不正确。<source>标签通常应该作为<video><audio>元素的子元素使用,用来指定媒体资源。

首先,请确保你的<source>标签是嵌套在<video>标签内部的,并且<video>标签有正确的结束标签</video>。例如:

<video width="320" height="240" controls>
  <source src="{$log['content']}" type="video/mp4">
  您的浏览器不支持Video标签。
</video>

如果<source>标签是<video>标签的直接子元素,并且<video>标签也有正确的结束标签,但问题仍然存在,那么可能的原因包括:

  1. 变量替换问题:如果{$log['content']}是某种模板引擎的变量替换语法,请确保它已经被正确地替换成了有效的视频资源URL。
  2. 服务器问题:确保服务器支持所请求的MIME类型(在这个例子中是video/mp4),并且服务器响应头中的Content-Type也是正确的。
  3. 浏览器支持问题:虽然大部分现代浏览器都支持<video><source>标签,但老旧的浏览器可能不支持。请确保你正在使用的浏览器是支持这些特性的最新版本。
  4. 语法错误:检查整个HTML页面的其他部分,确保没有语法错误或遗漏的标签,这些错误可能会影响整个页面的解析。
  5. 编码问题:确保HTML文件的编码是正确的,并且<source>标签的src属性值没有被错误地编码或转义。
  6. 缓存问题:尝试清除浏览器缓存或使用无痕/隐私模式重新加载页面,以排除缓存导致的问题。
  7. 浏览器开发者工具:使用浏览器的开发者工具(如Chrome的DevTools)来检查网络请求和元素,查看是否有错误信息或警告,以及确保资源请求是成功的。

如果以上方法都不能解决问题,你可能需要提供更详细的代码和上下文信息,以便进一步分析问题所在。

2 个回答

因为你 log 的内容里有双引号,双引号和原来的双引号成对了,就会破坏 html 语义。
当然,要考虑的不只是双引号,这样直接往 html 里拼接字符串存在 XSS 注入风险。好在解决起来也简单,对 log 的内容进行防 XSS 过滤就行了(怎么过滤可以上网搜一下)。

临时解决就是模板变量放到js变量上,用js操作dom 赋值。

let videoSrc = `{$log['content']}`;
if(videoSrc){
    let videoElem = document.getElementById('video');
    if(videoElem){
        let sourceElem = videoElem.getElementsByTagName('source');
         if(sourceElem) {
            sourceElem.setAttribute("src", videoSrc);
        }
    }
}

注:ES6字符串模板“\`\`”不兼容IE。
https://developer.mozilla.org/zh-CN/docs/Web/JavaScript/Refer...

通义灵码:jsp html转义问题

1、使用JSTL的fn:escapeXml函数:
2、使用Apache Commons Lang库的StringEscapeUtils.escapeHtml方法 定义宏
3、使用内置的encodeForHTML方法(Java 8+)
撰写回答
你尚未登录,登录后可以
  • 和开发者交流问题的细节
  • 关注并接收问题和回答的更新提醒
  • 参与内容的编辑和改进,让解决方法与时俱进
宣传栏