Generazione di cunfigurazioni per nginx, storia di una dumanda di pull

Saluti, camaradi. Bella nantu à i mo servitori di cummattimentu nginx hè in esecuzione da 2006 è annantu à l'anni di a so amministrazione aghju accumulatu assai cunfigurazioni è mudelli. Aghju elogiatu assai nginx è in qualchì manera hè risultatu chì aghju ancu principiatu un hub nginx in u hub, ancu mostra m/
L'amichi m'hà dumandatu di creà una splutazioni di sviluppu per elli, è invece di trascinà i mo mudelli specifichi, aghju ricurdatu di un prughjettu interessante. nginxconfig.io, chì sparghje i cunfigurazioni nantu à i scaffali è preparanu tuttu per lets encrypt, etc. Pensu, perchè micca? In ogni casu, era infuriatu da u fattu chì nginxconfig m'offre di scaricà l'archiviu zip in u navigatore, senza permette di caricallu direttamente à u servitore cù wget/fetch/curl. Chì sciocchezza, perchè l'aghju bisognu in u navigatore, l'aghju bisognu à u servitore da a cunsola. Arrabbiatu, aghju andatu à github per vede u guts di u prugettu, chì hà purtatu à a so furchetta è, in u risultatu, una dumanda di pull. Chì ùn aghju micca scrittu s'ellu ùn era micca interessante 😉

Generazione di cunfigurazioni per nginx, storia di una dumanda di pull

Di sicuru, prima di scavà in e fonti, aghju guardatu induve Chrome tira l'archiviu zip generatu cù cunfigurazioni, è quì un indirizzu chì principia cù "blob:" m'aspittava, oops. Hè digià diventatu chjaru chì u serviziu ùn genera nunda in a strada, in fattu, hè tuttu fattu da js. Infatti, l'archiviu zip hè generatu da u cliente, u navigatore è u javascript stessu. Quelli. a bellezza hè chì u prugettu nginxconfig.io pò esse simpliciamente salvate cum'è una pagina html, caricata à certi narod.ru è hà da travaglià) Questa hè una suluzione assai divertente è interessante, in ogni modu, hè terribilmente inconveniente per a stallazione di servitori, in fattu, esattamente per ciò chì stu prughjettu hè statu creatu. Scaricate l'archiviu generatu cù un navigatore, è poi trasfiriu à u servitore cù nc... in 2019? Aghju stabilitu u compitu di truvà una manera di scaricà a cunfigurazione resultanti direttamente à u servitore.
Dopu avè fattu u prugettu, aghju cuminciatu à pensà à ciò chì e mo opzioni eranu. U compitu era cumplicatu da u fattu chì ùn vulia micca deviate da a cundizione chì u prugettu deve esse un front-end puro, senza alcunu back-end. Di sicuru, a suluzione più sèmplice seria di tirà nodejs è furzà à generà un archiviu cù cunfigurazioni cù ligami diretti.
In fatti, ùn ci era parechje scelte. Più precisamente, solu unu hè vinutu in mente. Avemu bisognu di cunfigurà e cunfigurazione è uttene un ligame chì pudemu copià à a cunsola di u servitore per uttene un archiviu zip.
Diversi schedarii di testu in l'archiviu zip risultatu pisanu un pocu, literalmente uni pochi kilobytes. A suluzione ovvia era di ottene a stringa di base64 da l'archiviu zip generatu è scaccià in u buffer, mentri in u servitore cù u cumandimu in a cunsola.

echo 'base64string' | base64 --decode > config.zip

Pudemu creà stu stessu schedariu zip.

nginxconfig.io hè statu scrittu in AngularJS, ùn possu mancu imaginà chì chilometri di codice avissi statu necessariu se l'autore ùn avia micca sceltu un framework js reattivu. Ma possu perfettamenti imagine quantu più simplice è più bellu tuttu questu puderia esse implementatu in VueJS, ancu s'ellu hè un tema completamente diversu.
In i risorse di u prughjettu vedemu un metudu per generà un archiviu zip:

$scope.downloadZip = function() {
	var zip = new JSZip();

	var sourceCodes = $window.document.querySelectorAll('main .file .code.source');

	for (var i = 0; i < sourceCodes.length; i++) {
		var sourceCode = sourceCodes[i];

		var name	= sourceCode.dataset.filename;
		var content	= sourceCode.children[0].children[0].innerText;

		if (!$scope.isSymlink() && name.match(/^sites-available//)) {
			name = name.replace(/^sites-available//, 'sites-enabled/');
		}

		zip.file(name, content);

		if (name.match(/^sites-available//)) {
			zip.file(name.replace(/^sites-available//, 'sites-enabled/'), '../' + name, {
				unixPermissions: parseInt('120755', 8),
			});
		}
	}

	zip.generateAsync({
		type: 'blob',
		platform: 'UNIX',
	}).then(function(content) {
		saveAs(content, 'nginxconfig.io-' + $scope.getDomains().join(',') + '.zip');
	});

	gtag('event', $scope.getDomains().join(','), {
		event_category: 'download_zip',
	});
};

tuttu hè abbastanza sèmplice, usendu a biblioteca jszip Un zip hè creatu induve i schedarii di cunfigurazione sò posti. Dopu avè creatu l'archiviu zip, js l'alimenta à u navigatore utilizendu a biblioteca FileSaver.js:

saveAs(content, 'nginxconfig.io-' + $scope.getDomains().join(',') + '.zip');

induve u cuntenutu hè l'ughjettu blob risultatu di l'archiviu zip.

Ok, tuttu ciò chì aghju avutu à fà era aghjunghje un altru buttone accantu è quandu aghju clicatu nantu à ellu, ùn aghju micca salvatu l'archiviu zip risultatu in u navigatore, ma uttene u codice base64 da ellu. Dopu un pocu di fiddle, aghju avutu 2 metudi, invece di un solu downloadZip:

$scope.downloadZip = function() {
	generateZip(function (content) {
		saveAs(content, 'nginxconfig.io-' + $scope.getDomains().join(',') + '.zip');
	});

	gtag('event', $scope.getDomains().join(','), {
		event_category: 'download_zip',
	});
};
$scope.downloadBase64 = function() {
	generateZip(function (content) {
		var reader = new FileReader();
		reader.readAsDataURL(content);
		reader.onloadend = function() {
			var base64 = reader.result.replace(/^data:.+;base64,/, '');
			// в переменной base64 как раз нужный мне zip архив в виде base64 строки
		}
	});

	gtag('event', $scope.getDomains().join(','), {
		event_category: 'download_base64',
	});
};

Comu pudete avè nutatu, aghju spustatu a generazione di l'archiviu zip stessu à u metudu generateZip privatu, è cusì. Il s'agit d'AngularJS, et l'auteur lui-même s'attache aux rappels et ne l'a pas mis en œuvre grâce à des promesses. downloadZip hà sempre salvatu cum'è output, mentri downloadBase64 hà fattu qualcosa un pocu sfarente. Creemu un ughjettu FileReader chì hè ghjuntu à noi in html5 è hè digià abbastanza accessibile per usu. Chì, à un tempu, pò fà una stringa base64 da un blob, o piuttostu, face una stringa DataURL, ma questu ùn hè micca cusì impurtante per noi, perchè DataURL cuntene esattamente ciò chì avemu bisognu. Bingo, un pocu snag m'aspittava quandu aghju pruvatu à mette tuttu questu in u buffer. L'autore hà utilizatu a biblioteca in u prugettu clipboardjs, chì permette di travaglià cù u clipboard senza oggetti flash, basatu annantu à u testu sceltu. Inizialmente, aghju decisu di mette a mo base64 in un elementu cù display:none;, ma in questu casu ùn pudia mette in u clipboard perchè ùn si faci micca separazione. Dunque, invece di vede: nimu; Aghju

position: absolute;
z-index: -1;
opacity: 0;

chì m'hà permessu di ammuccià l'elementu da a vista è di lascià in a pagina. Voila, u compitu hè statu finitu, quandu aghju clicatu nantu à u mo buttone, una linea cum'è questu hè stata posta in u buffer:

echo 'base64string' | base64 --decode > config.zip

chì aghju solu incollatu in a cunsola nantu à u servitore è immediatamente ricevutu un archiviu zip cù tutte e cunfigurazioni.
E, sicuru, aghju mandatu una pull request à l'autore, perchè... u prugettu hè attivu è animatu, mi piacerebbe vede l'aghjurnamenti da l'autore è avè u mo propiu buttone) Per quelli chì sò interessati, quì hè a mo furchetta prughjettu è ellu stessu dumanda di pull, induve pudete vede ciò chì aghju currettu / aghjustatu.
Felice sviluppu à tutti)

Generazione di cunfigurazioni per nginx, storia di una dumanda di pull

Source: www.habr.com

Add a comment