একটি সাধারণ ওয়েবসাইট তৈরি করুন যা চিত্রগুলিকে শ্রেণীবদ্ধ করে

1. আপনি শুরু করার আগে

এই কোডল্যাবে, আপনি REST এবং gRPC এর সাথে TensorFlow সার্ভিং ব্যবহার করে একটি ওয়েবসাইট থেকে কীভাবে একটি চিত্র-শ্রেণীবিভাগের অনুমান চালাতে হয় তা শিখবেন।

পূর্বশর্ত

• ওয়েব ডেভেলপমেন্টের প্রাথমিক জ্ঞান, যেমন এইচটিএমএল এবং জাভাস্ক্রিপ্ট
• টেনসরফ্লো সহ মেশিন লার্নিং এর প্রাথমিক জ্ঞান, যেমন প্রশিক্ষণ এবং স্থাপনা
• টার্মিনাল এবং ডকার সম্পর্কে প্রাথমিক জ্ঞান

আপনি কি শিখবেন

• TensorFlow Hub-এ কীভাবে পূর্বপ্রশিক্ষিত চিত্র-শ্রেণীবিভাগের মডেলগুলি খুঁজে পাওয়া যায়।
• টেনসরফ্লো সার্ভিং (REST এবং gRPC) এর মাধ্যমে ডাউনলোড করা ইমেজ-শ্রেণিকরণ মডেলের সাথে কীভাবে একটি সাধারণ ওয়েবসাইট তৈরি করা যায় এবং ভবিষ্যদ্বাণী করা যায়।
• কিভাবে UI এ সনাক্তকরণ ফলাফল রেন্ডার করবেন।

আপনি কি প্রয়োজন হবে

• ডকার
• গুগল ক্রম
• ক্রোমের জন্য ওয়েব সার্ভার
• Node.js এবং NPM
• বাশ
• প্রোটোকল বাফার কম্পাইলার (আপনি নিজের দ্বারা gRPC স্টাব পুনরায় তৈরি করতে চাইলে শুধুমাত্র প্রয়োজন)
• gRPC-ওয়েব কোড জেনারেটর প্লাগইন (আপনি নিজে থেকে gRPC স্টাব পুনরায় জেনারেট করতে চাইলে শুধুমাত্র প্রয়োজন)

2. সেট আপ করুন

এই কোডল্যাবের জন্য কোড ডাউনলোড করতে:

1. এই GitHub সংগ্রহস্থলে নেভিগেট করুন।
2. এই কোডল্যাবের জন্য সমস্ত কোড ডাউনলোড করতে কোড > জিপ ডাউনলোড করুন ক্লিক করুন।

3. আপনার প্রয়োজনীয় সমস্ত সংস্থান সহ একটি codelabs রুট ফোল্ডার আনপ্যাক করতে ডাউনলোড করা জিপ ফাইলটিকে আনজিপ করুন৷

এই কোডল্যাবের জন্য, আপনার শুধুমাত্র সংগ্রহস্থলের TFServing/ImageClassificationWeb সাবডিরেক্টরিতে ফাইল দরকার, যেখানে দুটি ফোল্ডার রয়েছে:

• starter ফোল্ডারে স্টার্টার কোড থাকে যা আপনি এই কোডল্যাবের জন্য তৈরি করেন।
• finished ফোল্ডারে সমাপ্ত নমুনা অ্যাপ্লিকেশনের জন্য সম্পূর্ণ কোড রয়েছে।

3. নির্ভরতা ইনস্টল করুন

নির্ভরতা ইনস্টল করতে:

• আপনার টার্মিনালে, starter ফোল্ডারে নেভিগেট করুন এবং তারপর প্রয়োজনীয় NPM প্যাকেজগুলি ইনস্টল করুন:

npm install

4. স্টার্টার ওয়েবসাইট চালান

TFServing/ImageClassificationWeb/starter/dist/index.html ফাইলটি লোড করতে Chrome এর জন্য ওয়েব সার্ভার ব্যবহার করুন:

1. Chrome এর ঠিকানা বারে Chrome://apps/ লিখুন এবং তারপরে অ্যাপ তালিকায় Chrome এর জন্য ওয়েব সার্ভার খুঁজুন।
2. ক্রোমের জন্য ওয়েব সার্ভার চালু করুন এবং তারপরে TFServing/ImageClassificationWeb/starter/dist/ ফোল্ডারটি বেছে নিন।
3. এটি সক্রিয় করতে ওয়েব সার্ভার টগল ক্লিক করুন এবং তারপর আপনার ব্রাউজারে http://localhost:8887/ নেভিগেট করুন।

দ্রষ্টব্য: পোর্ট নম্বরটি 8000 বা 8080 এ পরিবর্তন করবেন না কারণ আপনার পরে এই পোর্টগুলির প্রয়োজন হবে৷ যতক্ষণ না আপনি এই কোডল্যাবটি দিয়ে শেষ করছেন ততক্ষণ ওয়েব সার্ভারটি বন্ধ করবেন না।

চালান এবং ওয়েবসাইট অন্বেষণ

আপনি এখন ওয়েবসাইট দেখতে হবে. UIটি বেশ সহজবোধ্য: একটি বিড়ালের ছবি রয়েছে যাতে আপনি শ্রেণীবদ্ধ করতে চান এবং ব্যবহারকারী REST বা gRPC এর সাথে ব্যাকএন্ডে ডেটা পাঠাতে পারে। ব্যাকএন্ড ইমেজে ইমেজ ক্লাসিফিকেশন সঞ্চালন করে এবং শ্রেণীবিভাগের ফলাফল ওয়েবসাইটে ফেরত দেয়, যা ফলাফল প্রদর্শন করে।

আপনি যদি Classify এ ক্লিক করেন, তাহলে কিছুই হবে না কারণ এটি এখনও ব্যাকএন্ডের সাথে যোগাযোগ করতে পারে না।

5. TensorFlow সার্ভিং সহ একটি চিত্র-শ্রেণীবিভাগ মডেল স্থাপন করুন

দ্রষ্টব্য: TensorFlow সার্ভিং-এ অনুরোধ পাঠানোর পরিবর্তে TensorFlow Lite বা ML Kit-এর মাধ্যমে সম্পূর্ণরূপে ডিভাইসে ইমেজ শ্রেণীবিভাগ করাও সম্ভব। আরও তথ্যের জন্য, মোবাইল ইমেজ ক্লাসিফিকেশন পাথওয়ে দিয়ে শুরু করুন দেখুন।

ইমেজ শ্রেণীবিভাগ একটি খুব সাধারণ ML টাস্ক যা ইমেজের প্রাথমিক বিষয়বস্তুর উপর ভিত্তি করে একটি ইমেজকে পূর্বনির্ধারিত শ্রেণীতে শ্রেণীবদ্ধ করে। এখানে ফুলের শ্রেণীবিভাগের একটি উদাহরণ রয়েছে:

TensorFlow Hub- এ বেশ কয়েকটি পূর্বপ্রশিক্ষিত চিত্র-শ্রেণীবিভাগ মডেল রয়েছে। আপনি এই কোডল্যাবের জন্য একটি জনপ্রিয় ইনসেপশন v3 মডেল ব্যবহার করেন।

টেনসরফ্লো সার্ভিংয়ের সাথে চিত্র-শ্রেণীবিভাগ মডেল স্থাপন করতে:

1. ইনসেপশন v3 মডেল ফাইলটি ডাউনলোড করুন।
2. ডাউনলোড করা .tar.gz ফাইলটিকে ডিকম্প্রেশন টুল দিয়ে আনকম্প্রেস করুন, যেমন 7-জিপ।
3. একটি inception_v3 ফোল্ডার তৈরি করুন এবং তারপরে এটির ভিতরে একটি 123 সাবফোল্ডার তৈরি করুন।
4. এক্সট্র্যাক্ট করা variables ফোল্ডার এবং saved_model.pb ফাইলটি 123 সাবফোল্ডারে রাখুন।

