Add authentication support part 1

need FW v61 or more
This commit is contained in:
Luc
2020-10-07 11:25:00 +02:00
parent 4f3255b7cb
commit b915f3f592
11 changed files with 232 additions and 23 deletions

View File

Binary file not shown.

View File

Binary file not shown.

View File

@@ -23,6 +23,7 @@ import "../stylesheets/application.scss"
require(`../stylesheets/components/${process.env.TARGET_ENV}/_${process.env.TARGET_ENV}.scss`)
import { useState, useEffect } from "preact/hooks"
import { DialogPage, showDialog } from "./dialog"
import { disconnectWsServer } from "./websocket"
import { AboutPage } from "./about"
import { DashboardPage, updateTerminal } from "./dashboard"
import { SettingsPage, initApp, preferences, stopPolling } from "./settings"
@@ -141,6 +142,18 @@ function applyConfig(data) {
}
}
/*
* Disconnect Page
*/
function disconnectPage() {
disconnectWsServer({
type: "disconnect",
title: T("S150"),
message: T("S149"),
button1text: T("S8"),
})
}
/*
* App entry
*/
@@ -198,4 +211,5 @@ export {
beep,
stopPolling,
finishSetup,
disconnectPage,
}

View File

@@ -19,11 +19,107 @@
*/
import { h } from "preact"
import { useEffect } from "preact/hooks"
import { AlertTriangle, Info, HelpCircle } from "preact-feather"
import { useState, useEffect } from "preact/hooks"
import { AlertTriangle, Info, HelpCircle, Eye, EyeOff } from "preact-feather"
import { T } from "../translations"
import { useStoreon } from "storeon/preact"
import { Page, reloadPage, beepError } from "../app"
import { Page, reloadPage, beepError, disconnectPage } from "../app"
import { SubmitCredentials } from "../http"
/*
* Local variables
*
*/
let loginvalue = ""
let passwordvalue = ""
let passwordvisible = false
/*
* Some constants
*/
/*
* Login function
*
*/
function goLogIn() {
SubmitCredentials(loginvalue, passwordvalue)
}
/*
* Login entry
*
*/
const LoginEntry = () => {
const onInput = e => {
loginvalue = e.target.value
}
return (
<div class="input-group">
<label class="p-1 align-middle">{T("S146")}:</label>
<input
class="form-control"
style="width:8em"
type="text"
value={loginvalue}
placeholder={T("S41")}
onInput={onInput}
/>
</div>
)
}
/*
* Login entry
*
*/
const PasswordEntry = () => {
const [isvisible, setVisible] = useState(passwordvisible)
const onInput = e => {
passwordvalue = e.target.value
}
const onToggle = e => {
passwordvisible = !passwordvisible
setVisible(passwordvisible)
showDialog({ displayDialog: false })
showDialog({ type: "login" })
}
return (
<div class="input-group">
<label class="p-1 align-middle">{T("S147")}:</label>
<input
class="form-control"
type={isvisible ? "text" : "password"}
style="width:8em"
value={passwordvalue}
placeholder={T("S41")}
onInput={onInput}
/>
<div class="input-group-append ">
<button
class={
isvisible
? "d-none"
: "btn btn-light form-control border rounded-right"
}
onclick={onToggle}
>
<Eye size="1.0em" />
</button>
<button
class={
isvisible
? "btn btn-light form-control border rounded-right"
: "d-none"
}
onclick={onToggle}
>
<EyeOff size="1.0em" />
</button>
</div>
</div>
)
}
/*
*Spin loader
@@ -62,6 +158,10 @@ function disableNode(node, state) {
else node.removeAttribute("disabled")
}
/*
* showDialog function
*
*/
function showDialog(data) {
const { dispatch } = useStoreon()
if (typeof dispatch == "undefined") {
@@ -87,6 +187,10 @@ function showDialog(data) {
} else dispatch("displayDialog", true)
}
/*
* Update dialog
*
*/
function updateProgress(data) {
const { dispatch } = useStoreon()
let { dialogData } = useStoreon("dialogData")
@@ -103,6 +207,10 @@ function updateProgress(data) {
}
}
/*
* Hide dialog
*
*/
function hideDialog() {
const { dispatch } = useStoreon()
dispatch("displayDialog", false)
@@ -137,6 +245,21 @@ const DialogPage = () => {
title = T("S123")
}
}
if (dialogData.type == "login") {
title = T("S145")
//TODO ADD PROPER FORM
dialogData.message = (
<div>
<LoginEntry />
<div class="p-1" />
<PasswordEntry />
</div>
)
dialogData.button1text = T("S148")
dialogData.button2text = T("S28")
dialogData.next = goLogIn
dialogData.next2 = disconnectPage
}
if (typeof dialogData.icontitle != "undefined")
iconTitle = dialogData.icontitle
if (
@@ -246,7 +369,8 @@ const DialogPage = () => {
dialogData.type == "error" ||
dialogData.type == "progress"
? "btn btn-danger"
: dialogData.type == "confirmation" ||
: dialogData.type == "login" ||
dialogData.type == "confirmation" ||
((dialogData.type == "message" ||
dialogData.type == "custom") &&
dialogData.button1text)
@@ -267,7 +391,8 @@ const DialogPage = () => {
className={
dialogData.type == "confirmation"
? "btn btn-primary"
: (dialogData.type == "message" ||
: (dialogData.type == "login" ||
dialogData.type == "message" ||
dialogData.type == "custom") &&
dialogData.button2text
? "btn btn-primary"

View File

@@ -28,10 +28,10 @@ import { updateTerminal } from "../app"
* Local variables
*
*/
var httpCommandList = []
var isProcessingHttpCommand = false
var currentHttpCommand = {}
var lastError = {}
let httpCommandList = []
let isProcessingHttpCommand = false
let currentHttpCommand = {}
let lastError = {}
/*
* Some constants
@@ -93,7 +93,7 @@ function defaultHttpErrorFn(errorcode, response_text) {
var fn = httpCommandList[0].errorfn
if (errorcode == 401) {
requestAuthentication()
console.log("Authentication issue pls log")
return
} else {
fn(errorcode, response_text)
}
@@ -107,8 +107,13 @@ function defaultHttpErrorFn(errorcode, response_text) {
* Request Login/Password
*/
function requestAuthentication() {
//TODO
console.log("Need login password")
//remove previous failed command
if (httpCommandList.length > 0) {
if (httpCommandList[0].id == "login") httpCommandList.shift()
}
console.log(httpCommandList)
showDialog({ type: "login" })
}
/*
@@ -164,6 +169,7 @@ function SendGetHttp(url, result_fn, error_fn, progress_fn, id, max_id) {
httpCommandList.push(cmd)
processCommands()
}
/*
* Add post query to command list
*/
@@ -212,10 +218,52 @@ function SendPostHttp(
progressfn: progress_fn,
id: cmd_id,
}
//put command at the end of list
httpCommandList.push(cmd)
processCommands()
}
/*
* Send login credentials
*/
function SubmitCredentials(login, password, newpassword, timeout) {
let url = "/login"
let formData = new FormData()
if (typeof login != "undefined") {
formData.append("USER", login)
formData.append("PASSWORD", password)
//to allow to change user password
if (typeof newpassword != "undefined") {
formData.append("NEWPASSWORD", newpassword)
}
//to change the session timeout (default in FW is 360000)
if (typeof timeout != "undefined") {
formData.append("TIMEOUT", timeout)
}
formData.append("SUBMIT", "yes")
} else {
formData.append("DISCONNNECT", "yes")
}
var cmd = {
uri: url,
type: "POST",
isupload: false,
data: formData,
resultfn: null,
errorfn: null,
progressfn: null,
id: "login",
}
//put command at the top of list
httpCommandList.unshift(cmd)
console.log("New login")
console.log(httpCommandList)
isProcessingHttpCommand = false
processCommands()
}
/*
* Process all commands one by one
*/
@@ -248,8 +296,11 @@ function processCommands() {
: currentHttpCommand.responseText
)
} else {
if (currentHttpCommand.status == 401)
requestAuthentication()
console.log(
httpCommandList[0].uri +
" Command status " +
currentHttpCommand.status
)
defaultHttpErrorFn(
currentHttpCommand.status,
isdownload
@@ -292,7 +343,8 @@ function processCommands() {
console.log("Unknow request")
}
} else {
//if (httpCommandList.length == 0) console.log("Command list is empty")
if (isProcessingHttpCommand) console.log("busy processing")
if (httpCommandList.length == 0) console.log("Command list is empty")
}
}
@@ -310,4 +362,5 @@ export {
SendPostHttp,
cancelCurrentQuery,
lastError,
SubmitCredentials,
}

View File

@@ -31,11 +31,10 @@ import {
Download,
} from "preact-feather"
const { clearData } = require(`../${process.env.TARGET_ENV}`)
import { Setting, esp3dSettings } from "../app"
import { Setting, esp3dSettings, disconnectPage } from "../app"
import { prefs } from "../settings"
import { SendCommand } from "../http"
import { useEffect } from "preact/hooks"
import { disconnectWsServer } from "../websocket"
import { useStoreon } from "storeon/preact"
import { showDialog, updateProgress } from "../dialog"
@@ -759,7 +758,7 @@ function confirmRestart() {
*/
function restartEsp() {
const cmd = "[ESP444]RESTART"
disconnectWsServer()
disconnectPage()
SendCommand(cmd, reloadPageFn, reloadPageFn)
showDialog({ type: "loader", title: T("S60"), message: T("S35") })
}

View File

@@ -143,6 +143,12 @@
"S142" : "Command",
"S143" : "Printer SD",
"S144" : "CNC SD",
"S145" : "Authentication Required",
"S146" : "User Name",
"S147" : "Password",
"S148" : "Log In",
"S149": "You are now disconnected",
"S150": "Disconnected",
"chip id" : "Chip ID",
"CPU Freq" : "CPU Frequency",
"CPU Temp" : "CPU Temperature",

View File

@@ -19,4 +19,4 @@
*/
import { h } from "preact"
export const Esp3dVersion = () => <span>3.0.0.66</span>
export const Esp3dVersion = () => <span>3.0.0.67</span>

View File

@@ -43,10 +43,6 @@ var reconnectCounter = 0
var pingStarted = false
var pingPaused = false
function pausePing(state) {
pingPaused = state
}
/*
* Some constants
*/
@@ -72,6 +68,16 @@ function getPageId() {
return currentPageId
}
/*
* Pause Ping
*/
function pausePing(state) {
pingPaused = state
}
/*
* Ping function
*/
function ping(start = false) {
//be sure it is not reconnection
if (!pingStarted) {
@@ -226,7 +232,7 @@ function connectWsServer() {
function disconnectWsServer(data) {
isLogOff = true
reconnectCounter = 0
webSocketClient.close()
if (typeof webSocketClient.close != "undefined") webSocketClient.close()
stopPolling()
document.title = document.title + "(" + T("S9") + ")"
if (data) showDialog(data)

View File

@@ -119,6 +119,11 @@ function SendBinary(text) {
})
}
app.post("/login", function(req, res) {
res.send("")
return
})
app.get("/command", function(req, res) {
var url = req.originalUrl
var urldecoded = decodeURI(decodeURI(url))

View File

@@ -12,6 +12,7 @@ module.exports = merge(environment, {
"/command": "http://localhost:8080",
"/files": "http://localhost:8080",
"/updatefw": "http://localhost:8080",
"/login": "http://localhost:8080",
},
},
})