Use IndieAuth for client ID (#1427)

* Use IndieAuth for client ID

* Lint
This commit is contained in:
Paulus Schoutsen 2018-07-09 18:24:49 +02:00 committed by GitHub
parent 13819937a7
commit 2e4ddebcda
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
6 changed files with 30 additions and 28 deletions

View File

@ -35,7 +35,6 @@ class HaAuthFlow extends EventsMixin(PolymerElement) {
return {
authProvider: Object,
clientId: String,
clientSecret: String,
redirectUri: String,
oauth2State: String,
_state: {
@ -54,10 +53,8 @@ class HaAuthFlow extends EventsMixin(PolymerElement) {
fetch('/auth/login_flow', {
method: 'POST',
headers: {
Authorization: `Basic ${btoa(`${this.clientId}:${this.clientSecret}`)}`
},
body: JSON.stringify({
client_id: this.clientId,
handler: [this.authProvider.type, this.authProvider.id],
redirect_uri: this.redirectUri,
})
@ -89,12 +86,13 @@ class HaAuthFlow extends EventsMixin(PolymerElement) {
}
this._state = 'loading';
const postData = Object.assign({}, this._stepData, {
client_id: this.clientId,
});
fetch(`/auth/login_flow/${this._step.flow_id}`, {
method: 'POST',
headers: {
Authorization: `Basic ${btoa(`${this.clientId}:${this.clientSecret}`)}`
},
body: JSON.stringify(this._stepData)
body: JSON.stringify(postData)
}).then((response) => {
if (!response.ok) throw new Error();
return response.json();

View File

@ -45,17 +45,12 @@ class HaPickAuthProvider extends EventsMixin(PolymerElement) {
},
authProviders: Array,
clientId: String,
clientSecret: String,
};
}
connectedCallback() {
super.connectedCallback();
fetch('/auth/providers', {
headers: {
Authorization: `Basic ${btoa(`${this.clientId}:${this.clientSecret}`)}`
}
}).then((response) => {
fetch('/auth/providers').then((response) => {
if (!response.ok) throw new Error();
return response.json();
}).then((authProviders) => {

View File

@ -1,12 +1,10 @@
export default function fetchToken(clientId, code) {
const data = new FormData();
data.append('client_id', clientId);
data.append('grant_type', 'authorization_code');
data.append('code', code);
return fetch('/auth/token', {
method: 'POST',
headers: {
authorization: `Basic ${btoa(clientId)}`
},
body: data,
}).then((resp) => {
if (!resp.ok) throw new Error('Unable to fetch tokens');

View File

@ -1,12 +1,10 @@
export default function refreshAccessToken(clientId, refreshToken) {
const data = new FormData();
data.append('client_id', clientId);
data.append('grant_type', 'refresh_token');
data.append('refresh_token', refreshToken);
return fetch('/auth/token', {
method: 'POST',
headers: {
authorization: `Basic ${btoa(clientId)}`
},
body: data,
}).then((resp) => {
if (!resp.ok) throw new Error('Unable to fetch tokens');

View File

@ -19,11 +19,22 @@ class HaAuthorize extends PolymerElement {
<div class="layout vertical center fit">
<img src="/static/icons/favicon-192x192.png" height="192">
<p>Logging in to <b>[[clientId]]</b>.</p>
<template is="dom-if" if="[[_authProvider]]">
<ha-auth-flow client-id="[[clientId]]" client-secret="[[clientSecret]]" redirect-uri="[[redirectUri]]" oauth2-state="[[oauth2State]]" auth-provider="[[_authProvider]]" on-reset="_handleReset">
</ha-auth-flow></template>
<ha-auth-flow
client-id="[[clientId]]"
redirect-uri="[[redirectUri]]"
oauth2-state="[[oauth2State]]"
auth-provider="[[_authProvider]]"
on-reset="_handleReset"
></ha-auth-flow>
</template>
<template is="dom-if" if="[[!_authProvider]]">
<ha-pick-auth-provider client-id="[[clientId]]" client-secret="[[clientSecret]]" on-pick="_handleAuthProviderPick"></ha-pick-auth-provider>
<ha-pick-auth-provider
client-id="[[clientId]]"
on-pick="_handleAuthProviderPick"
></ha-pick-auth-provider>
</template>
</div>
`;
@ -36,7 +47,6 @@ class HaAuthorize extends PolymerElement {
value: null,
},
clientId: String,
clientSecret: String,
redirectUri: String,
oauth2State: String,
};
@ -53,7 +63,6 @@ class HaAuthorize extends PolymerElement {
}
const props = {};
if (query.client_id) props.clientId = query.client_id;
if (query.client_secret) props.clientSecret = query.client_secret;
if (query.redirect_uri) props.redirectUri = query.redirect_uri;
if (query.state) props.oauth2State = query.state;
this.setProperties(props);

View File

@ -28,19 +28,23 @@ const init = window.createHassConnection = function (password, accessToken) {
});
};
function clientId() {
return `${location.protocol}//${location.host}/`;
}
function redirectLogin() {
document.location = `${__PUBLIC_PATH__}authorize.html?response_type=code&client_id=${window.clientId}&redirect_uri=/`;
document.location = `${__PUBLIC_PATH__}authorize.html?response_type=code&client_id=${encodeURIComponent(clientId())}&redirect_uri=${encodeURIComponent(location.toString())}`;
}
window.refreshToken = () =>
refreshToken_(window.clientId, window.tokens.refresh_token).then((accessTokenResp) => {
refreshToken_(clientId(), window.tokens.refresh_token).then((accessTokenResp) => {
window.tokens.access_token = accessTokenResp.access_token;
localStorage.tokens = JSON.stringify(window.tokens);
return accessTokenResp.access_token;
}, () => redirectLogin());
function resolveCode(code) {
fetchToken(window.clientId, code).then((tokens) => {
fetchToken(clientId(), code).then((tokens) => {
localStorage.tokens = JSON.stringify(tokens);
// Refresh the page and have tokens in place.
document.location = location.pathname;