Өргөтгөсөн бодит байдлын вэб хөтөч: 9 алхам

2024 Зохиолч: John Day | [email protected]. Хамгийн сүүлд өөрчлөгдсөн: 2024-01-30 11:04

Өнөөдөр бид Андройд дээр Өргөтгөсөн бодит байдлын вэб хөтөч хийх болно.

Энэ санаа нь ExpressVPN надаас ивээн тэтгэсэн YouTube видео хийхийг хүссэнээс эхэлсэн юм. Энэ бол миний анхных учраас би тэдний бүтээгдэхүүнтэй холбоотой ямар нэгэн зүйл хийхийг хүсч байсан. Бараг тэр даруй би бодлоо: Өө, би зүгээр л өргөтгөсөн бодит вэб хөтөч хийх болно, ингэснээр бид вэб дээр AR дээр VPN үзэх боломжтой болно. Ийм хэцүү байж болохгүй, тийм үү? Буруу. Би энэ төслийг зарим шинэ зүйлийг сурахад ашиглахыг хүссэн учраас өөртөө хязгаарлалт тавьсан.

Нэгдүгээрт, би үүнийг Андройд болгохыг хүсч байсан, учир нь би үргэлж IOS -тэй зүйл хийдэг.

Хоёрдугаарт, би ямар ч төлбөртэй API ашиглахыг хүсээгүй, хүн бүр энэ төслийг татаж аваад онлайнаар ямар ч төлбөр төлөхгүйгээр ажиллуулахыг хүсч байсан. Тиймээс IBM Watson, Google API, Unity Asset дэлгүүрээс юу ч байхгүй болно.

ЭХЭЛЦГЭЭЕ!

Алхам 1: Эхлээд бүх зүйл

Миний ажилд орохыг хүссэн хамгийн эхний зүйл бол ярианы текст бичих сайн шийдэл байсан бөгөөд ингэснээр бид онлайн хайлтыг дуу хоолойгоороо хийх боломжтой болсон. Дуу хоолой бол гар хянах сайн шийдэлтэй болох хүртэл AR -тэй харилцах гайхалтай арга гэж би боддог. Андройд нь эх хэлээрээ текст бичих чадвартай гэдгийг би мэднэ, тиймээс Google -ийн хурдан хайлт нь Unity -ийн зарим залгаасыг олоход тусална.

Эв нэгдлийн үүднээс би энэ залгаас дээр анх ирсэн.

www.google.com/search?rlz=1C5CHFA_enUS816U…

Би үүнийг туршиж үзсэн бөгөөд энэ нь маш сайн ажилласан. Ганц асуудал бол та үүнийг ARCore -тэй ашиглах үед уугуул попап хайрцгийг үүсгэдэг бөгөөд Unity -ийн арын дэвсгэр шиг санагддаг бөгөөд та хянах чадвараа алдах болно.

Энэ нь төсөөлж байснаас бага байсан.

Алхам 2: Андройд дээр ажиллах текстийг унших

Тиймээс би уугуул попап хайрцгийг аваагүй, тийм ч их олж чадаагүй зарим залгаасуудыг хайж эхлэв, гэхдээ би энэ Android номын санг олж чадсан юм.

github.com/maxwellobi/Android-Speech-Recog…

Одоо би Андройд хөгжүүлэлтийн талаар юу ч мэдэхгүй байна, гэхдээ би өөрийгөө сорихыг хүсч байсан тул энэ номын санд зориулж гүүр код бичиж, Unity -д ашиглах Андройд залгаас болгон хувиргахыг хичээх болно гэж бодсон. бухимдах цаг хүртэл.

Тэгээд эцэст нь ажилласан …

Алхам 3: Сурсан зүйл

Тиймээс энэ процессын явцад нэгдмэл байдлын төлөө Android залгаасыг хэрхэн яаж хийхийг googling хийснээс шууд олж хараагүй хоёр зүйлийг олж мэдсэн юм.

Нэгдүгээрт, хэрэв таны залгаас ямар нэгэн сонирхолтой зүйл хийх гэж байгаа бол танд Андройд аппын контекстийг лавлах шаардлагатай болно. Та үүнийг Unity суулгацын class.jar файлыг Андройд төсөл дээрээ номын сан болгон нэмж оруулах замаар хийж болно. Тиймээс файлын төслийн бүтэц рүү ороод апп модулийн хамаарал табыг сонгоно уу. Энд нэмэх товчийг дарж jar файлыг нэмж болно. Unity бүтээх, тоглуулах хөдөлгүүр, android тоглуулагч, хувилбар, моно, хөгжүүлэлт, анги, эцэст нь class.jar руу очно уу. Хамрах хүрээг зөвхөн эмхэтгэхээр өөрчлөх. Одоо шинэ java файл дээр та дараах зүйлийг хийх боломжтой.

UnityPlayer.currentActivity.getApplicationContext ();

мөн энэ лавлагааг хэрэгтэй газартаа ашиглаарай.