আপনি SavedModel inception_v3 হিসাবে উল্লেখ করতে পারেন। 123 একটি উদাহরণ সংস্করণ নম্বর। আপনি যদি চান, আপনি অন্য নম্বর চয়ন করতে পারেন.

ফোল্ডার গঠন এই ছবির মত দেখতে হবে:

TensorFlow পরিবেশন শুরু করুন

• আপনার টার্মিনালে, ডকারের সাথে টেনসরফ্লো সার্ভিং শুরু করুন, তবে আপনার কম্পিউটারে inception_v3 ফোল্ডারের পরম পাথ দিয়ে PATH/TO/SAVEDMODEL inception_v3 করুন।

docker pull tensorflow/serving

docker run -it --rm -p 8500:8500 -p 8501:8501 -v "PATH/TO/SAVEDMODEL:/models/inception" -e MODEL_NAME=inception tensorflow/serving

ডকার স্বয়ংক্রিয়ভাবে টেনসরফ্লো সার্ভিং ইমেজটি প্রথমে ডাউনলোড করে, যা এক মিনিট সময় নেয়। এর পরে, টেনসরফ্লো পরিবেশন শুরু করা উচিত। লগটি এই কোড স্নিপেটের মতো হওয়া উচিত:

2022-02-25 06:01:12.513231: I external/org_tensorflow/tensorflow/cc/saved_model/loader.cc:206] Restoring SavedModel bundle.
2022-02-25 06:01:12.585012: I external/org_tensorflow/tensorflow/core/platform/profile_utils/cpu_utils.cc:114] CPU Frequency: 3000000000 Hz
2022-02-25 06:01:13.395083: I external/org_tensorflow/tensorflow/cc/saved_model/loader.cc:190] Running initialization op on SavedModel bundle at path: /models/inception/123
2022-02-25 06:01:13.837562: I external/org_tensorflow/tensorflow/cc/saved_model/loader.cc:277] SavedModel load for tags { serve }; Status: success: OK. Took 1928700 microseconds.
2022-02-25 06:01:13.877848: I tensorflow_serving/servables/tensorflow/saved_model_warmup_util.cc:59] No warmup data file found at /models/inception/123/assets.extra/tf_serving_warmup_requests
2022-02-25 06:01:13.929844: I tensorflow_serving/core/loader_harness.cc:87] Successfully loaded servable version {name: inception version: 123}
2022-02-25 06:01:13.985848: I tensorflow_serving/model_servers/server_core.cc:486] Finished adding/updating models
2022-02-25 06:01:13.985987: I tensorflow_serving/model_servers/server.cc:367] Profiler service is enabled
2022-02-25 06:01:13.988994: I tensorflow_serving/model_servers/server.cc:393] Running gRPC ModelServer at 0.0.0.0:8500 ...
[warn] getaddrinfo: address family for nodename not supported
2022-02-25 06:01:14.033872: I tensorflow_serving/model_servers/server.cc:414] Exporting HTTP/REST API at:localhost:8501 ...
[evhttp_server.cc : 245] NET_LOG: Entering the event loop ...

দ্রষ্টব্য: আপনি টেনসরফ্লো সার্ভিং ডকার ইমেজ শুরু করার পরে, আপনি ইনপুট এবং আউটপুট টেনসরগুলির বিশদ পরিদর্শন করতে http://localhost:8501/v1/models/<MODEL_NAME>/metadata- এ যেতে পারেন৷ এই কোডল্যাবে, inception দিয়ে <MODEL_NAME> প্রতিস্থাপন করুন।

6. দূত প্রক্সি সেট আপ করুন

