WebAssembly எனும் இணையதொகுப்பில் ‘அனைவருக்கும் வணக்கம்’ எனும் நம்முடைய முதல் பயன்பாட்டை எவ்வாறு உருவாக்குவது

இணையதொகுப்பு(WebAssembly) என்பது ஒரு எண்மிகுறிமுறை வடிவமைப்பாகும், இதன்உதவியுடன் ஒவ்வொரு இணையஉலாவியும் அதன் புரவலர் கணினியில் இயந்திர குறிமுறைவரிகளை தொகுக்க முடியும். JavaScript , WebGL ஆகியவற்றுடன், இணைய உலாவியில் இயங்குதளத்தின்-சுதந்திரமான பயன்பாட்டிற்கான பயன்பாடுகளை புகுதல்(porting)செய்வதற்கான கோரிக்கையை இந்த WebAssembly ஆனது பூர்த்தி செய்கின்றது. சி ++ ,Rust ஆகியகணினிமொழிகளுக்கான தொகுப்புகளின் இலக்காக, இந்த இணையதொகுப்பானது இணைய உலாவிகள் குறிமுறைவரிகளை சுயமாக இயக்க உதவுகிறது.
பொதுவாக ஒரு இணைய தொகுப்பிற்கான, பயன்பாடு பற்றி விவாதிக்கும்போது, அதனுடைய மூன்று நிலைகளை நாம் நன்கு அறிந்துகொள்ள வேண்டும்:
1.முதலாவதாக மூல குறிஂமுறைவரிகள் (எ.கா., சி ++ அல்லது Rust): இணையஉலாவியுடன் இணக்கமாக செயல்படுகின்ற பயன்பாடாக இருக்குமாறு எழுதப்பட்ட வேண்டும்.
2. இரண்டாவதாக இணையதொகுப்புஎண்மி குறிமுறைவரிகள்: இந்த தொகுப்பின் இலக்காக இணையதொகுப்பு எண்மிகுறிமுறைவரிகளைத் தேர்வு செய்கின்றோம் எனில். இதன் விளைவாக, நாம் .wasm எனும் வடிவமைப்பு கோப்பைப் பெறுவோம்.
3. மூன்றாவதாக இயந்திர குறிமுறை (opcode): இணைய உலாவி .wasm எனும் வடிவமைப்பு கோப்பை பதிவேற்றம் செய்கின்றது தொடர்ந்து அதனுடையபுரவலர் அமைப்பின் தொடர்புடைய இயந்திர குறிமுறைவரிகளில் தொகுக்கின்றது.
இணையதொகுப்பில் மனிதர்களால் படிக்கக்கூடிய உரையில் இரும வடிவமைப்பைக் குறிக்கும் உரை வடிவமும் உள்ளது. எளிமைக்காக, இதை WASM- உரை என்று குறிப்பிடுவோம். WASM- எனும் உரையை உயர் மட்ட தொகுப்பு மொழியுடன் ஒப்பிடலாம். நிச்சயமாக, நாம் WASM- உரையின் அடிப்படையில் ஒரு முழுமையான பயன்பாட்டை எழுத மாட்டோம், ஆனால் இது மேலேதொப்பியின்(hood) கீழ் எவ்வாறு செயல்படுகிறது என்பதை அறிவது நல்லது (குறிப்பாக பிழைதிருத்தம் , செயல்திறன் தேர்வுமுறை ஆகியவற்றிற்காக).
இந்த கட்டுரையானது WASM- உரையின் அனைவருக்கும் வணக்கம் எனும் அதிக தரமான நிரலாக்கத்தை உருவாக்குவதன் மூலம் நமக்கு வழிகாட்டுகின்ற ஒரு. .Wat எனும் வடிவமைப்பிலான கோப்பை உருவாக்குவதை பற்றி விளக்கமளிக்கிறது பொதுவாக இந்த WASM- எனும் உரைக் கோப்பானது .wat என்றாவாறான எழுத்துகளுடன் முடிவடையும் வடிவமைப்பில் இருக்கும்.முதலில் அனைவருக்கும் வணக்கம்.wat என்ற வெற்று உரைக் கோப்பை உருவாக்குவதன் மூலம் புதியதாக ஒரு கோப்பினை உருவாக்கிடும் பணியை துவங்கி, நமக்கு பிடித்தமான உரை திருத்தியுடன் அந்த கோப்பினை திறந்து, அதில் இந்த குறிமுறைவரிகளை ஒட்டிடுக:
(module
;; Imports from JavaScript namespace
(import “console” “log” (func $log (param i32 i32)))
;; Import log function
(import “js” “mem” (memory 1))
;; Import 1 page of memory (54kb)
;; Data section of our module
(data (i32.const 0) “Hello World from WebAssembly!”)
;; Function declaration: Exported as அனைவருக்கும் வணக்கம்(), no arguments
(func (export “அனைவருக்கும் வணக்கம்”)
i32.const 0 ;; pass offset 0 to log
i32.const 29 ;; pass length 29 to log (strlen of sample text)
call $log
)
)
இந்த WASM- உரை வடிவக்கோப்பானது S- வெளிப்பாடுகளை அடிப்படையாகக் கொண்டது. தொடர்புகளை இயக்க, ஜாவாஸ்கிரிப்ட் செயலிகளின் பதிவிறக்க அறிக்கையுடன் பதிவிறக்கம் செய்யப்படுகின்றன, மேலும் இணையதொகுப்பு செயலிகள் பதிவேற்ற அறிக்கையுடன் பதிவேற்றம் செய்யப்படுகின்றன. இந்த எடுத்துக் காட்டில்கூறியுள்ளவாறு, பணியக தொகுப்பிலிருந்து பதிவு செயலியை பதிவிறக்கம் செய்துகொள்க, இது i32 வகையின் இரண்டு அளவுருக்களை உள்ளீடாகவும், ஒரு பக்க நினைவகத்தினை (64KB) சரத்தில் சேமித்திடவும் செய்கிறது. மேலும் இது சரத்தின்offset 0 இல் தரவுகளின் பிரிவில் எழுதப்படுகின்றது. இது தரவுகளின் பிரிவு நினைவகத்தின் மேலடுக்காகும், மேலும் நினைவகம் ஜாவாஸ்கிரிப்ட் பகுதியில் ஒதுக்கப்படுகின்றது. செயலிகள் func என்ற முக்கிய சொல்லுடன் குறிக்கப்பட்டுள்ளன. ஒரு செயலியில் உள்நுழையும்போது அங்குள்ளஅடுக்கு காலியாக உள்ளது. மற்றொரு செயலி அழைக்கப்படுவதற்கு முன்பு செயலியின் அளவுருக்களுடைய இந்த அடுக்கில் (இங்கே offsetஉம் நீளமும்) வெளித்தள்ளப்படுகின்றன (call $log ஐக் காண்க). எடுத்துக்காட்டாகஒரு செயலியானது ஒரு f32 வகையைத் தரும்போதும், செயலியை விட்டு வெளியேறும்போதும் ஒரு f32 மாறியானது அந்தஅடுக்கில் இருக்க வேண்டும் (ஆனால் இந்த எடுத்துக்காட்டில் அவ்வாறு இல்லை).