Дараагийн хачирхалтай асуудал бол энэ дууны функцийг зөвхөн үндсэн урсгал дээр ажиллуулах боломжтой, эс тэгвээс танд алдаа гарах болно. Үүнийг Unity -д хийхийн тулд дээрх функц болон залгаасыг UI Thread дээр AndroidJavaRunnable хэлбэрээр ажиллуулахыг дээрх зураг шиг хэлэх ёстой.

Алхам 4: Тэмцэл

Энэ үед би Андройдын мэргэжилтэн гэж бодож байна.

Андройд хөгжүүлэлтийн ажилд онлайнаар өргөдөл гаргаж байна, би Android наалт, подволк захиалж байна. Амьдрал сайхан. Одоо би Unity дээр вэб хуудсыг хэрхэн яаж гаргах талаар олж мэдэхэд бэлэн байна. Бага зэрэг судалгаа хийсний дараа хүлээн зөвшөөрөгдсөн шийдэл бол Android WebView ашиглах явдал юм. Энэ бол Андройд аппликейшн дотор байгаа бүх зүйлийг вэб хөтөч дээр ачаалалгүйгээр ажиллуулах боломжийг олгодог Андройдын анги юм. Үндсэндээ энэ нь та хэрэглэгчдийг апп дээрээ байлгаж чадна. Бизнесийн анхны захиалга бол нээлттэй эх сурвалж болох эв нэгдлийн залгаасыг хэн нэгэн хийсэн эсэхийг шалгах явдал юм. Би эхлээд энэ залгаасыг туршиж үзээрэй:

github.com/gree/unity-webview

гэхдээ энэ нь зөвхөн WebView -ийг Unity GUI давхаргад харуулдаг тул энэ нь ажиллахгүй болно. Дараа нь би VR -д зориулсан энэ залгаасыг оллоо.

github.com/IanPhilips/UnityAndroidVRBrowse…

Энэ нь танд WebView -ийг бүтэцтэй, тэр ч байтугай харилцан үйлчлэх чадвартай болгох боломжийг олгодог бөгөөд үүнийг туршиж үзээд энэ нь миний бүх товшилтыг эв нэгдэлд саад болж байгааг олж мэдэх хүртэл энэ хариулт гэж бодож байсан.

Алхам 5: Зургийн самбар руу буцах

Би үүнд зориулж залгаасаа оруулахыг хичээх болно, учир нь надад вэбсайтын дүрсийг эв нэгдэл рүү илгээх нь л хэрэгтэй байна. Энэ талаар судалгаа хийж байхдаа би андроид даавууг битийн зураг дээр хадгалж, дараа нь-p.webp

Энэ нь эцэстээ ажилласан.

Одоо би вэбсайтаас дэлгэцийн зураг авах боломжтой болсон тул энэ нь arcore -тэй хэрхэн ажилладагийг харцгаая …

Тэгдэггүй.

Би хамгийн сүүлийн үеийн утас биш galaxy s7 ашиглаж байна гэсэн үг, гэхдээ энэ WebView нь бүхэл бүтэн програмыг хөлдөөж, ашиглах боломжгүй хэвээр байна. Энэ нь WebView болон ARCore хоёулаа үндсэн сэдвийг хэт их ачаалж байгаагаас болсон гэж би бодож байна, гэхдээ би сайн мэдэхгүй байна. Зургийн самбар руу буцах. Хэрэв бид энэ ажлыг хийхийг хүсч байвал хүнд даацын өргөлтийг ямар нэгэн төрлийн сервер рүү ачаалах болно. Гүүгл хийсний дараа та Node.js номын сантай WebShot нэртэй вэбсайтын дэлгэцийн зургийг Phantom JS ашигладаг бөгөөд энэ нь толгойгүй хөтөч юм.

Алхам 6: Эцэст нь бид хаа нэгтээ хүрч байна

Одоо би Node.js -ийг хэрхэн ашиглахыг олж мэдэх хэрэгтэй байна.

Та тодорхой портын дугаарыг сонсдог Node.js скрипт хийж болох бөгөөд энэ нь тухайн порт дээр цохиход зарим мэдээллийг буцааж өгөх боломжтой болно. Бид үүнийг 3000 порт дээр сонсдог сайн дэлхийн скриптийг бий болгох замаар туршиж үзэх боломжтой. Бид скриптийг директор руу cd хийж, зангилаа, дараа нь скриптийн нэрийг ашиглан ажиллуулж болно. Хэрэв бид IP хаяг руугаа ороод хөтөч дээрээ 3000 порт орвол энэ нь сайн уу, дэлхий рүү буцах болно. Одоо би зангилааг бага зэрэг ойлгосон болохоор үүнийг сервер дээрээ ажиллуулж, hawkhost.com вэбсайтуудаа байршуулж чадна. Би SSH -ийг сервер рүүгээ ороод node.js -ийн сайн сайтын хэдэн скриптүүдийг ажиллуулахыг оролдож байна, гэхдээ юу ч ажиллахгүй байна. Дахиад хэдэн цагийн турш үймээн самуун хийсний дараа миний хостинг сервер нь зөвхөн 3000, 12001 гэсэн хоёр порттой болохыг олж мэдэв.

