mirror of
https://github.com/node-red/node-red.git
synced 2023-10-10 13:36:53 +02:00
Add auth awareness to ui
This commit is contained in:
Nick O'Leary
parent
66005a2688
commit
982997c3df
@ -36,6 +36,7 @@
|
||||
<a id="btn-deploy" class="action-deploy disabled" href="#"><img id="btn-icn-deploy" src="images/deploy-full-o.png"> <span>Deploy</span></a>
|
||||
<a id="btn-deploy-options" data-toggle="dropdown" class="" href="#"><i class="fa fa-caret-down"></i></a>
|
||||
</span></li>
|
||||
<li><span class="user hide"><i class="fa fa-user"></i> <span class="username"></span></span></li>
|
||||
<li><a id="btn-sidemenu" class="button" data-toggle="dropdown" href="#"><i class="fa fa-bars"></i></a></li>
|
||||
<ul>
|
||||
</div>
|
||||
@ -255,12 +256,12 @@
|
||||
<script src="orion/built-editor.min.js"></script>
|
||||
<script src="d3.v3.min.js"></script>
|
||||
<script src="red/main.js"></script>
|
||||
<script src="red/settings.js"></script>
|
||||
<script src="red/comms.js"></script>
|
||||
<script src="red/ui/state.js"></script>
|
||||
<script src="red/nodes.js"></script>
|
||||
<script src="red/history.js"></script>
|
||||
<script src="red/validators.js"></script>
|
||||
<script src="red/settings.js"></script>
|
||||
<script src="red/ui/menu.js"></script>
|
||||
<script src="red/ui/keyboard.js"></script>
|
||||
<script src="red/ui/tabs.js"></script>
|
||||
|
||||
@ -268,131 +268,160 @@ var RED = (function() {
|
||||
$("#btn-deploy img").attr("src",deploymentTypes[type].img);
|
||||
}
|
||||
|
||||
function load() {
|
||||
RED.settings.init(function() {
|
||||
RED.menu.init({id:"btn-sidemenu",
|
||||
options: [
|
||||
{id:"btn-sidebar",label:"Sidebar",toggle:true,onselect:RED.sidebar.toggleSidebar, selected: true},
|
||||
{id:"btn-node-status",label:"Display node status",toggle:true,onselect:toggleStatus, selected: true},
|
||||
null,
|
||||
{id:"btn-import-menu",label:"Import",options:[
|
||||
{id:"btn-import-clipboard",label:"Clipboard",onselect:RED.view.showImportNodesDialog},
|
||||
{id:"btn-import-library",label:"Library",options:[]}
|
||||
]},
|
||||
{id:"btn-export-menu",label:"Export",disabled:true,options:[
|
||||
{id:"btn-export-clipboard",label:"Clipboard",disabled:true,onselect:RED.view.showExportNodesDialog},
|
||||
{id:"btn-export-library",label:"Library",disabled:true,onselect:RED.view.showExportNodesLibraryDialog}
|
||||
]},
|
||||
null,
|
||||
{id:"btn-config-nodes",label:"Configuration nodes",onselect:RED.sidebar.config.show},
|
||||
null,
|
||||
{id:"btn-subflow-menu",label:"Subflows", options: [
|
||||
{id:"btn-create-subflow",label:"Create subflow",onselect:RED.view.createSubflow},
|
||||
{id:"btn-convert-subflow",label:"Selection to subflow",disabled:true,onselect:RED.view.convertToSubflow},
|
||||
]},
|
||||
null,
|
||||
{id:"btn-workspace-menu",label:"Workspaces",options:[
|
||||
{id:"btn-workspace-add",label:"Add"},
|
||||
{id:"btn-workspace-edit",label:"Rename"},
|
||||
{id:"btn-workspace-delete",label:"Delete"},
|
||||
null
|
||||
]},
|
||||
null,
|
||||
{id:"btn-keyboard-shortcuts",label:"Keyboard Shortcuts",onselect:showHelp},
|
||||
{id:"btn-help",label:"Node-RED Website", href:"http://nodered.org/docs"}
|
||||
]
|
||||
});
|
||||
function loadEditor() {
|
||||
RED.menu.init({id:"btn-sidemenu",
|
||||
options: [
|
||||
{id:"btn-sidebar",label:"Sidebar",toggle:true,onselect:RED.sidebar.toggleSidebar, selected: true},
|
||||
{id:"btn-node-status",label:"Display node status",toggle:true,onselect:toggleStatus, selected: true},
|
||||
null,
|
||||
{id:"btn-import-menu",label:"Import",options:[
|
||||
{id:"btn-import-clipboard",label:"Clipboard",onselect:RED.view.showImportNodesDialog},
|
||||
{id:"btn-import-library",label:"Library",options:[]}
|
||||
]},
|
||||
{id:"btn-export-menu",label:"Export",disabled:true,options:[
|
||||
{id:"btn-export-clipboard",label:"Clipboard",disabled:true,onselect:RED.view.showExportNodesDialog},
|
||||
{id:"btn-export-library",label:"Library",disabled:true,onselect:RED.view.showExportNodesLibraryDialog}
|
||||
]},
|
||||
null,
|
||||
{id:"btn-config-nodes",label:"Configuration nodes",onselect:RED.sidebar.config.show},
|
||||
null,
|
||||
{id:"btn-subflow-menu",label:"Subflows", options: [
|
||||
{id:"btn-create-subflow",label:"Create subflow",onselect:RED.view.createSubflow},
|
||||
{id:"btn-convert-subflow",label:"Selection to subflow",disabled:true,onselect:RED.view.convertToSubflow},
|
||||
]},
|
||||
null,
|
||||
{id:"btn-workspace-menu",label:"Workspaces",options:[
|
||||
{id:"btn-workspace-add",label:"Add"},
|
||||
{id:"btn-workspace-edit",label:"Rename"},
|
||||
{id:"btn-workspace-delete",label:"Delete"},
|
||||
null
|
||||
]},
|
||||
null,
|
||||
{id:"btn-keyboard-shortcuts",label:"Keyboard Shortcuts",onselect:showHelp},
|
||||
{id:"btn-help",label:"Node-RED Website", href:"http://nodered.org/docs"}
|
||||
]
|
||||
});
|
||||
|
||||
RED.menu.init({id:"btn-deploy-options",
|
||||
options: [
|
||||
{id:"btn-deploy-full",toggle:"deploy-type",icon:"images/deploy-full.png",label:"Full",sublabel:"Deploys everything in the workspace",onselect:function(s) { if(s){changeDeploymentType("full")}}},
|
||||
{id:"btn-deploy-flow",toggle:"deploy-type",icon:"images/deploy-flows.png",label:"Modified Flows",sublabel:"Only deploys flows that contain changed nodes", onselect:function(s) {if(s){changeDeploymentType("flows")}}},
|
||||
{id:"btn-deploy-node",toggle:"deploy-type",icon:"images/deploy-nodes.png",label:"Modified Nodes",sublabel:"Only deploys nodes that have changed",onselect:function(s) { if(s){changeDeploymentType("nodes")}}}
|
||||
]
|
||||
});
|
||||
RED.menu.init({id:"btn-deploy-options",
|
||||
options: [
|
||||
{id:"btn-deploy-full",toggle:"deploy-type",icon:"images/deploy-full.png",label:"Full",sublabel:"Deploys everything in the workspace",onselect:function(s) { if(s){changeDeploymentType("full")}}},
|
||||
{id:"btn-deploy-flow",toggle:"deploy-type",icon:"images/deploy-flows.png",label:"Modified Flows",sublabel:"Only deploys flows that contain changed nodes", onselect:function(s) {if(s){changeDeploymentType("flows")}}},
|
||||
{id:"btn-deploy-node",toggle:"deploy-type",icon:"images/deploy-nodes.png",label:"Modified Nodes",sublabel:"Only deploys nodes that have changed",onselect:function(s) { if(s){changeDeploymentType("nodes")}}}
|
||||
]
|
||||
});
|
||||
|
||||
RED.menu.init({id:"workspace-subflow-edit-menu",
|
||||
options: [
|
||||
{id:"btn-subflow-add-input",label:"Add Input", onselect:function() { }},
|
||||
{id:"btn-subflow-add-output",label:"Add Output", onselect:function() { }},
|
||||
{id:"btn-subflow-edit-name",label:"Edit Name", onselect:function() { }},
|
||||
{id:"btn-subflow-delete",label:"Delete", onselect:function() { }},
|
||||
]
|
||||
});
|
||||
if (RED.settings.user) {
|
||||
$("#header .username").html(RED.settings.user.username);
|
||||
$("#header .user").show();
|
||||
RED.menu.addItem("btn-sidemenu", null);
|
||||
RED.menu.addItem("btn-sidemenu",{
|
||||
id:"btn-logout",
|
||||
icon:"fa fa-user",
|
||||
label:"Logout",
|
||||
onselect:function() {
|
||||
// TODO: invalidate token
|
||||
|
||||
$("#main-container").show();
|
||||
$("#btn-deploy").show();
|
||||
$("#btn-sidemenu").show();
|
||||
|
||||
RED.library.init();
|
||||
RED.palette.init();
|
||||
RED.sidebar.init();
|
||||
RED.view.init();
|
||||
|
||||
RED.keyboard.add(/* ? */ 191,{shift:true},function(){showHelp();d3.event.preventDefault();});
|
||||
RED.comms.connect();
|
||||
loadNodeList();
|
||||
},
|
||||
function(err,msg) {
|
||||
if (err == 401) {
|
||||
$.ajax({
|
||||
dataType: "json",
|
||||
url: "auth/login",
|
||||
success: function(data) {
|
||||
if (data.type == "credentials") {
|
||||
for (var i=0;i<data.prompts.length;i++) {
|
||||
var field = data.prompts[i];
|
||||
var row = $("<div/>",{class:"form-row"});
|
||||
$('<label for="node-dialog-login-'+field.id+'">'+field.label+':</label><br/>').appendTo(row);
|
||||
$('<input style="width: 100%" id="node-dialog-login-'+field.id+'" type="'+field.type+'"/>').appendTo(row);
|
||||
row.appendTo("#node-dialog-login-fields");
|
||||
}
|
||||
$('<div class="form-row" style="text-align: right"><span id="node-dialog-login-failed" style="line-height: 2em;float:left;" class="hide">Login failed</span><img src="spin.svg" style="height: 30px" class="login-spinner hide"/> <a href="#" id="node-dialog-login-submit">Login</a></div>').appendTo("#node-dialog-login-fields");
|
||||
$("#node-dialog-login-submit").button().click(function( event ) {
|
||||
$("#node-dialog-login-submit").button("option","disabled",true);
|
||||
$("#node-dialog-login-failed").hide();
|
||||
$(".login-spinner").show();
|
||||
$.ajax({
|
||||
url:"auth/token",
|
||||
type: "POST",
|
||||
data: {
|
||||
grant_type: "password",
|
||||
username: $("#node-dialog-login-username").val(),
|
||||
password: $("#node-dialog-login-password").val(),
|
||||
client_id: "node-red-admin",
|
||||
scope:"*"
|
||||
}
|
||||
}).done(function(data,textStatus,xhr) {
|
||||
$.ajaxSetup({
|
||||
headers:{"authorization":"bearer "+data.access_token}
|
||||
});
|
||||
$("#node-dialog-login").dialog("close");
|
||||
load();
|
||||
}).fail(function(jqXHR,textStatus,errorThrown) {
|
||||
$("#node-dialog-login-failed").show();
|
||||
}).always(function() {
|
||||
$("#node-dialog-login-submit").button("option","disabled",false);
|
||||
$(".login-spinner").hide();
|
||||
});
|
||||
event.preventDefault();
|
||||
});
|
||||
$.ajax({
|
||||
url: "auth/revoke",
|
||||
type: "POST",
|
||||
data: {token:RED.settings.get("auth-tokens").access_token},
|
||||
success: function() {
|
||||
RED.settings.remove("auth-tokens");
|
||||
document.location.reload(true);
|
||||
}
|
||||
})
|
||||
|
||||
}
|
||||
});
|
||||
|
||||
}
|
||||
|
||||
$("#main-container").show();
|
||||
$("#btn-deploy").show();
|
||||
$("#btn-sidemenu").show();
|
||||
|
||||
RED.library.init();
|
||||
RED.palette.init();
|
||||
RED.sidebar.init();
|
||||
RED.view.init();
|
||||
|
||||
RED.keyboard.add(/* ? */ 191,{shift:true},function(){showHelp();d3.event.preventDefault();});
|
||||
RED.comms.connect();
|
||||
loadNodeList();
|
||||
}
|
||||
|
||||
function showLogin() {
|
||||
var dialog = $("#node-dialog-login");
|
||||
dialog.dialog({
|
||||
autoOpen: false,
|
||||
dialogClass: "ui-dialog-no-close",
|
||||
modal: true,
|
||||
closeOnEscape: false,
|
||||
width: 600,
|
||||
resizable: false,
|
||||
draggable: false
|
||||
});
|
||||
$("#node-dialog-login-fields").empty();
|
||||
$.ajax({
|
||||
dataType: "json",
|
||||
url: "auth/login",
|
||||
success: function(data) {
|
||||
if (data.type == "credentials") {
|
||||
for (var i=0;i<data.prompts.length;i++) {
|
||||
var field = data.prompts[i];
|
||||
var row = $("<div/>",{class:"form-row"});
|
||||
$('<label for="node-dialog-login-'+field.id+'">'+field.label+':</label><br/>').appendTo(row);
|
||||
$('<input style="width: 100%" id="node-dialog-login-'+field.id+'" type="'+field.type+'"/>').appendTo(row);
|
||||
row.appendTo("#node-dialog-login-fields");
|
||||
}
|
||||
});
|
||||
$('<div class="form-row" style="text-align: right"><span id="node-dialog-login-failed" style="line-height: 2em;float:left;" class="hide">Login failed</span><img src="spin.svg" style="height: 30px" class="login-spinner hide"/> <a href="#" id="node-dialog-login-submit">Login</a></div>').appendTo("#node-dialog-login-fields");
|
||||
$("#node-dialog-login-submit").button().click(function( event ) {
|
||||
$("#node-dialog-login-submit").button("option","disabled",true);
|
||||
$("#node-dialog-login-failed").hide();
|
||||
$(".login-spinner").show();
|
||||
|
||||
var dialog = $("#node-dialog-login");
|
||||
dialog.dialog({
|
||||
autoOpen: false,
|
||||
dialogClass: "ui-dialog-no-close",
|
||||
modal: true,
|
||||
closeOnEscape: false,
|
||||
width: 600,
|
||||
resizable: false,
|
||||
draggable: false,
|
||||
open: function(event, ui) { console.log("opening");$(".ui-dialog-titlebar", ui.dialog || ui).hide(); }
|
||||
});
|
||||
var body = {
|
||||
client_id: "node-red-admin",
|
||||
grant_type: "password",
|
||||
scope:"*"
|
||||
}
|
||||
for (var i=0;i<data.prompts.length;i++) {
|
||||
var field = data.prompts[i];
|
||||
body[field.id] = $("#node-dialog-login-"+field.id).val();
|
||||
}
|
||||
$.ajax({
|
||||
url:"auth/token",
|
||||
type: "POST",
|
||||
data: body
|
||||
}).done(function(data,textStatus,xhr) {
|
||||
RED.settings.set("auth-tokens",data);
|
||||
$("#node-dialog-login").dialog("close");
|
||||
load();
|
||||
}).fail(function(jqXHR,textStatus,errorThrown) {
|
||||
RED.settings.remove("auth-tokens");
|
||||
$("#node-dialog-login-failed").show();
|
||||
}).always(function() {
|
||||
$("#node-dialog-login-submit").button("option","disabled",false);
|
||||
$(".login-spinner").hide();
|
||||
});
|
||||
event.preventDefault();
|
||||
});
|
||||
}
|
||||
dialog.dialog("open");
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
function load() {
|
||||
RED.settings.init(function(err,msg) {
|
||||
if (err) {
|
||||
if (err === 401) {
|
||||
showLogin();
|
||||
} else {
|
||||
console.log("Unexpected error:",err,msg);
|
||||
}
|
||||
} else {
|
||||
loadEditor();
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
@ -58,7 +58,20 @@ RED.settings = (function () {
|
||||
}
|
||||
};
|
||||
|
||||
var init = function (then,otherwise) {
|
||||
var init = function (done) {
|
||||
|
||||
$.ajaxSetup({
|
||||
beforeSend: function(jqXHR,settings) {
|
||||
// Only attach auth header for requests to relative paths
|
||||
if (!/^\s*(https?:|\/|\.)/.test(settings.url)) {
|
||||
var auth_tokens = RED.settings.get("auth-tokens");
|
||||
if (auth_tokens) {
|
||||
jqXHR.setRequestHeader("authorization","bearer "+auth_tokens.access_token);
|
||||
}
|
||||
}
|
||||
}
|
||||
});
|
||||
|
||||
$.ajax({
|
||||
headers: {
|
||||
"Accept": "application/json"
|
||||
@ -69,11 +82,10 @@ RED.settings = (function () {
|
||||
success: function (data) {
|
||||
setProperties(data);
|
||||
console.log("Node-RED: " + data.version);
|
||||
console.log(data);
|
||||
then();
|
||||
done(null);
|
||||
},
|
||||
error: function(jqXHR,textStatus,errorThrown) {
|
||||
otherwise(jqXHR.status,textStatus);
|
||||
done(jqXHR.status,textStatus);
|
||||
}
|
||||
});
|
||||
};
|
||||
|
||||
@ -140,7 +140,7 @@ RED.menu = (function() {
|
||||
|
||||
var button = $("#"+options.id);
|
||||
|
||||
var topMenu = $("<ul/>",{id:options.id+"-submenu", class:"dropdown-menu pull-right"}).insertAfter(button);
|
||||
var topMenu = $("<ul/>",{id:options.id+"-submenu", class:"dropdown-menu"}).insertAfter(button);
|
||||
|
||||
for (var i=0;i<options.options.length;i++) {
|
||||
var opt = options.options[i];
|
||||
|
||||
@ -29,8 +29,11 @@ body {
|
||||
background: #000;
|
||||
box-sizing: border-box;
|
||||
padding: 0px 0px 0px 20px;
|
||||
color: #C7C7C7;
|
||||
font-size: 14px;
|
||||
}
|
||||
|
||||
|
||||
#dropTarget {
|
||||
position: absolute;
|
||||
top: 0; bottom: 0;
|
||||
@ -66,7 +69,6 @@ span.logo {
|
||||
font-size: 30px;
|
||||
line-height: 30px;
|
||||
text-decoration: none;
|
||||
color: #C7C7C7;
|
||||
}
|
||||
span.logo span {
|
||||
vertical-align: middle;
|
||||
|
||||
@ -18,6 +18,7 @@ var passport = require("passport");
|
||||
var oauth2orize = require("oauth2orize");
|
||||
|
||||
var strategies = require("./strategies");
|
||||
var tokens = require("./tokens");
|
||||
|
||||
var settings = require("../../settings");
|
||||
|
||||
@ -62,11 +63,19 @@ function login(req,res) {
|
||||
res.json(response);
|
||||
}
|
||||
|
||||
function revoke(req,res) {
|
||||
var token = req.body.token;
|
||||
tokens.revoke(token).then(function() {
|
||||
res.send(200);
|
||||
});
|
||||
}
|
||||
|
||||
module.exports = {
|
||||
authenticate: authenticate,
|
||||
ensureClientSecret: ensureClientSecret,
|
||||
authenticateClient: authenticateClient,
|
||||
getToken: getToken,
|
||||
errorHandler: server.errorHandler(),
|
||||
login: login
|
||||
login: login,
|
||||
revoke: revoke
|
||||
}
|
||||
|
||||
@ -35,6 +35,10 @@ module.exports = {
|
||||
var token = generateToken(256);
|
||||
tokens[token] = {user:user,client:client,scope:scope};
|
||||
return when.resolve(token);
|
||||
},
|
||||
revoke: function(token) {
|
||||
delete tokens[token];
|
||||
return when.resolve();
|
||||
}
|
||||
|
||||
};
|
||||
|
||||
@ -35,55 +35,56 @@ var errorHandler = function(err,req,res,next) {
|
||||
|
||||
function init(adminApp) {
|
||||
|
||||
var apiApp = express();
|
||||
|
||||
// Editor
|
||||
if (!settings.disableEditor) {
|
||||
var editorApp = express();
|
||||
editorApp.get("/",ui.ensureSlash);
|
||||
editorApp.get("/icons/:icon",ui.icon);
|
||||
editorApp.use("/",ui.editor);
|
||||
adminApp.use(editorApp);
|
||||
}
|
||||
|
||||
adminApp.use(express.json());
|
||||
adminApp.use(express.urlencoded());
|
||||
|
||||
//TODO: all passport references ought to be in ./auth
|
||||
apiApp.use(passport.initialize());
|
||||
adminApp.use(passport.initialize());
|
||||
|
||||
apiApp.use(auth.authenticate);
|
||||
apiApp.post("/auth/token",
|
||||
adminApp.use(auth.authenticate);
|
||||
adminApp.post("/auth/token",
|
||||
auth.ensureClientSecret,
|
||||
auth.authenticateClient,
|
||||
auth.getToken,
|
||||
auth.errorHandler
|
||||
);
|
||||
apiApp.get("/auth/login",auth.login);
|
||||
adminApp.get("/auth/login",auth.login);
|
||||
adminApp.post("/auth/revoke",auth.revoke);
|
||||
|
||||
|
||||
// Flows
|
||||
apiApp.get("/flows",flows.get);
|
||||
apiApp.post("/flows",flows.post);
|
||||
adminApp.get("/flows",flows.get);
|
||||
adminApp.post("/flows",flows.post);
|
||||
|
||||
// Nodes
|
||||
apiApp.get("/nodes",nodes.getAll);
|
||||
apiApp.post("/nodes",nodes.post);
|
||||
adminApp.get("/nodes",nodes.getAll);
|
||||
adminApp.post("/nodes",nodes.post);
|
||||
|
||||
apiApp.get("/nodes/:mod",nodes.getModule);
|
||||
apiApp.put("/nodes/:mod",nodes.putModule);
|
||||
apiApp.delete("/nodes/:mod",nodes.delete);
|
||||
adminApp.get("/nodes/:mod",nodes.getModule);
|
||||
adminApp.put("/nodes/:mod",nodes.putModule);
|
||||
adminApp.delete("/nodes/:mod",nodes.delete);
|
||||
|
||||
apiApp.get("/nodes/:mod/:set",nodes.getSet);
|
||||
apiApp.put("/nodes/:mod/:set",nodes.putSet);
|
||||
adminApp.get("/nodes/:mod/:set",nodes.getSet);
|
||||
adminApp.put("/nodes/:mod/:set",nodes.putSet);
|
||||
|
||||
// Library
|
||||
library.init(apiApp);
|
||||
apiApp.post(new RegExp("/library/flows\/(.*)"),library.post);
|
||||
apiApp.get("/library/flows",library.getAll);
|
||||
apiApp.get(new RegExp("/library/flows\/(.*)"),library.get);
|
||||
library.init(adminApp);
|
||||
adminApp.post(new RegExp("/library/flows\/(.*)"),library.post);
|
||||
adminApp.get("/library/flows",library.getAll);
|
||||
adminApp.get(new RegExp("/library/flows\/(.*)"),library.get);
|
||||
|
||||
// Settings
|
||||
apiApp.get("/settings",info.settings);
|
||||
|
||||
// Editor
|
||||
if (!settings.disableEditor) {
|
||||
adminApp.get("/",ui.ensureSlash);
|
||||
adminApp.get("/icons/:icon",ui.icon);
|
||||
adminApp.use("/",ui.editor);
|
||||
}
|
||||
|
||||
adminApp.use(apiApp);
|
||||
adminApp.get("/settings",info.settings);
|
||||
|
||||
// Error Handler
|
||||
adminApp.use(errorHandler);
|
||||
|
||||
Loading…
Reference in New Issue
Block a user