Web開発ミニプロジェクト開発ログ-OCularタスクVRアプリストアが一望

プロジェクトの概要

ゲーム好きなら一度はニンテンドースイッチを聞いたことがあるはず

しばらくはグーグルが作ったカードボードVRを聞いたことがあるはずです

カードVRは発売時、スマートフォンと安価なVRキットだけでVRを体験できるが、本当に楽しむべき内容は十分ではない.
PCと接続して利用できるVR機器も発売されているが、高価で設置方法が複雑で有線接続が必要で設置に必要なスペースが大きいなどの理由で人気がない.
Facebook傘下のOculusは2019年に新しいモバイルVRを発売した.Ocularsタスクという製品です

カリキュラムタスク1(2019)

スマートフォンにはモバイルチップセットが付属しており、PCに接続することなくVRアプリケーションやゲームを実行できます.任天堂のスイッチのように、機器やコントローラさえあれば独立して動作できる製品です.
ビデオを見るだけでなく、ゲームや絵を描くこと、音楽を演奏することなど、さまざまなVR活動を行うことができます.最近ではディスプレイの代わりにVRを使用し、VR内部で仮想ディスプレイ画面を再生してエンコードして話題となっている.

:Immersedアプリケーションを使用してVR符号化を行う様子.原文を知りたい方はこちらへどうぞ.
Working From Orbit - VR Productivity In (or Above) a WFA World

カリキュラムタスク2(2020)

Ocularsミッションは現在2版がリリースされており、国内でもSKTや11番街などの販売所で販売されており、国内でも多くの販売が行われている.
有名なゲームをプレイするために購入し、好奇心から購入し、最初に閲覧した場所がアプリストアページです.
しかし、Ocularsタスクアプリストアページで販売されているアプリやゲームはカード形式で作成されていて、情報が一目も見えないので非常に不便です.

Oculus Quest最大販売ページ(2021年12月2日)の様子
Ocularsタスクアプリストアページで販売したいアプリは、上記の価格情報比較サイトのように、現在販売されている製品の情報をグラフ形式で一目で見たいです.

https://steamdb.info/sales/
参考までに上記のサイトを参考にしました.
冒頭が長い.今回の3週間にわたるインターネット開発ミニプロジェクトのテーマは、Occulasミッションコリアショップが一望できます.
現在のスモールプロジェクトの実装フェーズでは、次のことを実施してみました.

Ocularタスクアプリケーション/ゲーム販売ページで何を売っていますか

各アプリケーションおよびゲームのスコア、価格、およびタイプについて、

韓国のユーザーが切実に必要とする「韓国語」言語サポート

各アプリケーションの簡単なトレーラーのビデオと紹介を表示し、実際の購入ページに接続するボタン

を作成する.
しかし,一度に実施できる部分が限られているため,この範囲を大幅に縮小した.

Ocularタスクアプリケーション/ゲーム販売ページの「最も売れている/最も人気のある」タブには何が売られていますか?

韓国ショップ限定

アプリケーション全体のリストを表示できるページがありますが、時間がかかる可能性があるため、範囲が制限されています.
主言語はPython、WebサーバはFlash、外形はBootstrap 4.0、データベースはMongoDB.
以下に示すように、論理は非常に簡単です.

上記の操作が完了すると、FlaskでユーザーにWebページが表示されます.
簡単に見てみましょう.

「最大販売」ページのアプリケーション・リストのURLをスクロールします。

最大販売ページアプリケーションのリストを動的にロードします.
一度に表示されるアプリケーションの数は24個で、スクロールするたびに16個追加ロードされ、最下部にスクロールすると最大50個表示されます.
そこで、BeautifulSoup 4のみを使用してページをロードし、Seleniumを使用してページを最後まで移動し、しばらく待ってからページの内容を収集してみましょう.

from selenium import webdriver
from selenium.webdriver.chrome.service import Service

chrome_service = Service('driver/chromedriver.exe')
driver = webdriver.Chrome(service=chrome_service)
driver.get(top_selling_url)
time.sleep(random.uniform(15, 20))

# 열려있는 웹페이지의 body 태그가 끝나는 부분까지 이동 
driver.execute_script("window.scrollTo(0, document.body.scrollHeight);")
time.sleep(random.uniform(10, 15))

しばらく待ってから、BeautifulSoup 4を使用して、ページ内の各アプリケーションの特定の値を含むdivを選択し、raw app urlsとマークされたすべてのアイテムを挿入します.

from bs4 import BeautifulSoup

app_html = driver.page_source
app_soup = BeautifulSoup(app_html, 'html.parser')
app_list = app_soup.select_one('#mount > div > div.section > div > div > div.section__items')
raw_app_urls = app_list.find_all('a')

div.section items値にsection item-cellが各アプリケーションの情報を格納しています
raw app urlsはResultSetとして保存され、幸いにも各項目にhref値のすべてのリンクが含まれています.
このリストに基づいて、各アプリケーションの販売ページを再参照し、必要な値を検索してデータベースに保存します.

アプリケーション購入ページ分析