Тиймээс эдгээр портууд болон миний хостинг серверүүдийг ашиглан би дэлхийн сайн жишээ ажиллаж чадна. Дараа нь би WebShot модулийг суулгаж, URL дамжуулж болох жижиг скрипт үүсгэвэл тэр вэб хаягийн вэбсайтын дүрсийг надад буцааж өгөх болно. Одоо би энэ зангилааны скриптийг эхлүүлж, Unity -аас http POST хүсэлтийг серверийнхээ IP болон портын дугаар руу илгээж болох бөгөөд энэ нь надад тухайн вэбсайтын дүрс болох байтын массивыг буцааж өгөх болно. Өөр нэг асуудал бол би терминалаа хаах үед процесс дуусч, сонсохоо болино. Би илүү их судалгаа хийж, үүрд нэртэй модулийг оллоо. NPM -ийг үүрд суулгадаг бөгөөд одоо би үүрд чиглүүлж, скриптийг үүрд эхлүүлж болох бөгөөд энэ нь намайг нэвтэрч дахин зогсоох хүртэл үргэлжлүүлэн ажиллах болно.

Алхам 7: Энэ нь ажилладаг

Агуу их. Гэхдээ энэ нь хангалттай дажгүй юм.

AR дээр вэб үзэх үнэ цэнийн талаар бодоход энэ нь зай нэмэгдсэнтэй холбоотой юм. Бид нэг дэлгэцээр хязгаарлагдахаа больсон тул хайлтын мөрөө урд минь дүрслэн харуулах боломжтой зүйлийг хийхийг хүсч байна. Тиймээс эхлээд хайлтын хуудсыг ачаалж, дараа нь тэр хуудсыг мөлхөж, хайлтын үр дүн бүрийг холбоос болгон гаргаж авсны дараа бид үүнийг үндсэн дэлгэцийнхээ дээр дүрс болгон ачаалж болно. Бид үүнийг Google -ийн үр дүнгийн эхний хуудсыг хуулж, үүрд тасралтгүй ажиллуулах өөр Node.js скриптээр хийж чадна. Үүнийг Google хайлтын API ашиглан илүү үр дүнтэй хийх боломжтой боловч энэ төслийн хоёр дахь дүрэм нь төлбөртэй API биш байсан тул бид одоохондоо үүнийг хийх болно. Бидэнд линк бүрийн зураг байгаа тул бид тэдгээрийг дарах, томруулах бүртээ том дэлгэцэн дээр ачаалж чадна, энд бид жижигхэн сайхан хөтөчтэй боллоо. Энэ нь бүрэн ажиллагаагүй боловч би үүнийг авах болно. За, хэрэв та энэ төслийг өөрөө ажиллуулахыг хүсвэл миний Github руу орж expressVPN төслийг татаж аваарай.

github.com/MatthewHallberg/ARBrowserExpres…

Алхам 8: Бүгдийг ажиллуулах

Үүнийг Unity дээр нээгээд бүх зүйлийг компьютер дээрээ локал хэлбэрээр ажиллуулцгаая. Эхлээд та машиныхаа IP хаягийг олох хэрэгтэй бөгөөд хэрэв та Mac дээр байгаа бол wifi тэмдгийг дарж IP хаягаа харуулна уу.

Эв нэгдэл рүү буцаж очоод хөтчийн хянагчийн скриптийг нээгээд IP хаягаа оруулаад санах ой руу хуулж аваарай. NodeScripts фолдерыг олоод ширээний компьютер дээр байрлуулаад фолдерыг нээгээд хоёр өргөтгөлийг.js болгон өөрчилнө үү. Скрипт бүрийг нээгээд IP хаягаа IP болгон өөрчилнө үү. Одоо терминалыг нээгээд бид зарим зүйлийг суулгах ёстой. Хэрэв танд байхгүй бол HomeBrew суулгаарай.

-исгэх зангилаа

-npm вэб зургийг суулгана уу

-npm суурилуулах хавтгай хавтан

-npm холбоосыг суулгах

-npm cheerio суулгана уу

Одоо бид cd скриптүүдийг хоёуланг нь nodescripts фолдерт эхлүүлж, getimage.js зангилаа хийж, дараа нь терминалын шинэ цонх нээж, getlinks.js зангилаа хийж терминал цонхыг ажиллуулж, редактор руу буцна уу. Хэрэв бид тоглохыг дарвал бүх зүйл сайн ажиллах ёстой. Бид мөн утсан дээрээ авахын тулд файл, тохиргоо хийх, бүтээх, ажиллуулах дээр очиж болно! Хэрэв та серверүүдийг зогсоохыг хүсвэл c хяналтыг дарж эсвэл терминалыг бүхэлд нь хаах q тушаалыг дарна уу.

ЭНЭ БАЙНА!