Ողջույններ, ընկերներ։ Գեղեցիկ իմ մարտական սերվերների վրա
Ընկերներն ինձ խնդրեցին ստեղծել զարգացման ֆերմա իրենց համար, և իմ կոնկրետ կաղապարները քաշելու փոխարեն, ես հիշեցի մի հետաքրքիր նախագիծ.
Իհարկե, մինչ աղբյուրները փորփրելը, ես նայեցի, թե Chrome-ը որտեղ է քաշում ստեղծված zip-արխիվը կոնֆիգներով, և այնտեղ ինձ սպասում էր «blob:»-ով սկսվող հասցե, օպ: Արդեն պարզ է դարձել, որ ծառայությունը ճանապարհին ոչինչ չի առաջացնում, իրականում այդ ամենը կատարվում է js-ի կողմից։ Իրոք, zip արխիվը ստեղծվում է հաճախորդի, բրաուզերի և հենց javascript-ի կողմից: Նրանք. գեղեցկությունն այն է, որ նախագիծը
Նախագիծը ճեղքելուց հետո ես սկսեցի մտածել, թե որոնք են իմ տարբերակները: Խնդիրը բարդանում էր նրանով, որ ես չէի ուզում շեղվել այն պայմանից, որ նախագիծը պետք է մնա մաքուր ֆրոնտ-end, առանց որևէ հետնամասի։ Իհարկե, ամենապարզ լուծումը կլինի nodej-ներ հավաքելը և ստիպել նրան ստեղծել արխիվ կոնֆիգուրացիաներով՝ օգտագործելով ուղղակի հղումներ:
Իրականում շատ տարբերակներ չկային։ Ավելի ճիշտ՝ մտքիս միայն մեկն է եկել. Մենք պետք է կարգավորենք կոնֆիգուրացիաները և ստանանք հղում, որը կարող ենք պատճենել սերվերի վահանակին՝ zip արխիվ ստանալու համար:
Ստացված zip արխիվում մի քանի տեքստային ֆայլեր կշռում էին բավականին քիչ՝ բառացիորեն մի քանի կիլոբայթ: Ակնհայտ լուծումն էր ստանալ base64 տողը ստեղծված zip արխիվից և նետել այն բուֆեր, մինչդեռ սերվերի վրա գտնվում էր վահանակի հրամանով:
echo 'base64string' | base64 --decode > config.zip
մենք կարող ենք ստեղծել այս նույն zip ֆայլը:
Ծրագրի ռեսուրսներում մենք տեսնում ենք 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',
});
};
ամեն ինչ բավականին պարզ է՝ օգտագործելով գրադարանը
saveAs(content, 'nginxconfig.io-' + $scope.getDomains().join(',') + '.zip');
որտեղ բովանդակությունը zip արխիվի ստացված բլբի օբյեկտն է:
Լավ, ինձ մնում էր ընդամենը մեկ այլ կոճակ ավելացնել դրա կողքին, և երբ ես սեղմեցի դրա վրա, ես չէի պահում ստացված zip արխիվը բրաուզերում, այլ ստանում էի base64 կոդը դրանից: Մի փոքր պտտվելուց հետո ես ստացա 2 մեթոդ՝ ընդամենը մեկ ներբեռնման Zip-ի փոխարեն.
$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',
});
};
Ինչպես նկատեցիք, ես zip արխիվի սերունդը տեղափոխեցի մասնավոր generateZip մեթոդ և այլն: Սա AngularJS-ն է, և հեղինակն ինքը հավատարիմ է մնում զանգերին և չի իրականացրել այն խոստումների միջոցով։ downloadZip-ը դեռևս saveAs-ն արեց որպես ելք, մինչդեռ downloadBase64-ը մի փոքր այլ բան արեց: Մենք ստեղծում ենք FileReader օբյեկտ, որը եկել է մեզ html5-ով և արդեն բավականին է
position: absolute;
z-index: -1;
opacity: 0;
ինչը թույլ տվեց ինձ և՛ թաքցնել տարրը տեսադաշտից, և՛ իրականում թողնել այն էջում: Voila, առաջադրանքը ավարտվեց, երբ ես սեղմեցի իմ կոճակը, բուֆերում տեղադրվեց այսպիսի տող.
echo 'base64string' | base64 --decode > config.zip
որը ես պարզապես տեղադրեցի սերվերի վահանակի մեջ և անմիջապես ստացա zip արխիվ՝ բոլոր կոնֆիգուրացիաներով:
Եվ, իհարկե, ես հեղինակին խնդրանք եմ ուղարկել, քանի որ... նախագիծը ակտիվ է և աշխույժ, ես կցանկանայի տեսնել հեղինակի թարմացումները և ունենալ իմ սեփական կոճակը) Հետաքրքրվողների համար այստեղ է
Բարի զարգացում բոլորին)
Source: www.habr.com