বর্তমানে টেনসরফ্লো সার্ভিং Access-Control-Allow-Origin হেডার সেট করে না, তাই নিরাপত্তার কারণে ব্রাউজার ফ্রন্টএন্ড জাভাস্ক্রিপ্ট থেকে টেনসরফ্লো সার্ভিংয়ের অনুরোধ ব্লক করে। এটিকে ঘিরে কাজ করার জন্য, জাভাস্ক্রিপ্ট থেকে টেনসরফ্লো সার্ভিং ব্যাকএন্ডে অনুরোধ প্রক্সি করার জন্য আপনাকে একটি প্রক্সি ব্যবহার করতে হবে, যেমন Envoy ।

দ্রষ্টব্য: প্রক্সির ব্যবহার প্রোডাকশন সিস্টেমে সার্ভারের ক্লাস্টারের ভারসাম্য বজায় রাখার জন্য একটি আদর্শ অনুশীলন। এনভয় কনফিগারেশন envoy-custom.yaml ফাইলে, পোর্ট 8000-এর REST অনুরোধগুলি 8501 পোর্টে প্রক্সি করা হয় এবং 8080 পোর্টে gRPC অনুরোধগুলি 8500 পোর্টে প্রক্সি করা হয়।

দূত শুরু করুন

• আপনার টার্মিনালে, এনভয় ইমেজটি ডাউনলোড করুন এবং ডকার দিয়ে এনভয় শুরু করুন, কিন্তু starter ফোল্ডারে envoy-custom.yaml ফাইলের পরম পাথ দিয়ে PATH/TO/ENVOY-CUSTOM.YAML স্থানধারকটিকে প্রতিস্থাপন করুন।

docker pull envoyproxy/envoy-dev:fd3e8370ddb7a96634c192d1461516e6de1d1797

docker run --add-host host.docker.internal:host-gateway --rm -it -p 9901:9901 -p 8000:8000 -p 8080:8080 -v PATH/TO/ENVOY-CUSTOM.YAML:/envoy-custom.yaml envoyproxy/envoy-dev:fd3e8370ddb7a96634c192d1461516e6de1d1797 -c /envoy-custom.yaml

ডকার স্বয়ংক্রিয়ভাবে প্রথমে এনভয় ইমেজ ডাউনলোড করে। পরে, দূত শুরু করা উচিত। লগটি এই কোড স্নিপেটের মতো হওয়া উচিত:

[2022-03-02 07:51:48.563][1][info][main] [source/server/server.cc:436]   response trailer map: 152 bytes: grpc-message,grpc-status
[2022-03-02 07:51:48.681][1][info][main] [source/server/server.cc:772] runtime: {}
[2022-03-02 07:51:48.682][1][info][admin] [source/server/admin/admin.cc:134] admin address: 0.0.0.0:9901
[2022-03-02 07:51:48.683][1][info][config] [source/server/configuration_impl.cc:127] loading tracing configuration
[2022-03-02 07:51:48.683][1][info][config] [source/server/configuration_impl.cc:87] loading 0 static secret(s)
[2022-03-02 07:51:48.683][1][info][config] [source/server/configuration_impl.cc:93] loading 2 cluster(s)
[2022-03-02 07:51:48.687][1][info][config] [source/server/configuration_impl.cc:97] loading 2 listener(s)
[2022-03-02 07:51:48.694][1][info][config] [source/server/configuration_impl.cc:109] loading stats configuration
[2022-03-02 07:51:48.696][1][info][main] [source/server/server.cc:868] starting main dispatch loop
[2022-03-02 07:51:48.881][1][info][runtime] [source/common/runtime/runtime_impl.cc:446] RTDS has finished initialization
[2022-03-02 07:51:48.881][1][info][upstream] [source/common/upstream/cluster_manager_impl.cc:207] cm init: all clusters initialized
[2022-03-02 07:51:48.881][1][info][main] [source/server/server.cc:849] all clusters initialized. initializing init manager
[2022-03-02 07:51:48.881][1][info][config] [source/server/listener_manager_impl.cc:784] all dependencies initialized. starting workers
[2022-03-02 07:51:48.902][1][warning][main] [source/server/server.cc:747] there is no configured limit to the number of allowed active connections. Set a limit via the runtime key overload.global_downstream_max_connections