Wasm எனும் கோப்பை உருவாக்குதல்
WASM-எனும் உரையும் இணையதொகுப்பு எண்மி குறிமுறைவரிகளும் 1:1 எனும் விகிதத்தில்தொடர்புகளைக் கொண்டுள்ளன. இதன் பொருள் நாம் WASM- உரையை இருமகுறிமுறைவரிகளாகவும் ( அதற்கு நேர்மாறாகவும்) மாற்றலாம் என்பதாகும். நம்மிடம் ஏற்கனவே WASM- எனும்உரை உள்ளது, இப்போது நாம் ஒரு இருமகுறிமுறைவரிகளை உருவாக்க விரும்புகின்றோம் எனில். இந்த உருமாற்றத்தை இணையதொகுப்பின் ஒரு இரும கருவித்தொகுப்பு (WABT) மூலம் செய்ய முடியும். அந்த இணைப்பில் நிறுவுகை வழிமுறைகளைப் பின்பற்றி களஞ்சியத்தின் ஒரு நகலை(clone) உருவாக்கிடுக. இவ்வாறு நாம் கருவிகளின்தொகுப்பை உருவாக்கிய பிறகு, ஒரு பணியகத்தைத் திறந்து இதனை உள்ளிடுவதன் மூலம் WASM- எனும் உரையை இருமகுறிமுறைவரிகளாக மாற்றிடுக:
wat2wasm அனைவருக்கும் வணக்கம்.wat -o அனைவருக்கும் வணக்கம்.wasm
இதன் மூலம் இருமகுறிமுறைவரிகளாக WASM- எனும் உரைக்கு மாற்றலாம்:
wasm2wat அனைவருக்கும் வணக்கம்.wasm -o அனைவருக்கும் வணக்கம்_reverse.wat
ஒரு .wasm கோப்பில் இருந்து உருவாக்கப்பட்ட .wat கோப்பில் எந்த செயலி அல்லது அளவுரு பெயர்களும் இல்லை. இயல்பாக, இணையத்தொகுப்பில் செயலிகளையைும் அளவுருக்களையும் அவற்றின் குறிமுறை வரிகளுடன் இது அடையாளம் காட்டுகிறது.
Wasm கோப்பை தொகுத்தல்
தற்போது, இந்த இணையத்தொகுப்பானது ஜாவாஸ்கிரிப்டுடன் மட்டுமே இணைந்து செயல்படுகின்றது, எனவே .wasm கோப்பை பதிவேற்றவும் தொகுக்கவும் ஒரு செயலியின் உரைநிரலை எழுத வேண்டும். நம்முடைய இணையத்தொகுப்பு தொகுதியில் நாம் பதிவிறக்கம் செய்யும் செயலிகளையும் நாம் வரையறுக்க வேண்டும். அதற்காக ஒரு வெற்று உரை கோப்பை உருவாக்கி அதற்கு அனைவருக்கும் வணக்கம்.html என்றவாறு ஒரு பெயரிடுக, பின்னர் நமக்கு பிடித்த உரை திருத்தியைத் திறந்து அதில் இந்த குறிமுறைவரிகளைஒட்டிடுக:
<!DOCTYPE html>
<html>
<head>
<meta charset=”utf-8″>
<title>Simple template</title>
</head>
<body>
<script>
var memory = new WebAssembly.Memory({initial:1});
function consoleLogString(offset, length) {
var bytes = new Uint8Array(memory.buffer, offset, length);
var string = new TextDecoder(‘utf8’).decode(bytes);
console.log(string);
};
var importObject = {
console: {
log: consoleLogString
},
js : {
mem: memory
}
};
WebAssembly.instantiateStreaming(fetch(‘அனைவருக்கும் வணக்கம்.wasm’), importObject)
.then(obj => {
obj.instance.exports.அனைவருக்கும் வணக்கம்();
});
</script>
</body>
</html>
இந்த WebAssembly.Memory(…) எனும் வழிமுறையானது 64KB அளவிலான நினைவகத்தின் ஒரு பக்கத்தை வழங்குகிறது. consoleLogString எனும் செயலியானதுஅந்த நினைவக பக்கத்திலிருந்து நீளம் , offset ஆகியவற்றின் அடிப்படையில் ஒரு சரத்தை படிக்கின்றது. பதிவிறக்க பொருளின் ஒரு பகுதியாக இவ்விரண்டு பொருட்களும் நம்முடைய இணையத்தொகுப்பின் தொகுதிக்கு அனுப்பப்படுகின்றன. இந்த எடுத்துக்காட்டை இயக்குவதற்கு முன், இந்த கோப்பகத்திலிருந்து கோப்புகளை அணுக ஃபயர்பாக்ஸ் எனும் இணையஉலாவியை நாம் அனுமதிக்க வேண்டும்: அதன் முகவரியில் உள்ளமைவு, தனியுரிமை.ஆகியவற்றில் File_unique_origin ஐ true என அமைத்திடுக:
எச்சரிக்கை: இது நம்மை CVE-2019-11730 எனும் பாதுகாப்பு சிக்கலுக்கு உள்ளாக்கும்.
இப்போது, ஃபயர்பாக்ஸில் அனைவருக்கும் வணக்கம்.html எனும் கோப்பினைத்திறந்து, மேம்படுத்துநர் திரையைத் திறப்பதற்காக Ctrl + K ஆகிய விசைகளை சேர்த்துஅழுத்துக.

%d bloggers like this: