প্রতিক্রিয়া সহ বক্তৃতা স্বীকৃতি স্থাপনের জন্য একটি প্রাথমিক টিউটোরিয়াল

আমি সম্প্রতি একটি স্বপ্নের জার্নাল অ্যাপ তৈরি করেছি যা ব্যবহারকারীর স্বপ্ন রেকর্ড করতে ও সঞ্চয় করতে জাভাস্ক্রিপ্টের ওয়েব স্পিচ এপিআই-এর ভয়েস-টু-টেক্সট স্পিচ রিকগনিশন (ভয়েস-টু-টেক্সট স্পিচ রিকগনিশন) বৈশিষ্ট্যটি ব্যবহার করে (পূর্ণ স্বপ্নে নিজের ব্যবহারকারীর টাইপ না করে করতে হবে). ভয়েস টু টেক্সট প্রযুক্তি আশ্চর্যজনকভাবে সঠিক accurate কিছু ত্রুটি ... এটি কেবলমাত্র ক্রোম দ্বারা সম্পূর্ণরূপে সমর্থিত এবং কেবল আগ্রহ (এবং শ্রবণ বন্ধ না করা) অবধি কেবলমাত্র (প্রায় পাঁচ মিনিট পর্যন্ত) শোনে। অনেক অ্যাপ্লিকেশনের জন্য, পাঁচ মিনিট পর্যাপ্ত চেয়ে বেশি। সুতরাং এটি একবার দেখুন মূল্যবান।

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

  • বক্তৃতা স্বীকৃতি শুরু করুন / থামান (ভয়েস-টু-টেক্সট) এবং
  • ভয়েস কমান্ড ব্যবহার করে স্পিচ সনাক্তকরণ বন্ধ করুন।

নীচে টিউটোরিয়ালটির চূড়ান্ত পণ্যটির উদাহরণ দেওয়া আছে। নীল বোতামটি স্পিচ সনাক্তকরণ শুরু করে এবং থামিয়ে দেয় এবং মধ্যবর্তী / চূড়ান্ত প্রোটোকলগুলি ধূসর / কালোতে প্রদর্শিত হয়।

আসুন!

স্পিচরোকনশনের একটি নতুন উদাহরণ স্থাপন করুন।

আমি নীচের নথিতে অন্তর্ভুক্ত হওয়ায় প্রথমবার স্পিচআরকিগনিশন উদাহরণটি সেট আপ করার জন্য আমি খুব বেশি সময় ব্যয় করতে চাই না: https://developer.mozilla.org/en-US/docs/Web/API/SpeechR সনাক্তকরণ

যাইহোক, আমি এটি উল্লেখ করতে চাই যে আমরা ডিফল্টরূপে এটি মিথ্যাতে সেট করা হওয়ায় আমরা স্বীকৃতি.interimResults = সত্য সেট করছি। আপনি যদি মানটিকে সত্যে পরিবর্তন করেন, আপনি এই টিউটোরিয়ালটির উদ্দেশ্যে মধ্যবর্তী ফলাফল এবং চূড়ান্ত ফলাফল উভয়ই দেখতে পাবেন।

প্রাথমিক এবং নির্ধারিত মিনিটের মধ্যে পার্থক্য সম্পর্কে একটি নোট:

প্রাথমিক প্রতিলিপিগুলি হ'ল শব্দগুলি যা আপনার স্পিচ স্বীকৃতি সিস্টেম সেরা মিল খুঁজে পেতে অনুসন্ধান করে। উদাহরণস্বরূপ, আপনি যদি "ওয়েফলস" বলেছিলেন তবে আপনার বক্তৃতার স্বীকৃতি প্রাথমিক প্রক্রিয়াকরণটি প্রথমে "ভয়ানক" হতে পারে। তারপরে দ্বিতীয় বা তার পরে, এটি আরও ভাল ম্যাচটি খুঁজে পেলে এটি নিজেকে "ওয়াফলস" এ সংশোধন করতে পারে। আমার বক্তব্যটি হ'ল: আপনার যদি নির্ভুলতার প্রয়োজন হয় তবে অস্থায়ী নয়, নির্দিষ্ট প্রতিলিপি ব্যবহার করুন।

