Revize 7a34cbd3
Přidáno uživatelem Jan Pašek před téměř 4 roky(ů)
| static/js/create_certificate.js | ||
|---|---|---|
| 1 |
|
|
| 2 |
// VUE instance of certificate creation page |
|
| 3 |
var createCertificateApp = new Vue({
|
|
| 4 |
el: "#create-certificate-content", |
|
| 5 |
data: {
|
|
| 6 |
notBefore: "", |
|
| 7 |
notAfter: "", |
|
| 8 |
isSelfSigned: false, |
|
| 9 |
invalidCN: false, |
|
| 10 |
// available certificate authorities |
|
| 11 |
authorities: [], |
|
| 12 |
// data of the selected certificate authorities to be displayed in the form |
|
| 13 |
selectedCAData: {
|
|
| 14 |
CN: "", |
|
| 15 |
C: "", |
|
| 16 |
L: "", |
|
| 17 |
ST: "", |
|
| 18 |
O: "", |
|
| 19 |
OU: "", |
|
| 20 |
emailAddress: "" |
|
| 21 |
}, |
|
| 22 |
// Data of the new certificate to be created received from the input fields |
|
| 23 |
certificateData: {
|
|
| 24 |
subject: {
|
|
| 25 |
CN: "", |
|
| 26 |
C: "", |
|
| 27 |
L: "", |
|
| 28 |
ST: "", |
|
| 29 |
O: "", |
|
| 30 |
OU: "", |
|
| 31 |
emailAddress: "" |
|
| 32 |
}, |
|
| 33 |
validityDays: 30, |
|
| 34 |
usage: {
|
|
| 35 |
CA: false, |
|
| 36 |
authentication: false, |
|
| 37 |
digitalSignature: false, |
|
| 38 |
SSL: false |
|
| 39 |
}, |
|
| 40 |
CA: null |
|
| 41 |
}, |
|
| 42 |
errorMessage: "" |
|
| 43 |
}, |
|
| 44 |
// actions to be performed when the page is loaded |
|
| 45 |
// - initialize notBefore and notAfter with current date and current date + 1 month respectively |
|
| 46 |
mounted () {
|
|
| 47 |
this.notBefore = new Date().toDateInputValue(); // init notBefore to current date |
|
| 48 |
var endDate = new Date(new Date().getTime()+(30*24*60*60*1000)); |
|
| 49 |
this.notAfter = endDate.toDateInputValue(); // init notAfter to notBefore + 30 days |
|
| 1 |
// VUE instance of certificate creation page |
|
| 2 |
var createCertificateApp = new Vue({
|
|
| 3 |
el: "#create-certificate-content", |
|
| 4 |
data: {
|
|
| 5 |
notBefore: "", |
|
| 6 |
notAfter: "", |
|
| 7 |
isSelfSigned: false, |
|
| 8 |
invalidCN: false, |
|
| 9 |
// available certificate authorities |
|
| 10 |
authorities: [], |
|
| 11 |
// data of the selected certificate authorities to be displayed in the form |
|
| 12 |
selectedCAData: {
|
|
| 13 |
CN: "", |
|
| 14 |
C: "", |
|
| 15 |
L: "", |
|
| 16 |
ST: "", |
|
| 17 |
O: "", |
|
| 18 |
OU: "", |
|
| 19 |
emailAddress: "" |
|
| 20 |
}, |
|
| 21 |
// Data of the new certificate to be created received from the input fields |
|
| 22 |
certificateData: {
|
|
| 23 |
subject: {
|
|
| 24 |
CN: "", |
|
| 25 |
C: "", |
|
| 26 |
L: "", |
|
| 27 |
ST: "", |
|
| 28 |
O: "", |
|
| 29 |
OU: "", |
|
| 30 |
emailAddress: "" |
|
| 50 | 31 |
}, |
| 51 |
methods: {
|
|
| 52 |
showError: function (message) {
|
|
| 53 |
document.body.scrollTop = 0; |
|
| 54 |
document.documentElement.scrollTop = 0; |
|
| 55 |
this.errorMessage = message; |
|
| 56 |
}, |
|
| 57 |
// handle certificate creation request |
|
| 58 |
onCreateCertificate: function () {
|
|
| 59 |
// validate input data |
|
| 60 |
// - validate if subject CN is filled in |
|
| 61 |
if(!this.isSelfSigned && this.certificateData.CA == null) |
|
| 62 |
{
|
|
| 63 |
this.showError("Issuer must be selected or 'Self-signed' option must be checked!")
|
|
| 64 |
return; |
|
| 65 |
} |
|
| 66 |
if(this.certificateData.subject.CN === "") {
|
|
| 67 |
this.showError("CN field must be filled in!")
|
|
| 68 |
this.invalidCN = true; |
|
| 69 |
return; |
|
| 70 |
} |
|
| 71 |
this.certificateData.validityDays = parseInt(this.certificateData.validityDays); |
|
| 72 |
axios.post(API_URL + "certificates", this.certificateData) |
|
| 73 |
.then(function (response) {
|
|
| 74 |
// on success return to index page |
|
| 75 |
if(response.data["success"]) {
|
|
| 76 |
window.location.href = "/static/index.html?success=Certificate+successfully+created"; |
|
| 77 |
} |
|
| 78 |
// on error display server response message |
|
| 79 |
else {
|
|
| 80 |
createCertificateApp.showError(response.data["data"]); |
|
| 81 |
} |
|
| 82 |
}) |
|
| 83 |
.catch(function (error) {
|
|
| 84 |
console.log(error); |
|
| 85 |
}); |
|
| 86 |
} |
|
| 32 |
validityDays: 30, |
|
| 33 |
usage: {
|
|
| 34 |
CA: false, |
|
| 35 |
authentication: false, |
|
| 36 |
digitalSignature: false, |
|
| 37 |
SSL: false |
|
| 87 | 38 |
}, |
| 88 |
// data watches |
|
| 89 |
watch: {
|
|
| 90 |
authorities: function (val, oldVal) {
|
|
| 91 |
this.isSelfSigned = val.length === 0; |
|
| 92 |
}, |
|
| 93 |
isSelfSigned: function (val, oldVal) {
|
|
| 94 |
if (val) {
|
|
| 95 |
this.certificateData.CA = null; |
|
| 96 |
this.certificateData.usage.CA = true; |
|
| 97 |
} else {
|
|
| 98 |
this.certificateData.usage.CA = false; |
|
| 99 |
} |
|
| 100 |
}, |
|
| 101 |
// if the selected CA is changed, the Issuer input fileds must be filled in |
|
| 102 |
'certificateData.validityDays': function (val, oldVal) {
|
|
| 103 |
var endDate = new Date(new Date().getTime()+(val*24*60*60*1000)); |
|
| 104 |
this.notAfter = endDate.toDateInputValue(); // init notAfter to today + validityDays |
|
| 105 |
}, |
|
| 106 |
'certificateData.subject.CN': function (val, oldVal) {
|
|
| 107 |
if (val !== '') this.invalidCN = false; |
|
| 108 |
}, |
|
| 109 |
'certificateData.CA': function (val, oldVal) {
|
|
| 110 |
// self-signed certificate - all fields are empty |
|
| 111 |
if (val === "null" || val == null) {
|
|
| 112 |
createCertificateApp.selectedCAData = {
|
|
| 113 |
CN: "", |
|
| 114 |
C: "", |
|
| 115 |
L: "", |
|
| 116 |
ST: "", |
|
| 117 |
O: "", |
|
| 118 |
OU: "", |
|
| 119 |
emailAddress: "" |
|
| 120 |
}; |
|
| 121 |
} |
|
| 122 |
// a CA is selected - get CA's details and display them |
|
| 123 |
else {
|
|
| 124 |
axios.get(API_URL + "certificates/" + val + "/details") |
|
| 125 |
.then(function (response) {
|
|
| 126 |
if (response.data["success"]) {
|
|
| 127 |
createCertificateApp.selectedCAData = response.data["data"]["subject"]; |
|
| 128 |
} |
|
| 129 |
else |
|
| 130 |
console.log("Error occurred while fetching CA details");
|
|
| 131 |
}) |
|
| 132 |
.catch(function (error) {
|
|
| 133 |
console.log(error); |
|
| 134 |
}); |
|
| 135 |
} |
|
| 136 |
} |
|
| 137 |
} |
|
| 138 |
}); |
|
| 39 |
CA: null |
|
| 40 |
}, |
|
| 41 |
errorMessage: "" |
|
| 42 |
}, |
|
| 43 |
// actions to be performed when the page is loaded |
|
| 44 |
// - initialize notBefore and notAfter with current date and current date + 1 month respectively |
|
| 45 |
mounted() {
|
|
| 46 |
this.notBefore = new Date().toDateInputValue(); // init notBefore to current date |
|
| 47 |
var endDate = new Date(new Date().getTime() + (30 * 24 * 60 * 60 * 1000)); |
|
| 48 |
this.notAfter = endDate.toDateInputValue(); // init notAfter to notBefore + 30 days |
|
| 139 | 49 |
|
| 140 |
// Initialize available CA select values |
|
| 141 |
axios.get(API_URL+"certificates", {
|
|
| 50 |
// Initialize available CA select values
|
|
| 51 |
axios.get(API_URL + "certificates", {
|
|
| 142 | 52 |
params: {
|
| 143 | 53 |
filtering: {
|
| 144 | 54 |
CA: true |
| 145 | 55 |
} |
| 146 | 56 |
} |
| 147 | 57 |
}) |
| 148 |
.then(function (response) {
|
|
| 149 |
if (response.data["success"]) {
|
|
| 150 |
createCertificateApp.authorities = response.data["data"]; |
|
| 58 |
.then(function (response) {
|
|
| 59 |
if (response.data["success"]) {
|
|
| 60 |
createCertificateApp.authorities = response.data["data"]; |
|
| 61 |
} else {
|
|
| 62 |
createCertificateApp.authorities = [] |
|
| 63 |
} |
|
| 64 |
}) |
|
| 65 |
.catch(function (error) {
|
|
| 66 |
console.log(error); |
|
| 67 |
}); |
|
| 68 |
}, |
|
| 69 |
methods: {
|
|
| 70 |
showError: function (message) {
|
|
| 71 |
document.body.scrollTop = 0; |
|
| 72 |
document.documentElement.scrollTop = 0; |
|
| 73 |
this.errorMessage = message; |
|
| 74 |
}, |
|
| 75 |
// handle certificate creation request |
|
| 76 |
onCreateCertificate: function () {
|
|
| 77 |
// validate input data |
|
| 78 |
// - validate if subject CN is filled in |
|
| 79 |
if (!this.isSelfSigned && this.certificateData.CA == null) {
|
|
| 80 |
this.showError("Issuer must be selected or 'Self-signed' option must be checked!")
|
|
| 81 |
return; |
|
| 151 | 82 |
} |
| 152 |
else |
|
| 153 |
{
|
|
| 154 |
createCertificateApp.authorities = [] |
|
| 83 |
if (this.certificateData.subject.CN === "") {
|
|
| 84 |
this.showError("CN field must be filled in!")
|
|
| 85 |
this.invalidCN = true; |
|
| 86 |
return; |
|
| 155 | 87 |
} |
| 156 |
}) |
|
| 157 |
.catch(function (error) {
|
|
| 158 |
console.log(error); |
|
| 159 |
}); |
|
| 88 |
this.certificateData.validityDays = parseInt(this.certificateData.validityDays); |
|
| 89 |
axios.post(API_URL + "certificates", this.certificateData) |
|
| 90 |
.then(function (response) {
|
|
| 91 |
// on success return to index page |
|
| 92 |
if (response.data["success"]) {
|
|
| 93 |
window.location.href = "/static/index.html?success=Certificate+successfully+created"; |
|
| 94 |
} |
|
| 95 |
// on error display server response message |
|
| 96 |
else {
|
|
| 97 |
createCertificateApp.showError(response.data["data"]); |
|
| 98 |
} |
|
| 99 |
}) |
|
| 100 |
.catch(function (error) {
|
|
| 101 |
console.log(error); |
|
| 102 |
}); |
|
| 103 |
} |
|
| 104 |
}, |
|
| 105 |
// data watches |
|
| 106 |
watch: {
|
|
| 107 |
authorities: function (val, oldVal) {
|
|
| 108 |
this.isSelfSigned = val.length === 0; |
|
| 109 |
}, |
|
| 110 |
isSelfSigned: function (val, oldVal) {
|
|
| 111 |
if (val) {
|
|
| 112 |
this.certificateData.CA = null; |
|
| 113 |
this.certificateData.usage.CA = true; |
|
| 114 |
} else {
|
|
| 115 |
this.certificateData.usage.CA = false; |
|
| 116 |
} |
|
| 117 |
}, |
|
| 118 |
// if the selected CA is changed, the Issuer input fileds must be filled in |
|
| 119 |
'certificateData.validityDays': function (val, oldVal) {
|
|
| 120 |
var endDate = new Date(new Date().getTime() + (val * 24 * 60 * 60 * 1000)); |
|
| 121 |
this.notAfter = endDate.toDateInputValue(); // init notAfter to today + validityDays |
|
| 122 |
}, |
|
| 123 |
'certificateData.subject.CN': function (val, oldVal) {
|
|
| 124 |
if (val !== '') this.invalidCN = false; |
|
| 125 |
}, |
|
| 126 |
'certificateData.CA': function (val, oldVal) {
|
|
| 127 |
// self-signed certificate - all fields are empty |
|
| 128 |
if (val === "null" || val == null) {
|
|
| 129 |
createCertificateApp.selectedCAData = {
|
|
| 130 |
CN: "", |
|
| 131 |
C: "", |
|
| 132 |
L: "", |
|
| 133 |
ST: "", |
|
| 134 |
O: "", |
|
| 135 |
OU: "", |
|
| 136 |
emailAddress: "" |
|
| 137 |
}; |
|
| 138 |
} |
|
| 139 |
// a CA is selected - get CA's details and display them |
|
| 140 |
else {
|
|
| 141 |
axios.get(API_URL + "certificates/" + val + "/details") |
|
| 142 |
.then(function (response) {
|
|
| 143 |
if (response.data["success"]) {
|
|
| 144 |
createCertificateApp.selectedCAData = response.data["data"]["subject"]; |
|
| 145 |
} else |
|
| 146 |
console.log("Error occurred while fetching CA details");
|
|
| 147 |
}) |
|
| 148 |
.catch(function (error) {
|
|
| 149 |
console.log(error); |
|
| 150 |
}); |
|
| 151 |
} |
|
| 152 |
} |
|
| 153 |
} |
|
| 154 |
}); |
|
Také k dispozici: Unified diff
Re #8583 - create_certificate.js moved initialization code into mounted