Nginx-erako konfigurazioen sorrera, tiraketa eskaera baten historia

Agurrak, kamaradak. Ederra nire borroka zerbitzarietan nginx 2006tik dago martxan eta bere administrazioaren urteetan zehar konfigurazio eta txantiloi asko pilatu ditut. Asko goraipatu nuen nginx eta, nolabait, erdiguneko nginx hub bat ere hasi nuela, erakutsi m/
Lagunek beraientzako garapen baserri bat ezartzeko eskatu zidaten, eta nire txantiloi zehatzak arrastatu beharrean, proiektu interesgarri bat gogoratu nuen. nginxconfig.io, konfigurazioak apaletan sakabanatzen dituena eta dena prestatzen du lets enkriptatzeko, etab. Pentsatu nuen, zergatik ez? Hala ere, haserretu egin nintzen nginxconfig-ek zip artxiboa arakatzailean deskargatzea eskaintzen didalako, wget/fetch/curl erabiliz zerbitzarira zuzenean kargatzen utzi gabe. Zer zentzugabekeria, zergatik behar dut nabigatzailean, zerbitzarian behar dut kontsolatik. Haserre, github-era joan nintzen proiektuaren erraiak ikustera, eta horrek bere sardexka ekarri zuen eta, ondorioz, pull request bat. Interesgarria ez balitz ez nuke idatziko 😉

Noski, iturrietan sakondu aurretik, Chrome-k sortutako zip artxiboa konfigurazioekin nondik ateratzen duen begiratu nuen, eta han "blob:"-rekin hasten zen helbide bat zegoen nire zain, aupa. Dagoeneko argi geratu da zerbitzuak ez duela ezer sortzen bidean, izan ere, js-ek egiten du dena. Izan ere, zip artxiboa bezeroak, arakatzaileak eta javascriptek berak sortzen dute. Horiek. edertasuna da proiektua nginxconfig.io besterik gabe, html orri gisa gorde daiteke, batzuetara igo narod.ru eta funtzionatuko du) Oso irtenbide dibertigarria eta interesgarria da, hala ere, zerbitzariak konfiguratzeko izugarri deserosoa da, hain zuzen ere, proiektu hau sortu zenerako. Deskargatu sortutako artxiboa arakatzaile batekin, eta gero zerbitzarira transferitu nc erabiliz... 2019an? Sortutako konfigurazioa zerbitzarira zuzenean deskargatzeko modua aurkitzeko zeregina ezarri nuen.
Proiektua bideratu ondoren, nire aukerak zeintzuk ziren pentsatzen hasi nintzen. Zaildu egin zen zeregina, ez nuelako desbideratu nahi proiektuak front-end hutsa izaten jarraitzeko baldintzatik, inolako back-end gabe. Noski, soluziorik errazena nodej-ak ateratzea eta lotura zuzenak erabiliz konfigurazioekin artxibo bat sortzera behartzea izango litzateke.
Egia esan, ez zegoen aukera askorik. Zehatzago esanda, bakarra etorri zitzaidan burura. Konfigurazioak konfiguratu eta zip artxibo bat lortzeko zerbitzariaren kontsolara kopia dezakegun esteka bat lortu behar dugu.
Sortutako zip artxiboko hainbat testu-fitxategik dezente pisatzen zuten, literalki kilobyte batzuk. Konponbidea agerikoa zen base64 katea sortutako zip artxibotik ateratzea eta bufferera botatzea, zerbitzarian komandoa kontsolan zegoen bitartean.

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

zip fitxategi hau bera sor genezake.

nginxconfig.io AngularJS-en idatzi zen, ezin dut imajinatu ere egin zein kilometroko kode beharko zen egileak js marko erreaktibo bat aukeratu ez balu. Baina ezin hobeto imajina dezaket hau guztia zenbat eta sinpleagoa eta politagoa inplementa daitekeen VueJS-en, nahiz eta hau guztiz bestelako gaia den.
Proiektuko baliabideetan zip artxibo bat sortzeko metodo bat ikusten dugu:

$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',
	});
};

dena nahiko erraza da, liburutegia erabiliz jszip Zip bat sortzen da non konfigurazio fitxategiak jartzen diren. Zip artxiboa sortu ondoren, js-k arakatzaileari elikatzen dio liburutegia erabiliz FileSaver.js:

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

non edukia zip artxiboaren ondoriozko blob objektua den.

Ados, ondoan beste botoi bat gehitu behar nuen eta gainean klik egiten nuenean, ez nuen sortutako zip artxiboa nabigatzailean gordeko, base64 kodea bertatik lortuko. Pixka bat ibili ondoren, 2 metodo lortu nituen, deskarga Zip bakarraren ordez:

$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',
	});
};

Konturatuko zinetenez, zip artxiboaren sorrera bera generaZip metodo pribatura eraman nuen, eta abar. Hau AngularJS da, eta egileak berak deietara atxikitzen du eta ez zuen promesen bidez ezarri. downloadZip-ek irteera gisa gorde zuen oraindik, downloadBase64-k zerbait desberdina egin zuen bitartean. html5-n iritsi zaigun FileReader objektu bat sortzen dugu eta nahikoa da dagoeneko eskuragarria erabiltzeko. Horrek, garai batean, base64 kate bat sor dezake blob batetik, edo hobeto esanda, DataURL kate bat egiten du, baina hau ez da hain garrantzitsua guretzat, zeren DataURL-ek behar duguna dauka. Bingoa, traba txiki bat itxaroten nuen hau guztia bufferean sartzen saiatu nintzenean. Egileak liburutegia erabili zuen proiektuan arbel js, arbelarekin flash objekturik gabe lan egiteko aukera ematen duena, hautatutako testuan oinarrituta. Hasieran, nire base64 display:none; elementu batean jartzea erabaki nuen, baina kasu honetan ezin izan nuen arbelean jarri. ez da bereizketarik gertatzen. Hori dela eta, bistaratu beharrean:none; Egin dut

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

horrek aukera eman zidan elementua bistatik ezkutatzeko eta benetan orrian uzteko. Voila, zeregina amaitu zen, nire botoian klik egin nuenean, honelako lerro bat jarri zen bufferean:

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

zerbitzariko kontsolan itsatsi eta berehala zip artxibo bat jaso nuen konfigurazio guztiekin.
Eta, noski, tira eskaera bat bidali nion egileari, zeren... proiektua aktiboa eta bizia da, egilearen eguneraketak ikusi eta nire botoia eduki nahiko nuke) Interesa dutenentzat, hemen duzu nire sardexka proiektua eta bera tira eskaera, bertan ikusi ahal izango duzu zer zuzendu/gehitu dudana.
Garapen zoriontsua guztioi)

Iturria: www.habr.com