mirror of
https://github.com/luc-github/ESP3D-WEBUI.git
synced 2025-10-31 11:56:46 -07:00
Add authentication support part 1
need FW v61 or more
This commit is contained in:
BIN
dist/grbl/index.html.gz
vendored
BIN
dist/grbl/index.html.gz
vendored
Binary file not shown.
BIN
dist/printer/index.html.gz
vendored
BIN
dist/printer/index.html.gz
vendored
Binary file not shown.
@@ -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,
|
||||
}
|
||||
|
||||
@@ -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"
|
||||
|
||||
@@ -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,
|
||||
}
|
||||
|
||||
@@ -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") })
|
||||
}
|
||||
|
||||
@@ -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",
|
||||
|
||||
@@ -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>
|
||||
|
||||
@@ -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)
|
||||
|
||||
@@ -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))
|
||||
|
||||
@@ -12,6 +12,7 @@ module.exports = merge(environment, {
|
||||
"/command": "http://localhost:8080",
|
||||
"/files": "http://localhost:8080",
|
||||
"/updatefw": "http://localhost:8080",
|
||||
"/login": "http://localhost:8080",
|
||||
},
|
||||
},
|
||||
})
|
||||
|
||||
Reference in New Issue
Block a user