Conf diffing?!

This commit is contained in:
MattIPv4 2020-05-22 21:17:01 +01:00
parent c6880c1222
commit 17261e8bbd
9 changed files with 406 additions and 66 deletions

198
package-lock.json generated
View file

@ -1267,6 +1267,11 @@
"resolved": "https://registry.npmjs.org/array-equal/-/array-equal-1.0.0.tgz",
"integrity": "sha1-jCpe8kcv2ep0KwTHenUJO6J1fJM="
},
"array-filter": {
"version": "1.0.0",
"resolved": "https://registry.npmjs.org/array-filter/-/array-filter-1.0.0.tgz",
"integrity": "sha1-uveeYubvTCpMC4MSMtr/7CUfnYM="
},
"array-unique": {
"version": "0.3.2",
"resolved": "https://registry.npmjs.org/array-unique/-/array-unique-0.3.2.tgz",
@ -1350,6 +1355,14 @@
"resolved": "https://registry.npmjs.org/atob/-/atob-2.1.2.tgz",
"integrity": "sha512-Wm6ukoaOGJi/73p/cl2GvLjTI5JM1k/O14isD73YML8StrH/7/lRFgmg8nICZgD3bZZvjwCGxtMOD3wWNAu8cg=="
},
"available-typed-arrays": {
"version": "1.0.2",
"resolved": "https://registry.npmjs.org/available-typed-arrays/-/available-typed-arrays-1.0.2.tgz",
"integrity": "sha512-XWX3OX8Onv97LMk/ftVyBibpGwY5a8SmuxZPzeOxqmuEqUCOM9ZE+uIaD1VNJ5QnvU2UQusvmKbuM1FR8QWGfQ==",
"requires": {
"array-filter": "^1.0.0"
}
},
"aws-sign2": {
"version": "0.7.0",
"resolved": "https://registry.npmjs.org/aws-sign2/-/aws-sign2-0.7.0.tgz",
@ -2593,6 +2606,34 @@
"resolved": "https://registry.npmjs.org/decode-uri-component/-/decode-uri-component-0.2.0.tgz",
"integrity": "sha1-6zkTMzRYd1y4TNGh+uBiEGu4dUU="
},
"deep-equal": {
"version": "2.0.3",
"resolved": "https://registry.npmjs.org/deep-equal/-/deep-equal-2.0.3.tgz",
"integrity": "sha512-Spqdl4H+ky45I9ByyJtXteOm9CaIrPmnIPmOhrkKGNYWeDgCvJ8jNYVCTjChxW4FqGuZnLHADc8EKRMX6+CgvA==",
"requires": {
"es-abstract": "^1.17.5",
"es-get-iterator": "^1.1.0",
"is-arguments": "^1.0.4",
"is-date-object": "^1.0.2",
"is-regex": "^1.0.5",
"isarray": "^2.0.5",
"object-is": "^1.1.2",
"object-keys": "^1.1.1",
"object.assign": "^4.1.0",
"regexp.prototype.flags": "^1.3.0",
"side-channel": "^1.0.2",
"which-boxed-primitive": "^1.0.1",
"which-collection": "^1.0.1",
"which-typed-array": "^1.1.2"
},
"dependencies": {
"isarray": {
"version": "2.0.5",
"resolved": "https://registry.npmjs.org/isarray/-/isarray-2.0.5.tgz",
"integrity": "sha512-xHjhDr3cNBK0BzdUJSPXZntQUx/mwMS5Rw4A7lPJ90XGAO6ISP/ePDNuo0vhqOZU+UD5JoodwCAAoZQd3FeAKw=="
}
}
},
"deep-is": {
"version": "0.1.3",
"resolved": "https://registry.npmjs.org/deep-is/-/deep-is-0.1.3.tgz",
@ -2688,6 +2729,11 @@
"resolved": "https://registry.npmjs.org/destroy/-/destroy-1.0.4.tgz",
"integrity": "sha1-l4hXRCxEdJ5CBmE+N5RiBYJqvYA="
},
"diff": {
"version": "4.0.2",
"resolved": "https://registry.npmjs.org/diff/-/diff-4.0.2.tgz",
"integrity": "sha512-58lmxKSA4BNyLz+HHMUzlOEpg09FV+ev6ZMe3vJihgdxzgcwZ8VoEEPmALCZG9LmqfVoNMMKpttIYTVG6uDY7A=="
},
"diffie-hellman": {
"version": "5.0.3",
"resolved": "https://registry.npmjs.org/diffie-hellman/-/diffie-hellman-5.0.3.tgz",
@ -2913,6 +2959,27 @@
}
}
},
"es-get-iterator": {
"version": "1.1.0",
"resolved": "https://registry.npmjs.org/es-get-iterator/-/es-get-iterator-1.1.0.tgz",
"integrity": "sha512-UfrmHuWQlNMTs35e1ypnvikg6jCz3SK8v8ImvmDsh36fCVUR1MqoFDiyn0/k52C8NqO3YsO8Oe0azeesNuqSsQ==",
"requires": {
"es-abstract": "^1.17.4",
"has-symbols": "^1.0.1",
"is-arguments": "^1.0.4",
"is-map": "^2.0.1",
"is-set": "^2.0.1",
"is-string": "^1.0.5",
"isarray": "^2.0.5"
},
"dependencies": {
"isarray": {
"version": "2.0.5",
"resolved": "https://registry.npmjs.org/isarray/-/isarray-2.0.5.tgz",
"integrity": "sha512-xHjhDr3cNBK0BzdUJSPXZntQUx/mwMS5Rw4A7lPJ90XGAO6ISP/ePDNuo0vhqOZU+UD5JoodwCAAoZQd3FeAKw=="
}
}
},
"es-to-primitive": {
"version": "1.2.1",
"resolved": "https://registry.npmjs.org/es-to-primitive/-/es-to-primitive-1.2.1.tgz",
@ -4748,11 +4815,21 @@
}
}
},
"is-arguments": {
"version": "1.0.4",
"resolved": "https://registry.npmjs.org/is-arguments/-/is-arguments-1.0.4.tgz",
"integrity": "sha512-xPh0Rmt8NE65sNzvyUmWgI1tz3mKq74lGA0mL8LYZcoIzKOzDh6HmrYm3d18k60nHerC8A9Km8kYu87zfSFnLA=="
},
"is-arrayish": {
"version": "0.2.1",
"resolved": "https://registry.npmjs.org/is-arrayish/-/is-arrayish-0.2.1.tgz",
"integrity": "sha1-d8mYQFJ6qOyxqLppe4BkWnqSap0="
},
"is-bigint": {
"version": "1.0.0",
"resolved": "https://registry.npmjs.org/is-bigint/-/is-bigint-1.0.0.tgz",
"integrity": "sha512-t5mGUXC/xRheCK431ylNiSkGGpBp8bHENBcENTkDT6ppwPzEVxNGZRvgvmOEfbWkFhA7D2GEuE2mmQTr78sl2g=="
},
"is-binary-path": {
"version": "1.0.1",
"resolved": "https://registry.npmjs.org/is-binary-path/-/is-binary-path-1.0.1.tgz",
@ -4761,6 +4838,11 @@
"binary-extensions": "^1.0.0"
}
},
"is-boolean-object": {
"version": "1.0.1",
"resolved": "https://registry.npmjs.org/is-boolean-object/-/is-boolean-object-1.0.1.tgz",
"integrity": "sha512-TqZuVwa/sppcrhUCAYkGBk7w0yxfQQnxq28fjkO53tnK9FQXmdwz2JS5+GjsWQ6RByES1K40nI+yDic5c9/aAQ=="
},
"is-buffer": {
"version": "1.1.6",
"resolved": "https://registry.npmjs.org/is-buffer/-/is-buffer-1.1.6.tgz",
@ -4860,6 +4942,11 @@
"html-tags": "^1.0.0"
}
},
"is-map": {
"version": "2.0.1",
"resolved": "https://registry.npmjs.org/is-map/-/is-map-2.0.1.tgz",
"integrity": "sha512-T/S49scO8plUiAOA2DBTBG3JHpn1yiw0kRp6dgiZ0v2/6twi5eiB0rHtHFH9ZIrvlWc6+4O+m4zg5+Z833aXgw=="
},
"is-my-ip-valid": {
"version": "1.0.0",
"resolved": "https://registry.npmjs.org/is-my-ip-valid/-/is-my-ip-valid-1.0.0.tgz",
@ -4897,6 +4984,11 @@
}
}
},
"is-number-object": {
"version": "1.0.4",
"resolved": "https://registry.npmjs.org/is-number-object/-/is-number-object-1.0.4.tgz",
"integrity": "sha512-zohwelOAur+5uXtk8O3GPQ1eAcu4ZX3UwxQhUlfFFMNpUd83gXgjbhJh6HmB6LUNV/ieOLQuDwJO3dWJosUeMw=="
},
"is-obj": {
"version": "2.0.0",
"resolved": "https://registry.npmjs.org/is-obj/-/is-obj-2.0.0.tgz",
@ -4929,6 +5021,16 @@
"resolved": "https://registry.npmjs.org/is-resolvable/-/is-resolvable-1.1.0.tgz",
"integrity": "sha512-qgDYXFSR5WvEfuS5dMj6oTMEbrrSaM0CrFk2Yiq/gXnBvD9pMa2jGXxyhGLfvhZpuMZe18CJpFxAt3CRs42NMg=="
},
"is-set": {
"version": "2.0.1",
"resolved": "https://registry.npmjs.org/is-set/-/is-set-2.0.1.tgz",
"integrity": "sha512-eJEzOtVyenDs1TMzSQ3kU3K+E0GUS9sno+F0OBT97xsgcJsF9nXMBtkT9/kut5JEpM7oL7X/0qxR17K3mcwIAA=="
},
"is-string": {
"version": "1.0.5",
"resolved": "https://registry.npmjs.org/is-string/-/is-string-1.0.5.tgz",
"integrity": "sha512-buY6VNRjhQMiF1qWDouloZlQbRhDPCebwxSjxMjxgemYT46YMd2NR0/H+fBhEfWX4A/w9TBJ+ol+okqJKFE6vQ=="
},
"is-svg": {
"version": "3.0.0",
"resolved": "https://registry.npmjs.org/is-svg/-/is-svg-3.0.0.tgz",
@ -4945,6 +5047,17 @@
"has-symbols": "^1.0.1"
}
},
"is-typed-array": {
"version": "1.1.3",
"resolved": "https://registry.npmjs.org/is-typed-array/-/is-typed-array-1.1.3.tgz",
"integrity": "sha512-BSYUBOK/HJibQ30wWkWold5txYwMUXQct9YHAQJr8fSwvZoiglcqB0pd7vEN23+Tsi9IUEjztdOSzl4qLVYGTQ==",
"requires": {
"available-typed-arrays": "^1.0.0",
"es-abstract": "^1.17.4",
"foreach": "^2.0.5",
"has-symbols": "^1.0.1"
}
},
"is-typedarray": {
"version": "1.0.0",
"resolved": "https://registry.npmjs.org/is-typedarray/-/is-typedarray-1.0.0.tgz",
@ -4955,6 +5068,16 @@
"resolved": "https://registry.npmjs.org/is-url/-/is-url-1.2.4.tgz",
"integrity": "sha512-ITvGim8FhRiYe4IQ5uHSkj7pVaPDrCTkNd3yq3cV7iZAcJdHTUMPMEHcqSOy9xZ9qFenQCvi+2wjH9a1nXqHww=="
},
"is-weakmap": {
"version": "2.0.1",
"resolved": "https://registry.npmjs.org/is-weakmap/-/is-weakmap-2.0.1.tgz",
"integrity": "sha512-NSBR4kH5oVj1Uwvv970ruUkCV7O1mzgVFO4/rev2cLRda9Tm9HrL70ZPut4rOHgY0FNrUu9BCbXA2sdQ+x0chA=="
},
"is-weakset": {
"version": "2.0.1",
"resolved": "https://registry.npmjs.org/is-weakset/-/is-weakset-2.0.1.tgz",
"integrity": "sha512-pi4vhbhVHGLxohUw7PhGsueT4vRGFoXhP7+RGN0jKIv9+8PWYCQTqtADngrxOm2g46hoH0+g8uZZBzMrvVGDmw=="
},
"is-windows": {
"version": "1.0.2",
"resolved": "https://registry.npmjs.org/is-windows/-/is-windows-1.0.2.tgz",
@ -5625,6 +5748,15 @@
"resolved": "https://registry.npmjs.org/object-inspect/-/object-inspect-1.4.1.tgz",
"integrity": "sha512-wqdhLpfCUbEsoEwl3FXwGyv8ief1k/1aUdIPCqVnupM6e8l63BEJdiF/0swtn04/8p05tG/T0FrpTlfwvljOdw=="
},
"object-is": {
"version": "1.1.2",
"resolved": "https://registry.npmjs.org/object-is/-/object-is-1.1.2.tgz",
"integrity": "sha512-5lHCz+0uufF6wZ7CRFWJN3hp8Jqblpgve06U5CMQ3f//6iDjPr2PEo9MWCjEssDsa+UZEL4PkFpr+BMop6aKzQ==",
"requires": {
"define-properties": "^1.1.3",
"es-abstract": "^1.17.5"
}
},
"object-keys": {
"version": "1.1.1",
"resolved": "https://registry.npmjs.org/object-keys/-/object-keys-1.1.1.tgz",
@ -6722,6 +6854,15 @@
"safe-regex": "^1.1.0"
}
},
"regexp.prototype.flags": {
"version": "1.3.0",
"resolved": "https://registry.npmjs.org/regexp.prototype.flags/-/regexp.prototype.flags-1.3.0.tgz",
"integrity": "sha512-2+Q0C5g951OlYlJz6yu5/M33IcsESLlLfsyIaLJaG4FA2r4yP8MvVMJUUP/fVBkSpbbbZlS5gynbEWLipiiXiQ==",
"requires": {
"define-properties": "^1.1.3",
"es-abstract": "^1.17.0-next.1"
}
},
"regexpp": {
"version": "2.0.1",
"resolved": "https://registry.npmjs.org/regexpp/-/regexpp-2.0.1.tgz",
@ -7672,6 +7813,22 @@
"integrity": "sha1-7GIRvtGSBEIIj+D3Cyg3Iy7SyKg=",
"dev": true
},
"side-channel": {
"version": "1.0.2",
"resolved": "https://registry.npmjs.org/side-channel/-/side-channel-1.0.2.tgz",
"integrity": "sha512-7rL9YlPHg7Ancea1S96Pa8/QWb4BtXL/TZvS6B8XFetGBeuhAsfmUspK6DokBeZ64+Kj9TCNRD/30pVz1BvQNA==",
"requires": {
"es-abstract": "^1.17.0-next.1",
"object-inspect": "^1.7.0"
},
"dependencies": {
"object-inspect": {
"version": "1.7.0",
"resolved": "https://registry.npmjs.org/object-inspect/-/object-inspect-1.7.0.tgz",
"integrity": "sha512-a7pEHdh1xKIAgTySUGgLMx/xwDZskN1Ud6egYYN3EdRW4ZMPNEDUTF+hwy2LUC+Bl+SyLXANnwz/jyh/qutKUw=="
}
}
},
"signal-exit": {
"version": "3.0.3",
"resolved": "https://registry.npmjs.org/signal-exit/-/signal-exit-3.0.3.tgz",
@ -8743,11 +8900,6 @@
"integrity": "sha512-4gDntzrifFnCEvyoO8PqyJDmguXgVPxKiIxrBKjIowvL9l+N66196+72XVYR8BBf1Uv1Fgt3bGevJ+sEmxfZzw==",
"dev": true
},
"vuex": {
"version": "3.3.0",
"resolved": "https://registry.npmjs.org/vuex/-/vuex-3.3.0.tgz",
"integrity": "sha512-1MfcBt+YFd20DPwKe0ThhYm1UEXZya4gVKUvCy7AtS11YAOUR+9a6u4fsv1Rr6ePZCDNxW/M1zuIaswp6nNv8Q=="
},
"w3c-hr-time": {
"version": "1.0.2",
"resolved": "https://registry.npmjs.org/w3c-hr-time/-/w3c-hr-time-1.0.2.tgz",
@ -8810,11 +8962,47 @@
"isexe": "^2.0.0"
}
},
"which-boxed-primitive": {
"version": "1.0.1",
"resolved": "https://registry.npmjs.org/which-boxed-primitive/-/which-boxed-primitive-1.0.1.tgz",
"integrity": "sha512-7BT4TwISdDGBgaemWU0N0OU7FeAEJ9Oo2P1PHRm/FCWoEi2VLWC9b6xvxAA3C/NMpxg3HXVgi0sMmGbNUbNepQ==",
"requires": {
"is-bigint": "^1.0.0",
"is-boolean-object": "^1.0.0",
"is-number-object": "^1.0.3",
"is-string": "^1.0.4",
"is-symbol": "^1.0.2"
}
},
"which-collection": {
"version": "1.0.1",
"resolved": "https://registry.npmjs.org/which-collection/-/which-collection-1.0.1.tgz",
"integrity": "sha512-W8xeTUwaln8i3K/cY1nGXzdnVZlidBcagyNFtBdD5kxnb4TvGKR7FfSIS3mYpwWS1QUCutfKz8IY8RjftB0+1A==",
"requires": {
"is-map": "^2.0.1",
"is-set": "^2.0.1",
"is-weakmap": "^2.0.1",
"is-weakset": "^2.0.1"
}
},
"which-module": {
"version": "2.0.0",
"resolved": "https://registry.npmjs.org/which-module/-/which-module-2.0.0.tgz",
"integrity": "sha1-2e8H3Od7mQK4o6j6SzHD4/fm6Ho="
},
"which-typed-array": {
"version": "1.1.2",
"resolved": "https://registry.npmjs.org/which-typed-array/-/which-typed-array-1.1.2.tgz",
"integrity": "sha512-KT6okrd1tE6JdZAy3o2VhMoYPh3+J6EMZLyrxBQsZflI1QCZIxMrIYLkosd8Twf+YfknVIHmYQPgJt238p8dnQ==",
"requires": {
"available-typed-arrays": "^1.0.2",
"es-abstract": "^1.17.5",
"foreach": "^2.0.5",
"function-bind": "^1.1.1",
"has-symbols": "^1.0.1",
"is-typed-array": "^1.1.3"
}
},
"word-wrap": {
"version": "1.2.3",
"resolved": "https://registry.npmjs.org/word-wrap/-/word-wrap-1.2.3.tgz",

View file

@ -37,8 +37,11 @@
"babel-polyfill": "^6.26.0",
"clone": "^2.1.2",
"copy-to-clipboard": "^3.3.1",
"deep-equal": "^2.0.3",
"diff": "^4.0.2",
"do-bulma": "git+https://github.com/do-community/do-bulma.git",
"do-vue": "git+https://github.com/do-community/do-vue.git",
"escape-html": "^1.0.3",
"node-gzip": "^1.1.2",
"parcel-bundler": "^1.12.4",
"pretty-checkbox-vue": "^1.1.9",
@ -49,8 +52,7 @@
"vue": "^2.6.11",
"vue-hot-reload-api": "^2.3.3",
"vue-prism-component": "^1.2.0",
"vue-select": "^3.10.3",
"vuex": "^3.3.0"
"vue-select": "^3.10.3"
},
"devDependencies": {
"@babel/plugin-transform-runtime": "^7.9.0",

View file

@ -1,4 +1,6 @@
import qs from 'qs';
import sslProfiles from '../../util/ssl_profiles';
import exportData from '../../util/export_data';
import websiteConf from './website.conf';
export default (domains, global) => {
@ -6,7 +8,9 @@ export default (domains, global) => {
// Source
config['# Generated by nginxconfig.io'] = '';
config[`# ${window.location.protocol}//${window.location.host}${window.location.pathname}${window.location.search}`] = '';
const data = exportData(domains.map((domain, index) => [domain, index]).filter(d => d[0] !== null), global);
const query = qs.stringify(data, { allowDots: true });
config[`# ${window.location.protocol}//${window.location.host}${window.location.pathname}${query.length ? '?' : ''}${query}`] = '';
// Basic nginx conf
config.user = global.nginx.user.computed;
@ -68,17 +72,20 @@ export default (domains, global) => {
config.http.push(['ssl_session_cache', 'shared:SSL:10m']);
config.http.push(['ssl_session_tickets', 'off']);
if (sslProfiles[global.https.sslProfile.computed].dh_param_size) {
config.http.push(['# Diffie-Hellman parameter for DHE ciphersuites', '']);
config.http.push(['ssl_dhparam', `${global.nginx.nginxConfigDirectory.computed.replace(/\/+$/, '')}/dhparam.pem`]);
}
const sslProfile = sslProfiles[global.https.sslProfile.computed];
if (sslProfile) {
if (sslProfile.dh_param_size) {
config.http.push(['# Diffie-Hellman parameter for DHE ciphersuites', '']);
config.http.push(['ssl_dhparam', `${global.nginx.nginxConfigDirectory.computed.replace(/\/+$/, '')}/dhparam.pem`]);
}
config.http.push([`# ${sslProfiles[global.https.sslProfile.computed].name} configuration`, '']);
config.http.push(['ssl_protocols', sslProfiles[global.https.sslProfile.computed].protocols.join(' ')]);
if (sslProfiles[global.https.sslProfile.computed].ciphers.length)
config.http.push(['ssl_ciphers', sslProfiles[global.https.sslProfile.computed].ciphers.join(':')]);
if (sslProfiles[global.https.sslProfile.computed].server_preferred_order)
config.http.push(['ssl_prefer_server_ciphers', 'on']);
config.http.push([`# ${sslProfile.name} configuration`, '']);
config.http.push(['ssl_protocols', sslProfile.protocols.join(' ')]);
if (sslProfile.ciphers.length)
config.http.push(['ssl_ciphers', sslProfile.ciphers.join(':')]);
if (sslProfile.server_preferred_order)
config.http.push(['ssl_prefer_server_ciphers', 'on']);
}
config.http.push(['# OCSP Stapling', '']);
config.http.push(['ssl_stapling', 'on']);

View file

@ -17,7 +17,8 @@ limitations under the License.
import 'babel-polyfill';
import Vue from 'vue';
import App from './templates/app.vue';
import './util/prism_bundle';
import App from './templates/app';
import i18n from './i18n';
document.head.title = i18n.templates.app.title;

View file

@ -435,10 +435,12 @@ $highlight: #f2c94c;
// Fix Bulma interfering with Prism
.token {
&.number,
&.tag {
&.tag,
&.entity,
&.operator,
&.url {
background: transparent;
border-radius: initial;
color: inherit;
display: initial;
font-size: inherit;
margin: initial;
@ -451,4 +453,16 @@ $highlight: #f2c94c;
}
}
}
.code-toolbar {
> .toolbar {
right: calc(.2em + 16px);
}
}
mark {
background: rgba($highlight, .45);
color: inherit;
display: inline-block;
}
}

View file

@ -66,11 +66,11 @@ limitations under the License.
<div :class="`column ${splitColumn ? 'is-half' : 'is-full'} is-full-mobile is-full-tablet`">
<h2>Config files</h2>
<div class="columns is-multiline">
<div v-for="(conf, i) in confFiles"
:class="`column ${confFiles.length > 1 && !splitColumn ? 'is-half' : 'is-full'} is-full-mobile is-full-tablet`"
<div v-for="conf in confFilesOutput"
:class="`column ${confFilesOutput.length > 1 && !splitColumn ? 'is-half' : 'is-full'} is-full-mobile is-full-tablet`"
>
<h3>{{ nginxDir }}/{{ conf[0] }}</h3>
<Prism :key="`${conf[0]}${i}`" language="nginx" :code="conf[1]"></Prism>
<pre><code ref="files" class="language-nginx" v-html="conf[1]"></code></pre>
</div>
</div>
</div>
@ -83,8 +83,10 @@ limitations under the License.
<script>
import clone from 'clone';
import Prism from 'vue-prism-component';
import 'prismjs/components/prism-nginx';
import { diffLines } from 'diff';
import escape from 'escape-html';
import deepEqual from 'deep-equal';
import Prism from 'prismjs';
import Header from 'do-vue/src/templates/header';
import Footer from 'do-vue/src/templates/footer';
import isChanged from '../util/is_changed';
@ -99,7 +101,6 @@ limitations under the License.
export default {
name: 'App',
components: {
Prism,
Header,
Footer,
Domain,
@ -114,6 +115,9 @@ limitations under the License.
active: 0,
ready: false,
splitColumn: false,
confWatcherWaiting: false,
confFilesPrevious: [],
confFilesOutput: [],
};
},
computed: {
@ -127,19 +131,22 @@ limitations under the License.
return generators(this.$data.domains.filter(d => d !== null), this.$data.global);
},
},
watch: {
confFiles(newConf, oldConf) {
if (this.$data.confWatcherWaiting) return;
// Set that we're waiting for changes to stop
this.$data.confWatcherWaiting = true;
this.$data.confFilesPrevious = oldConf;
// Check next tick to see if anything has changed again
this.$nextTick(() => this.checkChange(newConf));
},
},
mounted() {
// If there is no query param, add one default domain and we're ready
if (!window.location.search.length) {
this.$data.domains.push(clone(Domain.delegated));
this.$data.ready = true;
return;
}
// Import any data from the URL query params
// Import any data from the URL query params, defaulting to one domain
// The config file watcher will handle setting the app as ready
importData(window.location.search, this.$data.domains, this.$data.global, this.$nextTick);
// After two ticks (one tick to set watched data), we are ready
this.$nextTick(() => this.$nextTick(() => this.$data.ready = true));
},
methods: {
changes(index) {
@ -161,6 +168,88 @@ limitations under the License.
this.$set(this.$data.domains, index, null);
if (this.$data.active === index) this.$data.active = this.$data.domains.findIndex(d => d !== null);
},
highlightFiles() {
for (const file of this.$refs.files)
Prism.highlightElement(file, true);
},
checkChange(oldConf) {
// If nothing has changed for a tick, we can use the config files
if (deepEqual(oldConf, this.confFiles)) {
// If this is the initial data load on app start, don't diff and set ourselves as ready
if (!this.$data.ready) {
this.$data.confFilesOutput = this.confFiles;
this.$nextTick(() => {
this.$data.confWatcherWaiting = false;
this.highlightFiles();
this.$data.ready = true;
});
return;
}
// Otherwise, do the diff!
this.updateDiff(this.confFiles, this.$data.confFilesPrevious);
return;
}
// Check next tick to see if anything has changed again
this.$nextTick(() => this.checkChange(this.confFiles));
},
updateDiff(newConf, oldConf) {
// Work through each file in the new config
const newFiles = [];
for (const [newFileName, newFileConf] of newConf) {
// If a file with the same name existed before, diff!
// TODO: Handle diffing across file renames (eg. when a user changes a domain name)
const old = oldConf && oldConf.find(c => c[0] === newFileName);
if (old) {
// Get the diff
const diff = diffLines(old[1], newFileConf);
// Wrap additions in <mark>, drop removals
const output = diff.map((change, index, array) => {
if (change.removed) return '';
const escaped = escape(change.value);
// Don't mark as diff if nothing changed
if (!change.added) return escaped;
// Don't mark as diff if only whitespace changed
if (index > 0 && array[index - 1].removed) {
if (array[index - 1].value.replace(/\s/g, '') === change.value.replace(/\s/g, '')) {
return escaped;
}
}
if (index < array.length - 1 && array[index + 1].removed) {
if (array[index + 1].value.replace(/\s/g, '') === change.value.replace(/\s/g, '')) {
return escaped;
}
}
// Mark the diff, without highlighting whitespace
return escaped
.split('\n')
.map(part => part.replace(/^(\s*)(.*)(\s*)$/, '$1<mark>$2</mark>$3'))
.join('\n');
}).join('');
// Store
newFiles.push([newFileName, output]);
continue;
}
// No diffing, just store the new file
newFiles.push([newFileName, newFileConf]);
}
this.$data.confFilesOutput = newFiles;
// Highlight in-browser (using web workers so UI isn't blocked) once these files are rendered
this.$nextTick(() => {
this.$data.confWatcherWaiting = false;
this.highlightFiles();
});
},
},
};
</script>

View file

@ -5,50 +5,50 @@
<p>
Comment out SSL related directives in the configuration:
<br />
<Prism language="bash" :code="`sed -i -r 's/(listen .*443)/\\1;#/g; s/(ssl_(certificate|certificate_key|trusted_certificate) )/#;#\\1/g' ${sitesAvailable}`"></Prism>
</p>
<pre><code ref="commentOut" class="language-bash"></code></pre>
</li>
<li>
<p>
Reload your NGINX server:
<br />
<Prism language="bash" code="sudo nginx -t && sudo systemctl reload nginx"></Prism>
</p>
<pre><code ref="reload" class="language-bash">sudo nginx -t && sudo systemctl reload nginx</code></pre>
</li>
<li>
<p>
Obtain SSL certificates from Let's Encrypt using Certbot:
<br />
<Prism language="bash" :code="certbotCmds"></Prism>
</p>
<pre><code ref="certBot" class="language-bash"></code></pre>
</li>
<li>
<p>
Uncomment SSL related directives in the configuration:
<br />
<Prism language="bash" :code="`sed -i -r 's/#?;#//g' ${sitesAvailable}`"></Prism>
</p>
<pre><code ref="unComment" class="language-bash"></code></pre>
</li>
<li>
<p>
Reload your NGINX server:
<br />
<Prism language="bash" code="sudo nginx -t && sudo systemctl reload nginx"></Prism>
</p>
<pre><code ref="reload2" class="language-bash">sudo nginx -t && sudo systemctl reload nginx</code></pre>
</li>
<li>
<p>
Configure Certbot to reload NGINX when it successfully renews certificates:
<br />
<Prism language="bash" code="echo -e '#!/bin/bash\nnginx -t && systemctl reload nginx' | sudo tee /etc/letsencrypt/renewal-hooks/post/nginx-reload.sh"></Prism>
<br />
<Prism language="bash" code="sudo chmod a+x /etc/letsencrypt/renewal-hooks/post/nginx-reload.sh"></Prism>
</p>
<pre><code ref="renewal" class="language-bash">echo -e '#!/bin/bash\nnginx -t && systemctl reload nginx' | sudo tee /etc/letsencrypt/renewal-hooks/post/nginx-reload.sh</code></pre>
<br />
<pre><code ref="chmod" class="language-bash">sudo chmod a+x /etc/letsencrypt/renewal-hooks/post/nginx-reload.sh</code></pre>
</li>
</ol>
@ -67,17 +67,13 @@
</template>
<script>
import Prism from 'vue-prism-component';
import 'prismjs/components/prism-bash';
import Prism from 'prismjs';
import i18n from '../../i18n';
export default {
name: 'SetupCertbot',
display: 'Certbot',
key: 'certbot',
components: {
Prism,
},
props: {
data: Object,
},
@ -101,17 +97,35 @@
}
return false;
},
sitesAvailable() {
if (!this.$props.data.global.tools.modularizedStructure.computed) return `${this.nginxDir}/nginx.conf`;
const enabledAvailable = this.$props.data.global.tools.symlinkVhost.computed ? 'available' : 'enabled';
return this.$props.data.domains
.filter(domain => domain.https.certType.computed === 'letsEncrypt')
.map(domain => `${this.nginxDir}/sites-${enabledAvailable}/${domain.server.domain.computed}.conf`)
.join(' ');
},
watch: {
'$props.data.domains': {
handler() {
this.certbotCmds();
this.sitesAvailable();
},
deep: true,
},
'$props.data.global.tools': {
handler() {
this.sitesAvailable();
},
deep: true,
},
},
mounted() {
this.$nextTick(() => this.certbotCmds());
this.$nextTick(() => this.sitesAvailable());
this.$nextTick(() => Prism.highlightElement(this.$refs.reload, true));
this.$nextTick(() => Prism.highlightElement(this.$refs.reload2, true));
this.$nextTick(() => Prism.highlightElement(this.$refs.renewal, true));
this.$nextTick(() => Prism.highlightElement(this.$refs.chmod, true));
},
methods: {
certbotCmds() {
return this.$props.data.domains
if (!this.$refs.certBot) return;
this.$refs.certBot.textContent = this.$props.data.domains
.filter(domain => domain.https.certType.computed === 'letsEncrypt')
.map(domain => (
[
@ -124,6 +138,26 @@
'-n --agree-tos --force-renewal',
].filter(x => x !== null).join(' ')
)).join('\n');
this.$nextTick(() => Prism.highlightElement(this.$refs.certBot, true));
},
sitesAvailable() {
if (!this.$refs.commentOut) return;
if (!this.$refs.unComment) return;
const enabledAvailable = this.$props.data.global.tools.symlinkVhost.computed ? 'available' : 'enabled';
const sitesAvailable = this.$props.data.global.tools.modularizedStructure.computed
? this.$props.data.domains
.filter(domain => domain.https.certType.computed === 'letsEncrypt')
.map(domain => `${this.nginxDir}/sites-${enabledAvailable}/${domain.server.domain.computed}.conf`)
.join(' ')
: `${this.nginxDir}/nginx.conf`;
this.$refs.commentOut.textContent = `sed -i -r 's/(listen .*443)/\\1;#/g; s/(ssl_(certificate|certificate_key|trusted_certificate) )/#;#\\1/g' ${sitesAvailable}`;
this.$refs.unComment.textContent = `sed -i -r 's/#?;#//g' ${sitesAvailable}`;
this.$nextTick(() => Prism.highlightElement(this.$refs.commentOut, true));
this.$nextTick(() => Prism.highlightElement(this.$refs.unComment, true));
},
},
};

View file

@ -38,10 +38,10 @@ export default (query, domains, global, nextTick) => {
ignoreQueryPrefix: true,
allowDots: true,
decoder(value) {
value = decodeURIComponent(value);
// If it's a set of digits, parse it as a float
if (/^(\d+|\d*\.\d+)$/.test(value)) {
return parseFloat(value);
}
if (/^(\d+|\d*\.\d+)$/.test(value)) return parseFloat(value);
// If it matches a keyword, convert it
let keywords = {
@ -50,9 +50,7 @@ export default (query, domains, global, nextTick) => {
null: null,
undefined: undefined,
};
if (value in keywords) {
return keywords[value];
}
if (value in keywords) return keywords[value];
// Otherwise, leave it as is
return value;

View file

@ -0,0 +1,7 @@
import 'prismjs';
import 'prismjs/components/prism-nginx';
import 'prismjs/components/prism-bash';
import 'prismjs/plugins/keep-markup/prism-keep-markup';
import 'prismjs/plugins/toolbar/prism-toolbar';
import 'prismjs/plugins/toolbar/prism-toolbar.css';
import 'prismjs/plugins/copy-to-clipboard/prism-copy-to-clipboard';