butterfly/projects
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

fix: browser uses DomSanitizer for iframe, key-based reload instead of URL hack

Browse Source
This commit is contained in:
Butterfly Dev 2026-04-07 04:01:56 +00:00
parent ef1b8dfa4e
commit cecca9f90f
2 changed files with 16 additions and 3 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

3
desktop/src/app/components/apps/browser/browser.component.html
View File

@ -17,7 +17,8 @@
<!-- Content --> <!-- Content -->
<div class="browser-content"> <div class="browser-content">
<iframe <iframe
[src]="url()" [src]="safeUrl()"
[attr.key]="reloadKey()"
class="browser-frame" class="browser-frame"
sandbox="allow-same-origin allow-scripts allow-forms" sandbox="allow-same-origin allow-scripts allow-forms"
(load)="onLoad()" (load)="onLoad()"

16
desktop/src/app/components/apps/browser/browser.component.ts
View File

@ -1,5 +1,6 @@
import { Component, signal } from '@angular/core'; import { Component, signal } from '@angular/core';
import { CommonModule } from '@angular/common'; import { CommonModule } from '@angular/common';
import { DomSanitizer, SafeResourceUrl } from '@angular/platform-browser';
@Component({ @Component({
selector: 'app-browser', selector: 'app-browser',
@ -12,6 +13,15 @@ export class BrowserComponent {
readonly url = signal('https://www.wikipedia.org'); readonly url = signal('https://www.wikipedia.org');
readonly inputUrl = signal('https://www.wikipedia.org'); readonly inputUrl = signal('https://www.wikipedia.org');
readonly isLoading = signal(false); readonly isLoading = signal(false);
/** Used to force iframe reload without URL hacks. */
readonly reloadKey = signal(0);
constructor(private sanitizer: DomSanitizer) {}
/** Sanitized URL safe for iframe [src] binding. */
readonly safeUrl = signal<SafeResourceUrl>(
this.sanitizer.bypassSecurityTrustResourceUrl('https://www.wikipedia.org'),
);
navigate(): void { navigate(): void {
let target = this.inputUrl().trim(); let target = this.inputUrl().trim();
@ -20,6 +30,8 @@ export class BrowserComponent {
} }
this.inputUrl.set(target); this.inputUrl.set(target);
this.url.set(target); this.url.set(target);
this.safeUrl.set(this.sanitizer.bypassSecurityTrustResourceUrl(target));
this.isLoading.set(true);
} }
onUrlKeydown(event: KeyboardEvent): void { onUrlKeydown(event: KeyboardEvent): void {
@ -34,7 +46,7 @@ export class BrowserComponent {
refresh(): void { refresh(): void {
this.isLoading.set(true); this.isLoading.set(true);
this.url.set(this.url() + ' '); // Force iframe reload // Bump the key to force Angular to recreate the iframe element.
setTimeout(() => this.url.set(this.inputUrl()), 50); this.reloadKey.update((k) => k + 1);
} }
} }