jeans/frontend
jeans/frontend
1
0
Fork 0
mirror of https://github.com/home-assistant/frontend.git synced 2025-07-15 13:26:34 +00:00
Code Issues Packages Projects Releases Wiki Activity

Warn if iframe won't be able to load the website (#10217)

Browse Source
This commit is contained in:
Paulus Schoutsen 2021-10-15 00:03:51 -07:00 committed by GitHub
parent 3f2cce936c
commit 4b77910e4f
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
2 changed files with 26 additions and 3 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

26
src/panels/lovelace/cards/hui-iframe-card.ts
View File

@ -1,10 +1,12 @@
import { css, CSSResultGroup, html, LitElement, TemplateResult } from "lit"; import { css, CSSResultGroup, html, LitElement, TemplateResult } from "lit";
import { customElement, property } from "lit/decorators"; import { customElement, property, state } from "lit/decorators";
import { styleMap } from "lit/directives/style-map"; import { styleMap } from "lit/directives/style-map";
import parseAspectRatio from "../../../common/util/parse-aspect-ratio"; import parseAspectRatio from "../../../common/util/parse-aspect-ratio";
import "../../../components/ha-card"; import "../../../components/ha-card";
import "../../../components/ha-alert";
import { LovelaceCard, LovelaceCardEditor } from "../types"; import { LovelaceCard, LovelaceCardEditor } from "../types";
import { IframeCardConfig } from "./types"; import { IframeCardConfig } from "./types";
import type { HomeAssistant } from "../../../types";
@customElement("hui-iframe-card") @customElement("hui-iframe-card")
export class HuiIframeCard extends LitElement implements LovelaceCard { export class HuiIframeCard extends LitElement implements LovelaceCard {
@ -24,7 +26,9 @@ export class HuiIframeCard extends LitElement implements LovelaceCard {
@property({ type: Boolean, reflect: true }) @property({ type: Boolean, reflect: true })
public isPanel = false; public isPanel = false;
@property() protected _config?: IframeCardConfig; @property() public hass?: HomeAssistant;
@state() protected _config?: IframeCardConfig;
public getCardSize(): number { public getCardSize(): number {
if (!this._config) { if (!this._config) {
@ -45,7 +49,7 @@ export class HuiIframeCard extends LitElement implements LovelaceCard {
} }
protected render(): TemplateResult { protected render(): TemplateResult {
if (!this._config) { if (!this._config || !this.hass) {
return html``; return html``;
} }
@ -59,6 +63,22 @@ export class HuiIframeCard extends LitElement implements LovelaceCard {
padding = "50%"; padding = "50%";
} }
const target_protocol = new URL(this._config.url, location.toString())
.protocol;
if (location.protocol === "https:" && target_protocol !== "https:") {
return html`
<ha-alert alert-type="error">
${this.hass!.localize(
"ui.panel.lovelace.cards.iframe.error_secure_context",
{
target_protocol,
context_protocol: location.protocol,
}
)}
</ha-alert>
`;
}
return html` return html`
<ha-card .header=${this._config.title}> <ha-card .header=${this._config.title}>
<div <div

3
src/translations/en.json
View File

@ -2982,6 +2982,9 @@
"call_service": "Call service {name}", "call_service": "Call service {name}",
"more_info": "Show more info: {name}" "more_info": "Show more info: {name}"
}, },
"iframe": {
"error_secure_context": "Unable to load iframes pointing at websites using {target_protocol} if Home Assistant is served over {context_protocol}."
},
"safe-mode": { "safe-mode": {
"header": "Safe Mode Activated", "header": "Safe Mode Activated",
"description": "Home Assistant ran into trouble while loading your configuration and is now running in safe mode. Take a look at the error log to see what went wrong." "description": "Home Assistant ran into trouble while loading your configuration and is now running in safe mode. Take a look at the error log to see what went wrong."