There is no a attribute like react's $$typeof to prevent XSS injection in the vnode of Vue.

[ddosakura]

Version

Reproduction link

https://codepen.io/ddosakura/pen/eYYgYqZ

Steps to reproduce

vue 的 vnode 中，没有一个类似 react 的 $$typeof 属性来防止 XSS 注入。

const inject = {
  tag: "div",
  children: [
    {
      text: "injecting"
    }
  ]
}
const no_inject = "no_inject"

const InjectTest = () => {
  return <div>
    { inject }
    { no_inject }
  </div>
}

What is expected?

希望像 React 中一样，在 vnode 中添加类似 $$typeof 的 Symbol 属性来防止 XSS 注入。

What is actually happening?

一个伪造的 vnode 对象，会被正常渲染成 dom。

[sirlancelot]

I suspect this has to do with JSX and is not related to the Vue.js project

[ddosakura]

I suspect this has to do with JSX and is not related to the Vue.js project

JSX仅仅是语法糖，不使用JSX依旧有该问题。 JSX is just a syntactic sugar. There is still a problem without JSX.

这是一个不使用JSX的例子。 This is an example without JSX.

codepen

问题的所在是Vue无法判断一个VNode是由createElement创建，或是被伪造的。 The problem is that Vue cannot judge whether a vnode is created by createElement or forged.

由于json无法反序列化出Symbol,使用类似React的添加$$typeof属性的方案可以规避这个问题。

中文参考连接

and React Components, Elements, and Instances

All React elements require an additional $$typeof: Symbol.for('react.element') field declared on the object for security reasons. It is omitted in the examples above. This blog entry uses inline objects for elements to give you an idea of what’s happening underneath but the code won’t run as is unless you either add $$typeof to the elements, or change the code to use React.createElement() or JSX.

[ddosakura]

追加一个根据此问题在 element-ui 中找到的注入：codepen

[Kingwl]

Thanks for the reminder. Add this check to avoid some kind of xss is not a bad idea. The only question is, Symbol has terrible compatibility. All of IE does not support Symbol.

cc:/ @yyx990803

[sirlancelot]

I think a couple well-placed obj instanceof VNode checks should do the trick. However, I am admittedly very weak in the vdom portion of the codebase.

[ghost]

@Kingwl Vue 3 doesn't support IE. This vulnerability is still showing up on my company's security scans as a 7/10. @yyx990803 Are you aware of this?

[samsoft05]

@ddosakura I think this is relevant only if we use render functions instead of Vue templates, but still, it's good to fix this. cc: @yyx990803

[uoc1691]

Sonatype is flagging this as a Severe vulnerability

I also noticed this.

Which makes sense. I guess, It's the responsibility of the users of the library to make sure external content is secure.