Verified Commit 0ea2f79d authored by Chocobozzz's avatar Chocobozzz
Browse files

Safer image preview

parent 4546d92e
import { Component, ElementRef, EventEmitter, Input, OnInit, Output, ViewChild } from '@angular/core'
import { DomSanitizer, SafeResourceUrl } from '@angular/platform-browser'
import { Notifier, ServerService } from '@app/core'
import { Account, VideoChannel } from '@app/shared/shared-main'
import { NgbPopover } from '@ng-bootstrap/ng-bootstrap'
import { getBytes } from '@root-helpers/bytes'
import { imageToDataURL } from '@root-helpers/images'
@Component({
selector: 'my-actor-avatar-edit',
......@@ -30,10 +30,9 @@ export class ActorAvatarEditComponent implements OnInit {
maxAvatarSize = 0
avatarExtensions = ''
preview: SafeResourceUrl
preview: string
constructor (
private sanitizer: DomSanitizer,
private serverService: ServerService,
private notifier: Notifier
) { }
......@@ -63,7 +62,7 @@ export class ActorAvatarEditComponent implements OnInit {
this.avatarChange.emit(formData)
if (this.previewImage) {
this.preview = this.sanitizer.bypassSecurityTrustResourceUrl(URL.createObjectURL(avatarfile))
imageToDataURL(avatarfile).then(result => this.preview = result)
}
}
......
import { Component, ElementRef, EventEmitter, Input, OnInit, Output, ViewChild } from '@angular/core'
import { DomSanitizer, SafeResourceUrl } from '@angular/platform-browser'
import { SafeResourceUrl } from '@angular/platform-browser'
import { Notifier, ServerService } from '@app/core'
import { VideoChannel } from '@app/shared/shared-main'
import { NgbPopover } from '@ng-bootstrap/ng-bootstrap'
import { getBytes } from '@root-helpers/bytes'
import { imageToDataURL } from '@root-helpers/images'
@Component({
selector: 'my-actor-banner-edit',
......@@ -30,7 +31,6 @@ export class ActorBannerEditComponent implements OnInit {
preview: SafeResourceUrl
constructor (
private sanitizer: DomSanitizer,
private serverService: ServerService,
private notifier: Notifier
) { }
......@@ -59,7 +59,7 @@ export class ActorBannerEditComponent implements OnInit {
this.bannerChange.emit(formData)
if (this.previewImage) {
this.preview = this.sanitizer.bypassSecurityTrustResourceUrl(URL.createObjectURL(bannerfile))
imageToDataURL(bannerfile).then(result => this.preview = result)
}
}
......
import { Component, Input } from '@angular/core'
import { SafeResourceUrl } from '@angular/platform-browser'
import { VideoChannel } from '../shared-main'
import { Account } from '../shared-main/account/account.model'
......@@ -22,7 +21,7 @@ export class ActorAvatarComponent {
@Input() account: ActorInput
@Input() channel: ActorInput
@Input() previewImage: SafeResourceUrl
@Input() previewImage: string
@Input() size: ActorAvatarSize
......
import { Component, forwardRef, Input, OnInit } from '@angular/core'
import { ControlValueAccessor, NG_VALUE_ACCESSOR } from '@angular/forms'
import { DomSanitizer, SafeResourceUrl } from '@angular/platform-browser'
import { ServerService } from '@app/core'
import { imageToDataURL } from '@root-helpers/images'
import { HTMLServerConfig } from '@shared/models'
import { BytesPipe } from '../shared-main'
......@@ -23,7 +23,7 @@ export class PreviewUploadComponent implements OnInit, ControlValueAccessor {
@Input() previewWidth: string
@Input() previewHeight: string
imageSrc: SafeResourceUrl
imageSrc: string
allowedExtensionsMessage = ''
maxSizeText: string
......@@ -32,7 +32,6 @@ export class PreviewUploadComponent implements OnInit, ControlValueAccessor {
private file: Blob
constructor (
private sanitizer: DomSanitizer,
private serverService: ServerService
) {
this.bytesPipe = new BytesPipe()
......@@ -81,8 +80,7 @@ export class PreviewUploadComponent implements OnInit, ControlValueAccessor {
private updatePreview () {
if (this.file) {
const url = URL.createObjectURL(this.file)
this.imageSrc = this.sanitizer.bypassSecurityTrustResourceUrl(url)
imageToDataURL(this.file).then(result => this.imageSrc = result)
}
}
}
function imageToDataURL (input: File | Blob) {
return new Promise<string>(res => {
const reader = new FileReader()
reader.onerror = err => console.error('Cannot read input file.', err)
reader.onloadend = () => res(reader.result as string)
reader.readAsDataURL(input)
})
}
export {
imageToDataURL
}
export * from './users'
export * from './bytes'
export * from './images'
export * from './peertube-web-storage'
export * from './utils'
export * from './plugins-manager'
Markdown is supported
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment