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

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

View File

@ -1,10 +1,12 @@
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 parseAspectRatio from "../../../common/util/parse-aspect-ratio";
import "../../../components/ha-card";
import "../../../components/ha-alert";
import { LovelaceCard, LovelaceCardEditor } from "../types";
import { IframeCardConfig } from "./types";
import type { HomeAssistant } from "../../../types";
@customElement("hui-iframe-card")
export class HuiIframeCard extends LitElement implements LovelaceCard {
@ -24,7 +26,9 @@ export class HuiIframeCard extends LitElement implements LovelaceCard {
@property({ type: Boolean, reflect: true })
public isPanel = false;
@property() protected _config?: IframeCardConfig;
@property() public hass?: HomeAssistant;
@state() protected _config?: IframeCardConfig;
public getCardSize(): number {
if (!this._config) {
@ -45,7 +49,7 @@ export class HuiIframeCard extends LitElement implements LovelaceCard {
}
protected render(): TemplateResult {
if (!this._config) {
if (!this._config || !this.hass) {
return html``;
}
@ -59,6 +63,22 @@ export class HuiIframeCard extends LitElement implements LovelaceCard {
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`
<ha-card .header=${this._config.title}>
<div

View File

@ -2982,6 +2982,9 @@
"call_service": "Call service {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": {
"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."