7. REST এর মাধ্যমে TensorFlow-এর সাথে ওয়েবসাইটটি সংযুক্ত করুন

ব্যাকএন্ড এখন প্রস্তুত তাই আপনি টেনসরফ্লো সার্ভিং-এ ক্লায়েন্টের অনুরোধ পাঠাতে পারেন ছবি শ্রেণীবদ্ধ করতে। TensorFlow সার্ভিং-এ অনুরোধ পাঠানোর দুটি উপায় আছে:

• বিশ্রাম
• gRPC

অনুরোধ পাঠান এবং REST এর মাধ্যমে প্রতিক্রিয়া পান

REST এর মাধ্যমে অনুরোধ পাঠানো এবং গ্রহণ করার জন্য তিনটি সহজ ধাপ রয়েছে:

1. REST অনুরোধ তৈরি করুন।
2. TensorFlow সার্ভিং-এ REST অনুরোধ পাঠান।
3. REST প্রতিক্রিয়া থেকে পূর্বাভাসিত ফলাফল বের করুন এবং ফলাফল প্রদর্শন করুন।

আপনি src/index.js ফাইলে এই পদক্ষেপগুলি অর্জন করেন।

REST অনুরোধ তৈরি করুন

এই মুহূর্তে, classify_img() ফাংশন TensorFlow সার্ভিং-এ REST অনুরোধ পাঠায় না। প্রথমে একটি REST অনুরোধ তৈরি করতে আপনাকে এই REST শাখাটি বাস্তবায়ন করতে হবে:

if (radioButtons[0].checked) {
    console.log('Using REST');
    // TODO: Add code to send a REST request to TensorFlow Serving.

} 

TensorFlow সার্ভিং একটি POST অনুরোধ আশা করে যাতে আপনি যে ইনসেপশন v3 মডেলটি ব্যবহার করেন তার জন্য ইমেজ টেনসর থাকে, তাই আপনাকে ছবির প্রতিটি পিক্সেল থেকে একটি অ্যারেতে আরজিবি মান বের করতে হবে এবং তারপর অ্যারেটিকে JSON-এ মুড়ে দিতে হবে, যা পেলোড। অনুরোধের

• REST শাখায় এই কোড যোগ করুন:

//Create the REST request.
let imgTensor = new Array();
let pixelArray = new Array();
context.drawImage(img, 0, 0);
for(let i=0; i<inputImgHeight; i++) {
    pixelArray[i] = new Array();
    for (let j=0; j<inputImgWidth; j++) {
        pixelArray[i][j] = new Array();
        pixelArray[i][j].push(context.getImageData(i, j, 1, 1).data[0]/255); 
        pixelArray[i][j].push(context.getImageData(i, j, 1, 1).data[1]/255); 
        pixelArray[i][j].push(context.getImageData(i, j, 1, 1).data[2]/255); 
    }
}
imgTensor.push(pixelArray);

const RESTURL = 'http://localhost:8000/v1/models/inception:predict';        
let xhr = new XMLHttpRequest();
xhr.open('POST', RESTURL);
xhr.setRequestHeader('Content-Type', 'application/json;charset=utf-8;');
let data = JSON.stringify({
    instances: imgTensor
});    
xhr.onload = () => {

}
xhr.onerror = () => {
    console.log('REST request error');
}

TensorFlow সার্ভিং-এ REST অনুরোধ পাঠান

এখন আপনি অনুরোধ পাঠাতে পারেন.

• REST শাখায় উপরের কোডের ঠিক পরে এই কোডটি যোগ করুন:

// Send the REST request.
xhr.send(data);

TensorFlow সার্ভিং থেকে REST প্রতিক্রিয়া প্রক্রিয়া করুন

ইনসেপশন v3 মডেলটি সম্ভাব্যতার একটি অ্যারে প্রদান করে যে চিত্রটি পূর্বনির্ধারিত বিভাগের অন্তর্গত। ভবিষ্যদ্বাণী সফল হলে, আপনার UI-তে সবচেয়ে সম্ভাব্য বিভাগটি আউটপুট করা উচিত।

আপনি প্রতিক্রিয়া পরিচালনা করতে onload() শ্রোতা প্রয়োগ করুন।

xhr.onload = () => {

}

• onload() শ্রোতা এই কোড যোগ করুন:

// Process the REST response.
const response = JSON.parse(xhr.responseText);
const maxIndex = argmax(response['predictions'][0])
document.getElementById('category').textContent = 'Predicted category: ' + maxIndex;

এখন শ্রোতা প্রতিক্রিয়া থেকে ভবিষ্যদ্বাণীকৃত সম্ভাব্যতা বের করে, বস্তুর সবচেয়ে সম্ভাব্য বিভাগ সনাক্ত করে এবং UI-তে ফলাফল প্রদর্শন করে।

চালাও এটা

1. আপনার টার্মিনালে, starter ফোল্ডারে যান এবং সমস্ত জাভাস্ক্রিপ্ট ফাইলকে একটি একক ফাইলে বান্ডিল করতে ওয়েবপ্যাক ব্যবহার করুন যা আপনি dist/index.html ফাইলে এম্বেড করতে পারেন:

npm install -g npx
npm install --save-dev webpack
npx webpack

2. আপনার ব্রাউজারে http://localhost:8887/ রিফ্রেশ করুন এবং তারপরে REST > ক্লাসিফায় ক্লিক করুন।

ওয়েবসাইটটি ভবিষ্যদ্বাণীকৃত বিভাগ হিসাবে 286 প্রদর্শন করে, যা ইমেজনেট ডেটাসেটে Egyptian Cat লেবেলে মানচিত্র করে।

8. GRPC-এর মাধ্যমে TensorFlow সার্ভিংয়ের সাথে ওয়েবসাইটটিকে সংযুক্ত করুন

REST ছাড়াও, TensorFlow সার্ভিং এছাড়াও gRPC সমর্থন করে।

gRPC হল একটি আধুনিক, ওপেন সোর্স, হাই-পারফরম্যান্স রিমোট প্রসিডিউর কল (RPC) ফ্রেমওয়ার্ক যা যেকোনো পরিবেশে চলতে পারে। এটি লোড ব্যালেন্সিং, ট্রেসিং, হেলথ চেকিং এবং প্রমাণীকরণের জন্য প্লাগেবল সাপোর্ট সহ ডেটা সেন্টারে এবং জুড়ে পরিষেবাগুলিকে দক্ষতার সাথে সংযুক্ত করতে পারে। এটা দেখা গেছে যে জিআরপিসি অনুশীলনে REST এর চেয়ে বেশি কার্যকরী।

অনুরোধ পাঠান এবং gRPC এর সাথে প্রতিক্রিয়া পান

চারটি সহজ ধাপ রয়েছে:

1. ঐচ্ছিক: gRPC ক্লায়েন্ট স্টাব কোড তৈরি করুন।
2. জিআরপিসি অনুরোধ তৈরি করুন।
3. টেনসরফ্লো সার্ভিং-এ gRPC অনুরোধ পাঠান।
4. gRPC প্রতিক্রিয়া থেকে পূর্বাভাসিত ফলাফল বের করুন এবং এটি UI এ প্রদর্শন করুন।

আপনি src/index.js ফাইলে এই ধাপগুলি সম্পূর্ণ করুন।

ঐচ্ছিক: gRPC ক্লায়েন্ট স্টাব কোড তৈরি করুন

দ্রষ্টব্য: এই পদক্ষেপটি ঐচ্ছিক কারণ স্টার্টার কোডে ইতিমধ্যেই gRPC ক্লায়েন্ট স্টাব কোড অন্তর্ভুক্ত রয়েছে৷ যাইহোক, আপনি যদি নিজের দ্বারা ক্লায়েন্ট স্টাব তৈরি করতে চান তবে প্রক্রিয়াটি বোঝার জন্য এটির মাধ্যমে পড়া উপকারী। নিশ্চিত করুন যে আপনি সঠিকভাবে প্রোটোকল বাফার কম্পাইলার এবং gRPC জাভাস্ক্রিপ্ট কোড জেনারেটর প্লাগইন সেট আপ করেছেন যদি আপনি নিজে চেষ্টা করেন।

TensorFlow সার্ভিংয়ের সাথে gRPC ব্যবহার করতে, আপনাকে gRPC ওয়ার্কফ্লো অনুসরণ করতে হবে। বিস্তারিত সম্পর্কে আরও জানতে, gRPC ডকুমেন্টেশন দেখুন।

TensorFlow সার্ভিং এবং TensorFlow আপনার জন্য .proto ফাইলগুলিকে সংজ্ঞায়িত করে৷ TensorFlow এবং TensorFlow সার্ভিং 2.8 অনুযায়ী, এই .proto ফাইলগুলি প্রয়োজন:

tensorflow/core/example/example.proto
tensorflow/core/example/feature.proto
tensorflow/core/protobuf/struct.proto
tensorflow/core/protobuf/saved_object_graph.proto
tensorflow/core/protobuf/saver.proto
tensorflow/core/protobuf/trackable_object_graph.proto
tensorflow/core/protobuf/meta_graph.proto
tensorflow/core/framework/node_def.proto
tensorflow/core/framework/attr_value.proto
tensorflow/core/framework/function.proto
tensorflow/core/framework/types.proto
tensorflow/core/framework/tensor_shape.proto
tensorflow/core/framework/full_type.proto
tensorflow/core/framework/versions.proto
tensorflow/core/framework/op_def.proto
tensorflow/core/framework/graph.proto
tensorflow/core/framework/tensor.proto
tensorflow/core/framework/resource_handle.proto
tensorflow/core/framework/variable.proto

tensorflow_serving/apis/inference.proto
tensorflow_serving/apis/classification.proto
tensorflow_serving/apis/predict.proto
tensorflow_serving/apis/regression.proto
tensorflow_serving/apis/get_model_metadata.proto
tensorflow_serving/apis/input.proto
tensorflow_serving/apis/prediction_service.proto
tensorflow_serving/apis/model.proto

• আপনার টার্মিনালে, starter/src/proto/ ফোল্ডারে নেভিগেট করুন এবং স্টাব তৈরি করুন:

bash generate_grpc_stub_js.sh

জিআরপিসি অনুরোধ তৈরি করুন

REST অনুরোধের মতো, আপনি gRPC শাখায় gRPC অনুরোধ তৈরি করেন .

if (connectionMode[picker.selectedRow(inComponent: 0)] == "REST") {

}
else {
    print("Using gRPC")
    // TODO: Add code to send a gRPC request to TensorFlow Serving.
    
}

• এই কোডটি gRPC শাখায় যোগ করুন:

// Create the gRPC request.
const PredictModule = require('./proto/generated/tensorflow_serving/apis/predict_pb.js');
const PredictionServiceClientModule = require('./proto/generated/tensorflow_serving/apis/prediction_service_grpc_web_pb.js');
const ModelModule = require('./proto/generated/tensorflow_serving/apis/model_pb.js');
const TensorModule = require('./proto/generated/tensorflow/core/framework/tensor_pb.js');

const GPRCURL = 'http://localhost:8080';
const stub = new PredictionServiceClientModule.PredictionServiceClient(GPRCURL);

const modelSpec = new ModelModule.ModelSpec();
modelSpec.setName('inception');

const tensorProto = new TensorModule.TensorProto();
const tensorShapeProto = new TensorModule.TensorShapeProto();

const batchDim = (new TensorModule.TensorShapeProto.Dim()).setSize(1);
const heightDim = (new TensorModule.TensorShapeProto.Dim()).setSize(inputImgHeight);
const widthDim = (new TensorModule.TensorShapeProto.Dim()).setSize(inputImgWidth);
const channelDim = (new TensorModule.TensorShapeProto.Dim()).setSize(3);

tensorShapeProto.setDimList([batchDim, heightDim, widthDim, channelDim]);

tensorProto.setDtype(proto.tensorflow.DataType.DT_FLOAT);
tensorProto.setTensorShape(tensorShapeProto);
context.drawImage(img, 0, 0);
for(let i=0; i<inputImgHeight; i++) {
    for (let j=0; j<inputImgWidth; j++) {
        tensorProto.addFloatVal(context.getImageData(i, j, 1, 1).data[0]/255); 
        tensorProto.addFloatVal(context.getImageData(i, j, 1, 1).data[1]/255); 
        tensorProto.addFloatVal(context.getImageData(i, j, 1, 1).data[2]/255); 
    }
}

const predictionServiceRequest = new PredictModule.PredictRequest();
predictionServiceRequest.setModelSpec(modelSpec);
predictionServiceRequest.getInputsMap().set('inputs', tensorProto);

টেনসরফ্লো সার্ভিং-এ gRPC অনুরোধ পাঠান

এখন আপনি অনুরোধ পাঠাতে পারেন.

• পূর্ববর্তী কোড স্নিপেটে gRPC শাখায় কোডের পরে অবিলম্বে এই কোডটি যোগ করুন:

// Send the gRPC request.
stub.predict(predictionServiceRequest, {}, function(err, response) {
    // TODO: Add code to process the response.
});

TensorFlow সার্ভিং থেকে gRPC প্রতিক্রিয়া প্রক্রিয়া করুন

শেষ অবধি, আপনি প্রতিক্রিয়া পরিচালনা করতে উপরের কলব্যাক ফাংশনটি বাস্তবায়ন করেন।

• পূর্ববর্তী কোড স্নিপেটে ফাংশন বডিতে এই কোডটি যুক্ত করুন:

// Process the gRPC response.
if (err) {
    console.log(err.code);
    console.log(err.message);
} 
else {
    const maxIndex = argmax(response.getOutputsMap().get('logits').getFloatValList());
    document.getElementById('category').textContent = 'Predicted category: ' + maxIndex;
}

এখন শ্রোতা প্রতিক্রিয়া থেকে ভবিষ্যদ্বাণীকৃত সম্ভাব্যতা বের করে, বস্তুর সবচেয়ে সম্ভাব্য বিভাগ সনাক্ত করে এবং UI-তে ফলাফল প্রদর্শন করে।

চালাও এটা

1. আপনার টার্মিনালে, সমস্ত জাভাস্ক্রিপ্ট ফাইলকে একটি একক ফাইলে বান্ডিল করতে ওয়েবপ্যাক ব্যবহার করুন যা আপনি index.html ফাইলে এম্বেড করতে পারেন:

npx webpack

2. আপনার ব্রাউজারে http://localhost:8887/ রিফ্রেশ করুন।
3. gRPC > ক্লাসিফায় ক্লিক করুন।

ওয়েবসাইটটি 286 -এর পূর্বাভাসিত বিভাগ প্রদর্শন করে, যা ইমেজনেট ডেটাসেটে Egyptian Cat লেবেলে মানচিত্র করে।

9. অভিনন্দন

আপনি আপনার ওয়েবসাইটে ইমেজ শ্রেণীবিভাগের ক্ষমতা যোগ করতে TensorFlow সার্ভিং ব্যবহার করেছেন!

আরও জানুন

• টেনসরফ্লো হোম পেজ পরিবেশন করছে
• gRPC হোম পেজ
• টেনসরফ্লো মৌলিক ছবির শ্রেণীবিভাগ