Browse Source

Prevent XSS with ng-select

When using ng-option

See https://github.com/ng-select/ng-select/issues/1363
tags/v4.3.1
Chocobozzz 1 week ago
parent
commit
2198bb5a19
No known key found for this signature in database GPG Key ID: 583A612D890159BE
4 changed files with 28 additions and 11 deletions
  1. +5
    -1
      client/src/app/+admin/system/jobs/jobs.component.ts
  2. +4
    -2
      client/src/app/shared/shared-forms/select/select-channel.component.ts
  3. +1
    -0
      client/src/app/shared/shared-video-miniature/video-filters-header.component.html
  4. +18
    -8
      client/src/app/shared/shared-video-miniature/video-filters.model.ts

+ 5
- 1
client/src/app/+admin/system/jobs/jobs.component.ts View File

@@ -2,6 +2,7 @@ import { SortMeta } from 'primeng/api'
import { Component, OnInit } from '@angular/core'
import { Notifier, RestPagination, RestTable } from '@app/core'
import { peertubeLocalStorage } from '@root-helpers/peertube-web-storage'
import { escapeHTML } from '@shared/core-utils/renderer'
import { Job, JobState, JobType } from '@shared/models'
import { JobStateClient } from '../../../../types/job-state-client.type'
import { JobTypeClient } from '../../../../types/job-type-client.type'
@@ -142,7 +143,10 @@ export class JobsComponent extends RestTable implements OnInit {

private loadJobStateAndType () {
const state = peertubeLocalStorage.getItem(JobsComponent.LOCAL_STORAGE_STATE)
if (state) this.jobState = state as JobState

// FIXME: We use <ng-option> that doesn't escape HTML
// https://github.com/ng-select/ng-select/issues/1363
if (state) this.jobState = escapeHTML(state) as JobState

const type = peertubeLocalStorage.getItem(JobsComponent.LOCAL_STORAGE_TYPE)
if (type) this.jobType = type as JobType


+ 4
- 2
client/src/app/shared/shared-forms/select/select-channel.component.ts View File

@@ -39,8 +39,10 @@ export class SelectChannelComponent implements ControlValueAccessor, OnChanges {

propagateChange = (_: any) => { /* empty */ }

writeValue (id: number) {
this.selectedId = id
writeValue (id: number | string) {
this.selectedId = typeof id === 'string'
? parseInt(id, 10)
: id
}

registerOnChange (fn: (_: any) => void) {


+ 1
- 0
client/src/app/shared/shared-video-miniature/video-filters-header.component.html View File

@@ -42,6 +42,7 @@
formControlName="sort"
[clearable]="false"
[searchable]="false"
[bindValue]="null"
>
<ng-option i18n value="-publishedAt">Sort by <strong>"Recently Added"</strong></ng-option>
<ng-option i18n value="-originallyPublishedAt">Sort by <strong>"Original Publication Date"</strong></ng-option>


+ 18
- 8
client/src/app/shared/shared-video-miniature/video-filters.model.ts View File

@@ -1,7 +1,8 @@
import { splitIntoArray, toBoolean } from '@app/helpers'
import { getAllPrivacies } from '@shared/core-utils'
import { AttributesOnly } from '@shared/typescript-utils'
import { escapeHTML } from '@shared/core-utils/renderer'
import { BooleanBothQuery, NSFWPolicyType, VideoInclude, VideoPrivacy, VideoSortField } from '@shared/models'
import { AttributesOnly } from '@shared/typescript-utils'

type VideoFiltersKeys = {
[ id in keyof AttributesOnly<VideoFilters> ]: any
@@ -90,19 +91,28 @@ export class VideoFilters {
}

load (obj: Partial<AttributesOnly<VideoFilters>>) {
if (obj.sort !== undefined) this.sort = obj.sort
// FIXME: We may use <ng-option> that doesn't escape HTML so prefer to escape things
// https://github.com/ng-select/ng-select/issues/1363

const escapeIfNeeded = (value: any) => {
if (typeof value === 'string') return escapeHTML(value)

return value
}

if (obj.sort !== undefined) this.sort = escapeIfNeeded(obj.sort) as VideoSortField

if (obj.nsfw !== undefined) this.nsfw = obj.nsfw
if (obj.nsfw !== undefined) this.nsfw = escapeIfNeeded(obj.nsfw) as BooleanBothQuery

if (obj.languageOneOf !== undefined) this.languageOneOf = splitIntoArray(obj.languageOneOf)
if (obj.categoryOneOf !== undefined) this.categoryOneOf = splitIntoArray(obj.categoryOneOf)
if (obj.languageOneOf !== undefined) this.languageOneOf = splitIntoArray(escapeIfNeeded(obj.languageOneOf))
if (obj.categoryOneOf !== undefined) this.categoryOneOf = splitIntoArray(escapeIfNeeded(obj.categoryOneOf))

if (obj.scope !== undefined) this.scope = obj.scope
if (obj.scope !== undefined) this.scope = escapeIfNeeded(obj.scope) as VideoFilterScope
if (obj.allVideos !== undefined) this.allVideos = toBoolean(obj.allVideos)

if (obj.live !== undefined) this.live = obj.live
if (obj.live !== undefined) this.live = escapeIfNeeded(obj.live) as BooleanBothQuery

if (obj.search !== undefined) this.search = obj.search
if (obj.search !== undefined) this.search = escapeIfNeeded(obj.search)

this.buildActiveFilters()
}


Loading…
Cancel
Save