Skip to content

Commit

Permalink
Implement fileserver thumbprint verification (#1790)
Browse files Browse the repository at this point in the history 
Adds a new modal for thumbprint validation to the
Getting Started Page in the Fileserver.
Fixes vmware/vic-ui#465
  • Loading branch information
@lmalvins @wjun
lmalvins authored and wjun committed Aug 30, 2018
1 parent 5b5bb71 commit bbfe684
Show file tree
Hide file tree
Showing 9 changed files with 6,422 additions and 57 deletions.
5 changes: 5 additions & 0 deletions installer/build/bootable/build-main.sh
View file
Original file line number Diff line number Diff line change
Expand Up @@ -86,6 +86,11 @@ function build_app {
SOURCE=$(jq '.['$LINE_NUM'] | .source' "${MANIFEST}" | tr -d '"')
DESTINATION=$(echo "${ROOT}/$(cat "${MANIFEST}" | jq '.['$LINE_NUM'] | .destination')" | tr -d '"' )
mkdir -p "$(dirname "$DESTINATION")" && cp -R $SOURCE "$DESTINATION"
if [[ "$DESTINATION" == *"fileserver/html"* ]]; then
pushd $DESTINATION
rm -fr .gitignore karma* package* js/fixtures js/specs
popd
fi
fi
LINE_NUM=$((LINE_NUM+1))
done
Expand Down
41 changes: 41 additions & 0 deletions installer/fileserver/html/.gitignore
View file
Original file line number Diff line number Diff line change
@@ -0,0 +1,41 @@
# Created by https://www.gitignore.io/api/node

### Node ###
# Logs
logs
*.log
npm-debug.log*

# Runtime data
pids
*.pid
*.seed
*.pid.lock

# Directory for instrumented libs generated by jscoverage/JSCover
lib-cov

# Coverage directory used by tools like istanbul
coverage

# nyc test coverage
.nyc_output

# Compiled binary addons (http://nodejs.org/api/addons.html)
build/Release

# Dependency directories
node_modules/
jspm_packages/

# Optional npm cache directory
.npm

# Optional eslint cache
.eslintcache

# Output of 'npm pack'
*.tgz

# dotenv environment variables file
.env
130 changes: 73 additions & 57 deletions installer/fileserver/html/index.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -18,7 +18,6 @@
<link rel="stylesheet" href="css/clarity-icons.min.css">
<link rel="stylesheet" href="css/fontello.css">
<link rel="stylesheet" href="css/style.css">

</head>

<body id="body">
Expand All @@ -30,35 +29,34 @@
</div>
</header>
<main class="content-container">
<div class="content-area">
<div id="getting-started-items-container">
{{if .InitErrorFeedback }}
<div id="feedback-alert" class="alert alert-danger">
<div class="alert-item">
<span class="alert-text">{{ .InitErrorFeedback }}</span>
<div class="alert-actions">
<a href="/?login=true" title="Login" class="alert-action">Re-initialize</a>
<div class="content-area" id="contentArea">
<div id="getting-started-items-container" class="mt-0">
{{if .InitErrorFeedback }}
<div id="feedback-alert" class="alert alert-danger">
<div class="alert-item">
<span class="alert-text">{{ .InitErrorFeedback}}</span>
<div class="alert-actions">
<a href="/?login=true" title="Login" class="alert-action">Re-initialize</a>
</div>
</div>
</div>
</div>
{{ end }}
{{if .InitSuccessFeedback }}
<div id="feedback-alert" class="alert alert-success">
<div class="alert-item">
<span class="alert-text">{{ .InitSuccessFeedback }}</span>
{{ end }}
{{if .InitSuccessFeedback }}
<div id="feedback-alert" class="alert alert-success">
<div class="alert-item">
<span class="alert-text">{{ .InitSuccessFeedback }}</span>
</div>
</div>
</div>
{{ end }}
<div class="row flex-items-xs-middle my-1 mx-0">
<div class="col-xs"></div>
<div class="col-xs">
<h1 class="text-center my-0">Getting Started</h1>
{{ end }}
<div class="row flex-items-xs-middle my-1 mx-0 pl-3">
<div class="col-xs text-left">
<h1 class="mx-0 mb-2 pl-0">vSphere Integrated
Containers Appliance</h1>
</div>
<div class="col-xs text-right">
<a href="https://vmware.github.io/vic-product/assets/files/html/1.4/" target="_blank" title="Documentation" class="btn btn-outline mx-0">Documentation</a>
</div>
<a href="https://vmware.github.io/vic-product/assets/files/html/1.4/" target="_blank" title="Documentation" class="btn btn-primary mx-1">Documentation</a>
</div>
</div>

<div class="row flex-items-xs-center mx-0">
<div class="col-xs-10">
<div class="row">
Expand Down Expand Up @@ -141,13 +139,49 @@ <h4>Infrastructure Deployment Tools</h4>
</div>
</div>
</div>
<a href="/?login=true" id="feedback-link" class="btn btn-link px-0 my-2">
<div><a href="/?login=true" id="feedback-link"
class="btn btn-link px-0 mt-1 mb-0">
Re-initialize the vSphere Integrated Container Appliance
</a>
</a></div>
</div>
</div>
{{if .NeedLogin}}
<div class="modal">
<div class="modal" id="plugin-modal" style="display: none">
<div class="modal-dialog" role="dialog"aria-hidden="false">
<div class="modal-content">
<div class="modal-header">
<h3 class="modal-title">Complete VIC plugin installation</h3>
</div>
<div id="plugin-spinner" style="display: none;text-align: center">
<div class="spinner"></div>
</div>
<div class="modal-body">
<form id="plugin-form" method="post" class="pt-0">
<div id="plugin-body">

<p class="mt-0 mb-1">
Certificate thumbprint for
vCenter Server <label id="vcenter"></label>
</p>
<input id="thumbprint-show" type="text" style="width: 85%;" value="" onkeyup="checkThumbrintInput()"></input>
<p class="mt-1 mb-1">
Click Continue to validate
this certificate or cancel
if the thumbprint is not valid
</p>
<a href="https://vmware.github.io/vic-product/assets/files/html/1.4/vic_vsphere_admin/obtain_thumbprint.html" class="btn btn-link" >Read more...</a>
</div>
<div class="modal-footer">
<button class="btn btn-outline" type="button" onclick="window.location.href='/?login=true'">Cancel</button>
<button id="plugin-submit" class="btn btn-primary" type="submit">Continue</button>
</div>
</form>
</div>
</div>
</div>
</div>
<div class="modal-backdrop" id="areaBackdrop" aria-hidden="true"></div>
<div class="modal" id="login-modal">
<div class="modal-dialog" role="dialog" aria-hidden="true">
<div class="modal-content">
<div class="modal-header">
Expand All @@ -168,18 +202,24 @@ <h3 class="modal-title">Complete VIC appliance installation</h3>
</div>
</div>
{{ end }}
<div class="alert alert-danger mt-0 mb-2" style="display: none" id="thumbprint-alert-div">
<div class="alert-item">
<span id="thumbprint-alert-span" class="alert-text">
</span>
</div>
</div>
<p class="mt-0 mb-1">
Please enter your vCenter credentials to complete the vSphere Integrated
Containers Appliance installation and PSC settings if using an external instance.
</p>
<div class="form-group">
<label for="target" class="required">vCenter Server</label>
<input id="target" type="text" name="target" placeholder="FQDN or IP">
<input id="target" type="text" name="target" placeholder="FQDN or IP" onkeyup="checkRegistryForm()" value="">
</div>
<div class="form-group">
<label for="user" class="required">vCenter Server credentials</label>
<input id="user" type="text" name="user" placeholder="[email protected]">
<input type="password" name="password" placeholder="Password" />
<input id="user" type="text" name="user" placeholder="[email protected]" onkeyup="checkRegistryForm()" value="">
<input id="password" type="password" name="password" placeholder="Password" onkeyup="checkRegistryForm()" value="">
</div>
<div class="form-group">
<label for="psc">External PSC Instance</label>
Expand All @@ -189,9 +229,10 @@ <h3 class="modal-title">Complete VIC appliance installation</h3>
<label for="pscDomain">External PSC Admin Domain</label>
<input id="pscDomain" type="text" name="pscDomain" placeholder="vsphere.local">
</div>
<input id="thumbprint" type="hidden" name="thumbprint" placeholder="">
</div>
<div class="text-sm-right">
<button id="login-submit" type="submit" class="btn btn-primary">Continue</button>
<button id="login-submit" onclick="submitRegistration()" disabled class="btn btn-primary">Continue</button>
</div>
</form>
</div>
Expand All @@ -203,31 +244,6 @@ <h3 class="modal-title">Complete VIC appliance installation</h3>
</div>
</main>
</div>

<script>

(function() {

$form = document.getElementById('login-form');
$spinner = document.getElementById('login-spinner');
$body = document.getElementById('login-body');
$submit = document.getElementById('login-submit');

if ($form) {
$form.addEventListener('submit', function(event) {
event.preventDefault();
$submit.setAttribute('disabled', 'disabled');
$body.style.display = 'none';
$spinner.style.display = '';
setTimeout(function() {
$form.submit();
});
})
}

})();

</script>
<script src="js/index-handler.js"></script>
</body>

</html>
96 changes: 96 additions & 0 deletions installer/fileserver/html/js/fixtures/index.html
View file
Original file line number Diff line number Diff line change
@@ -0,0 +1,96 @@
<div id="main-container">
<div class="modal" id="login-modal">
<div class="modal-dialog" role="dialog" aria-hidden="true">
<div class="modal-content">
<div class="modal-header">
<h3 class="modal-title">Complete VIC appliance installation</h3>
</div>
<div id="login-spinner" style="display: none">
<div class="spinner"></div>
</div>
<div class="modal-body">
<form id="login-form" method="post" class="pt-0">
<div id="login-body">
{{if .ValidationError }}
<div class="alert alert-danger mt-0 mb-2">
<div class="alert-item">
<span class="alert-text">
Validation failed: {{ .ValidationError }}
</span>
</div>
</div>
{{ end }}
<div class="alert alert-danger mt-0
mb-2" style="display: none" id="thumbprint-alert-div">
<div class="alert-item">
<span id="thumbprint-alert-span" class="alert-text">
</span>
</div>
</div>
<p class="mt-0 mb-1">
Please enter your vCenter credentials to complete the vSphere Integrated
Containers Appliance installation and PSC settings if using an external instance.
</p>
<div class="form-group">
<label for="target" class="required">vCenter Server</label>
<input id="target" type="text" name="target" placeholder="FQDN or IP" onkeyup="checkRegistryForm()" value="">
</div>
<div class="form-group">
<label for="user" class="required">vCenter Server credentials</label>
<input id="user" type="text" name="user" placeholder="[email protected]" onkeyup="checkRegistryForm()" value="">
<input id="password" type="password" name="password" placeholder="Password" onkeyup="checkRegistryForm()" value="">
</div>
<div class="form-group">
<label for="psc">External PSC Instance</label>
<input id="psc" type="text" name="psc" placeholder="FQDN">
</div>
<div class="form-group">
<label for="pscDomain">External PSC Admin Domain</label>
<input id="pscDomain" type="text" name="pscDomain" placeholder="vsphere.local">
</div>
<input id="thumbprint" type="hidden" name="thumbprint" placeholder="">
</div>
<div class="text-sm-right">
<button id="login-submit" onclick="submitRegistration()" disabled class="btn btn-primary">Continue</button>
</div>
</form>
</div>
</div>
</div>
</div>

<div class="modal" id="plugin-modal" style="display: none">
<div class="modal-dialog" role="dialog"aria-hidden="false">
<div class="modal-content">
<div class="modal-header">
<h3 class="modal-title">Complete VIC plugin installation</h3>
</div>
<div id="plugin-spinner" style="display: none;text-align: center">
<div class="spinner"></div>
</div>
<div class="modal-body">
<form id="plugin-form" method="post" class="pt-0">
<div id="plugin-body">

<p class="mt-0 mb-1">
Certificate thumbprint for
vCenter Server <label id="vcenter"></label>
</p>
<input id="thumbprint-show" type="text" style="width: 85%;" value="" onkeyup="checkThumbrintInput()"></input>
<p class="mt-1 mb-1">
Click Continue to validate
this certificate or cancel
if the thumbprint is not valid
</p>
<a href="https://vmware.github.io/vic-product/assets/files/html/1.4/vic_vsphere_admin/obtain_thumbprint.html" class="btn btn-link" >Read more...</a>
</div>
<div class="modal-footer">
<button class="btn btn-outline" type="button" onclick="window.location.href='/?login=true'">Cancel</button>
<button id="plugin-submit" class="btn btn-primary" type="submit">Continue</button>
</div>
</form>
</div>
</div>
</div>
</div>
</div>
Loading

0 comments on commit bbfe684

Please sign in to comment.