アプリケーション名、スコア、価格、言語など必要な内容を分類します.
raw app urlsのリンクを参照し、必要なコンテンツをスライスして保存し、MongoDBに挿入または更新します.
保存時には、Flashの登録ページに簡単なトレーラービデオを表示したいと思います.YouTube Data API v 3を使用して、DBセーブポイントで「アプリケーションタイトル+vr予告」を検索し、最上位のビデオid値を格納します.

# Youtube v3 API information
import googleapiclient.discovery

api_service_name = "youtube"
api_version = "v3"
DEVELOPER_KEY = YOUR_DEVELOPER_KEY

# Youtube API client
youtube = googleapiclient.discovery.build(
        api_service_name, api_version, developerKey=DEVELOPER_KEY)

...

trailer_query = app_title.get_text() + ' vr trailer'
            # "앱 이름 + ' vr trailer'" 로 검색한 최상단 Youtube 영상 id값 저장
            request = youtube.search().list(
                part="id,snippet",
                type='video',
                q=trailer_query,
                maxResults=3,
                fields="items(id(videoId))"
            )
            response = request.execute()
            # trailer의 동영상 id 값 저장
            trailer_url_id = response['items'][0]['id']['videoId']

ほとんどのアプリケーションのトレーラーは持っています.ただし、名前が一般的であるか、正式な車掛けがない場合は、まったく関連のないビデオid値が含まれます.これらの値を定期的にチェックし、手動で変更して、混乱を避ける必要があります.

実際に実装されたWebページの外観

ページは以下の通りです.

トップページ

アプリケーションのサムネイル、アプリケーション名、スコア、価格とタイプ、容量、韓国のユーザーが最も重要な韓国語サポートをしているかどうか.デフォルトのソートは画面には表示されませんが、ソート順は店内の多くのコメントです.

アプリケーション詳細ページ

アプリケーションを選択すると、下部に詳細ページが開き、左側にYoutubeに関連するトレーラーが表示され、右側にアプリケーションの紹介が表示されます.購入ボタンをクリックすると、実際のOcularsタスクショップ購入ページが新しいウィンドウで開きます.

Amazon EC 2でのサーバ接続の確立

一番多くのミスを経験したと思います.
まず、テスト環境がウィンドウ10からUbuntuに変更されたため、2つの大きな変更が発生した.

MongoClientの接続先をEC 2内部アカウントに変更し、Selenium DriverをLinuxバージョンに変更

AWS EC 2のFree Tier UbuntuはCLI環境であるため、ウィンドウは使用できませんが、Seleniumを使用してページをスクロールするなど、仮想画面を描くオプションが必要です.chromeオプションの使用--headless設定が必要です

# Linux 버전의 드라이버 경로로 설정
path = '/home/ubuntu/myoculusproject/driver/chromedriver'

# chrome 실행 옵션을 설정
chrome_options = webdriver.ChromeOptions()
chrome_options.add_argument('--headless')
chrome_options.add_argument('--no-sandbox')
chrome_options.add_argument("--single-process")
chrome_options.add_argument("--disable-dev-shm-usage")
chrome_options.add_argument("User-Agent': 'Mozilla/5.0 (Windows NT 10.0; Win64; x64)AppleWebKit/537.36 (KHTML, like Gecko) Chrome/73.0.3683.86 Safari/537.36")

driver = webdriver.Chrome(path, chrome_options=chrome_options)

上記の操作が完了すると、現在ガビアで購入しているドメインに接続し、外部接続が正常であることを確認しました.
お知らせミッション韓国ショップ一覧

せいげんじょうけん

アプリケーション名のサムネイルアイテムは、Oculus Store付近のcdnに登録されているurlに直接書き込まれます.このリンクは2～3日おきに期限切れになります.スクロール中に更新を続けるように設定しますが、[ベストセラー]タブまたは[人気者]タブに入ってから離れると、サムネイルが正常に表示されない可能性があります.

の最後の部分

このミニプロジェクトの大部分は、スパルタ符号化クラブで行われたネットワーク開発総合クラスの授業内容に基づいて作成されています.授業期間は8週間で、ある意味短いですが、必要な内容が豊富なので、授業を受けるのは素晴らしいです.
下位レベルからの実装には時間がかかり、多くのコンテンツが教室コード断片を使用してサンプルコードを提供している.すぐに使えるライブラリが大好きで、数日、数日、または数日の渋滞を簡単にスキップできます.皆さんがやりたいことに集中できるようにするための講座だと思います私は特にAWS EC 2で私のプロジェクトを直接配置した部分を覚えています.
このミニプロジェクトを拡張し続ける場合は、次の操作を行います.

Crontabを使用して、店舗割引継続時間KST 17:00(PST 00:00)後に自動的にスクロールし、更新されたアプリケーション、価格、サムネイル情報

を取得します.

アプリケーション割引時に割引中の商品は、上部

にあります.
タグ

割引

日価格比較機能

は韓国ショップでは販売されていませんが、韓国語をサポートするアプリ(この場合は他の国/地域に接続する必要があり、Seleniumを使用するスクロール段階でVPNを使用する必要があります)

を紹介します.
このミニプロジェクトも韓国OcularsミッションVR利用者の役に立つサイトになると思います