আমরা এই টিউটোরিয়ালে প্রাথমিক প্রতিলিপিগুলি অন্তর্ভুক্ত করছি কেবল বক্তৃতা স্বীকৃতি কীভাবে কাজ করে তা প্রদর্শনের জন্য। আপনি যদি প্রাথমিক ডেটাতে আগ্রহী না হন, আপনার বক্তৃতা সনাক্তকরণ উদাহরণটি সেট আপ করার সময় আপনি উপরের ডিরেক্টরি থেকে 5 লাইনটি সরিয়ে ফেলতে পারেন।

এখন আমরা আমাদের প্রথম লক্ষ্যে ডুব দিতে পারি!

একটি বোতামে চাপ দিয়ে বক্তৃতা সনাক্তকরণ শুরু করুন / থামান

আমরা কোনও কোড লেখার আগে আসুন আমাদের পদ্ধতির রূপরেখা তৈরি করি।

আমাদের প্রথমে একটি বোতাম উপাদান তৈরি করতে হবে। বোতামটির কার্যকারিতা প্রোগ্রাম করার জন্য আপনাকে একটি অনক্লিক ইভেন্ট হ্যান্ডলার লিখতে হবে যা প্রতিটি ক্লিকের নীচের মত যত্ন নেয়:

  • প্রথমবার আমরা বোতামটি ক্লিক করি, আমরা স্পিচ স্বীকৃতি শুরু করতে চাই।
  • দ্বিতীয়বার আমরা এটি ক্লিক করা শুনতে পারা উচিত।
  • আমরা যদি আরও ক্লিক করি তবে এই শুরু / স্টপ চক্রটি পুনরায় পুনরায় করা উচিত।

আমরা যদি উপরে বর্ণিত বিষয়গুলি লক্ষ্য করি তবে এটি স্পষ্ট হয়ে যায় যে আমাদের এই "শ্রবণশক্তি" (ইঙ্গিত, ইঙ্গিত) কোনওভাবে ট্র্যাক করতে হবে। তার অর্থ আমাদের কখন বক্তৃতা স্বীকৃতিটি শুরু / থামাতে হবে তার উপর নজর রাখতে হবে। আমরা কীভাবে এটি করতে পারি? হ্যাঁ হ্যাঁ, আমরা নীচে দেখানো হিসাবে আমাদের প্রতিক্রিয়া উপাদানটির স্থানীয় রাজ্যটি ব্যবহার করতে পারি। ডিফল্টরূপে, আমাদের উপাদান শুনতে দেয় না, তাই প্রাথমিক শ্রবণ অবস্থাটি ভুল।

this.state = {শ্রবণ: মিথ্যা}

আমাদের এখন বক্তৃতার স্বীকৃতি চালু এবং বন্ধ করার একটি উপায় প্রয়োজন। এটি হ'ল সত্য ও মিথ্যা শোনার মধ্য দিয়ে আমাদের নিজের অবস্থা টগল করার একটি উপায় প্রয়োজন। এটি করার জন্য, আমরা নীচের মত সাধারণ পদ্ধতি টগললিস্ট লিখতে পারি।

toggleListen () {this.setState = (ing শুনছি:! this.state.listening})}

এখন আমরা আমাদের অন ক্লিক হ্যান্ডলার লিখতে পারি। এটি আমরা চাই প্রবাহ:

। বোতামটি ক্লিক করুন

Listening টগল শ্রবণ (অর্থাত্ টগল তালিকাগুলি শুরু করুন)

Speech বক্তৃতা স্বীকৃতি শুরু / বন্ধ করুন যদি এটি.স্টেট.লাইটিং = সত্য / মিথ্যা

[The স্ট্যাটাসের উপর নির্ভর করে অন্য সব কিছু করুন, উদাঃ বি। বোতামের রঙটি পরিবর্তন করুন যখন এই.স্টেট.লাইটিং = সত্য]

সমস্ত স্পিচ রিকগনিশন লজিক হ্যান্ডল করার জন্য আমরা হ্যান্ডেললিস্টন নামে একটি পৃথক পদ্ধতি তৈরি করতে যাচ্ছি। প্রথমত, আমাদের অনক্লিক হ্যান্ডলারটি নীচের হিসাবে সংজ্ঞায়িত করা অর্থপূর্ণ:

onClick = {() => {this.toggleListen () this.handleListen ()}

তবে আপনি যদি এইভাবে অন ক্লিক হ্যান্ডলারটি সেট আপ করেন তবে খুব তাড়াতাড়ি আপনি দেখতে পাবেন যে আপনি ক্লিক করার সময় এটি সর্বদা শুরু হয় না! প্লেব্যাক শুরু হওয়ার আগে আপনাকে বেশ কয়েকবার ক্লিক করতে হতে পারে। কেন? ওয়েল, রিএ্যাক্টের সেটস্টেট পদ্ধতিটি সিঙ্ক্রোনাস হওয়ার গ্যারান্টিযুক্ত নয়। পটভূমিতে প্রতিক্রিয়া স্থিতি পরিবর্তন করা কখন সেরা when কখনও কখনও এটি তাত্ক্ষণিক, কখনও কখনও এটি না। সুতরাং আমাদের সমস্যা।

এই সমস্যাটি সমাধানের জন্য, আমরা কলব্যাকে আমাদের হ্যান্ডেললিস্টন পদ্ধতিটিকে সেটস্টেটে কল করি (নীচে দেখুন)।

টগললিসটেন () {this.setState (ing শুনছি:! this.state.listening}, this.handleListen)}

এটি এখনই মিলিয়ে নিতে আমাদের অনক্লিক হ্যান্ডলারটি সেট করতে পারি og টগললাইস্টেন। আমাদের কাঙ্ক্ষিত প্রবাহ (ক্লিক করুন → তালিকাগুলি → স্যুইচ তালিকাগুলি) এখন নিশ্চিত!

অনক্লিক = {this.toggleListen}

এই টিউটোরিয়ালটির বাকী অংশগুলি আমাদের হ্যান্ডেললিস্টন পদ্ধতিটি বিকাশে নিবেদিত। আমরা এ পর্যন্ত যা পেয়েছি তার একটি দ্রুত পুনরুদ্ধার এখানে দেওয়া হয়েছে (কয়েকটি সিএসএস সহ)। এই পদ্ধতিগুলি টাই করতে ভুলবেন না!

হ্যান্ডেললিস্টন পদ্ধতি:

আমরা নিম্নলিখিত কোডটি দিয়ে হ্যান্ডেললিস্ট শুরু করি, যা আমাদের বক্তৃতাকে স্বীকৃতি জানায় যখন এই.স্টেট.লাইস্টেনিং = সত্য হয় তখন শুনতে শুরু করে।

হ্যান্ডেললিস্টেন () {যদি (this.state.listening) تسلیم.স্টার্ট ()}

অন্তর্বর্তীকালীন এবং চূড়ান্ত প্রতিবেদনগুলি সংগ্রহ করতে, আমরা অনারসাল্ট নামে পরিচিত স্পিচ স্বীকৃতির জন্য অন্তর্নির্মিত ইভেন্ট হ্যান্ডলারটি ব্যবহার করি (নীচে ওভারভিউ দেখুন)। লুপের কোডটি ডকুমেন্টগুলি থেকে বিশেষভাবে আসে।

এখন আপনি বোতামটি হিট করার সময় আপনার বক্তৃতা দেওয়ার সাথে সাথে প্রাথমিক ও চূড়ান্ত প্রতিলিপিগুলি দেখতে পাবেন যা এই ডিভগুলি পূর্ণ করে!

আপনি যদি এটির সাথে কিছুটা খেলেন তবে আপনি দেখতে পাবেন যে বক্তৃতার স্বীকৃতিটি বক্তৃতায় যুক্তিসঙ্গত বিরতি দিয়ে নিজেরাই শেষ হয়। আমরা এটা চাই না। ব্যবহারকারীকে ভাবতে কয়েক সেকেন্ড সময় লাগলে কী হবে?

আমরা অন্যান্য অন্তর্নির্মিত ইভেন্ট শ্রোতাদের সাথে খেলে বক্তৃতা স্বীকৃতিটিকে "অবিচ্ছিন্ন" শ্রবণে চালিত করতে পারি। বিশেষত, আমরা সনাক্তকরণের মধ্যে আবার সনাক্ত করতে পারি recognition স্টার্টটি পুনরায় শোনার জন্য পুনরায় আরম্ভ করার জন্য এটি নিজেই থামার সিদ্ধান্ত নেয়।

বক্তৃতা স্বীকৃতি বন্ধ করতে, আমরা কেবলমাত্র অন্য বিবৃতিটি যুক্ত করি যা সনাক্ত করে .end.endate.listening = মিথ্যা হলে end

উপরের কোড সহ, যদি এই.স্টেট.লাস্টিং = সত্য তবে বক্তৃতা স্বীকৃতি শ্রবণ বন্ধ করার সিদ্ধান্ত নেয়, শ্রবণটি আবার হেরফের করা হবে (মুয়াহাহা!)। চেষ্টা করে দেখুন! জঘন্য জিনিস শোনায় যতক্ষণ না আপনি আবার সেই বোতামটি ক্লিক করেন ... বেশিরভাগ অংশের জন্য। দুর্ভাগ্যক্রমে এটি প্রায় 5 মিনিটের পরে কোনও এক সময় শেষ হবে। আপনার যদি সত্যিই 5 মিনিটেরও বেশি প্রয়োজন হয় তবে আপনি ইভেন্ট শ্রোতার সাথে খেলতে এবং স্থানীয় নিয়ন্ত্রণে অন্যান্য নিয়ন্ত্রিত ডেটা যুক্ত করে এই সমস্যাটি ঘিরে কাজ করতে সক্ষম হতে পারেন।

ভয়েস কমান্ড সহ স্পিচ সনাক্তকরণ বন্ধ করুন

আপনি যদি ক্লিকের পরিবর্তে ভয়েস কমান্ড ব্যবহার করে বক্তৃতা সনাক্তকরণ বন্ধ করতে চান? চলুন শুরু করুন যে আপনি ধারাবাহিকভাবে "থামুন" এবং "শ্রবণ" শব্দটি বলার পরে আপনি তাদের শুনতে বন্ধ করতে চান। আপনাকে যা করতে হবে তা হ'ল চূড়ান্ত প্রতিলিপিটি শব্দের অ্যারেতে ভাঙ্গা। এই অ্যারেতে শেষ দুটি শব্দ যদি "থামান" এবং "শ্রবণ" হয় তবে আপনি স্বীকৃতি ডেকেছিলেন st তারপরে আপনি চূড়ান্ত পাঠ্যটি তৈরি করতে অ্যারে থেকে "থামুন" এবং "শ্রবণ" শব্দটি সরিয়ে ফেলতে পারেন যাতে "শ্রবণ বন্ধ করুন" শব্দবন্ধটি নেই।

সামগ্রিকভাবে, একবার আপনি চূড়ান্ত প্রতিলিপিটি হয়ে গেলে এটি কেবল একটি অ্যারে ম্যানিপুলেশন গেম। ভয়েস কমান্ডের এই নির্দিষ্ট উদাহরণ সম্পর্কে আরও তথ্যের জন্য, শেষ বিভাগে "- কম্যান্ডস -" বিভাগটি দেখুন।

শেষের ফলাফল নোট: আমি বক্তৃতা স্বীকৃতি ক্রিয়াকলাপের উপর নজর রাখতে নিম্নলিখিত কনসোল.লগ বিবৃতি যুক্ত করেছি।

  • "শুনছি!" আপনি যখন বোতামটি ক্লিক করেন এবং শ্রবণ শুরু হয় তখন লগ হয়।
  • "... শুনুন চালিয়ে যান ..." লগ হয় যখন বক্তৃতা স্বীকৃতিটি বন্ধ হয়ে যাওয়ার পরে নিজেই আবার চালু করা হয়।
  • "একটি ক্লিক দিয়ে থামানো" লগ হয় যখন আপনি একটি ক্লিক দিয়ে স্পিচ স্বীকৃতি শেষ করেন।
  • "কমান্ড প্রতি স্টপড" লগ হয় যখন আপনি ভয়েস কমান্ড ব্যবহার করে স্পিচ সনাক্তকরণ বন্ধ করেন।

এই টিউটোরিয়ালের জন্য এটাই! এই সংমিশ্রণের সাথে (স্পিচ্-পরিচিতি + প্রতিক্রিয়া) আপনি আরও অনেক কিছু করতে পারেন, যেমন .g উদাহরণস্বরূপ, আপনি যখন শুনছেন তখন আপনার বোতামের রঙ পরিবর্তন করুন বা অন্য উপাদান সরবরাহ করুন।

আপনি যাই করুন না কেন, এটি দিয়ে মজা করুন!