加入星計(jì)劃,您可以享受以下權(quán)益:

  • 創(chuàng)作內(nèi)容快速變現(xiàn)
  • 行業(yè)影響力擴(kuò)散
  • 作品版權(quán)保護(hù)
  • 300W+ 專業(yè)用戶
  • 1.5W+ 優(yōu)質(zhì)創(chuàng)作者
  • 5000+ 長(zhǎng)期合作伙伴
立即加入

避免接觸,使用FPGA創(chuàng)建數(shù)字菜單,定義非接觸式數(shù)字菜單

2020/12/03
574
服務(wù)支持:
技術(shù)交流群

完成交易后在“購買成功”頁面掃碼入群,即可與技術(shù)大咖們分享疑惑和經(jīng)驗(yàn)、收獲成長(zhǎng)和認(rèn)同、領(lǐng)取優(yōu)惠和紅包等。

虛擬商品不可退

當(dāng)前內(nèi)容為數(shù)字版權(quán)作品,購買后不支持退換且無法轉(zhuǎn)移使用。

加入交流群
掃碼加入
獲取工程師必備禮包
參與熱點(diǎn)資訊討論
放大
方塊圖(3)
相關(guān)方案
  • 方案介紹
  • 相關(guān)文件
  • 相關(guān)推薦
  • 電子產(chǎn)業(yè)圖譜
申請(qǐng)入駐 產(chǎn)業(yè)圖譜

隨著餐館在紐約的重新開業(yè),我注意到它們都已轉(zhuǎn)向非接觸式數(shù)字菜單。由于我最近一直在花時(shí)間研究無線應(yīng)用,其中涉及使用MiniZed和Ultra96v2在Zynq SoC FPGAARM處理器上運(yùn)行的自定義Web服務(wù)器,因此我意識(shí)到如何輕松地利用FPGA作為解決方案來幫助餐館在COVID期間適應(yīng)。我再次轉(zhuǎn)向值得信賴的MiniZed,以查看為可通過QR碼訪問的數(shù)字餐廳菜單創(chuàng)建獨(dú)立解決方案有多么簡(jiǎn)單。

該項(xiàng)目的骨干是在MiniZed的Zynq芯片的ARM內(nèi)核上運(yùn)行的Web服務(wù)器。過去,我已經(jīng)介紹了如何為MiniZed創(chuàng)建自定義Web服務(wù)器,但是由于在定制它以滿足餐廳的需求方面有一些不同的重點(diǎn),因此我想在這里再次進(jìn)行概述。我家鄉(xiāng)的一家本地咖啡店在他們的社交媒體上發(fā)布了他們正在尋找數(shù)字菜單解決方案的信息,因此我決定在Web服務(wù)器的主頁中使用其菜單和徽標(biāo)。

我從在Ouija板項(xiàng)目中為MiniZed創(chuàng)建的ext4根文件系統(tǒng)映像開始。由于Web服務(wù)器是用Python編寫的,因此與Web服務(wù)器的靜態(tài)文件夾所需的Python程序包(Flask和Requests )以及必需的圖像文件相比,MiniZed所需的默認(rèn)initramfs圖像需要更多的空間。

后端Python

對(duì)于用Python編寫的Web服務(wù)器的后端,它運(yùn)行Flask應(yīng)用程序,該應(yīng)用程序使用HTML請(qǐng)求來服務(wù)來自前端HTML的GET和POST請(qǐng)求。服務(wù)器的每個(gè)網(wǎng)頁都定義為一個(gè)函數(shù),概述了如何返回具有所需數(shù)據(jù)的渲染模板。

首先,使用pip安裝Python包Flask和Requests:

然后為Web服務(wù)器創(chuàng)建新文件。我選擇啟用調(diào)試選項(xiàng)(app.debug = True),該選項(xiàng)將HTTP請(qǐng)求和結(jié)果狀態(tài)代碼輸出到串行控制臺(tái)。
注意,主頁被定義為home()函數(shù),而GET和POST請(qǐng)求都只是返回主頁的渲染HTML模板。

Web服務(wù)器文件結(jié)構(gòu)

如前所述,要使準(zhǔn)系統(tǒng)Web服務(wù)器運(yùn)行在FPGA或微控制器之類的設(shè)備上,必須滿足最低文件結(jié)構(gòu)要求。
調(diào)用render_template()方法時(shí),它將在模板目錄中查找HTML模板。模板所在的目錄也是webserver.py腳本所在的目錄。HTML模板文件的名稱是傳遞給render_template()方法的唯一必需參數(shù),而可選參數(shù)包括任何要作為關(guān)鍵字參數(shù)傳遞給模板引擎的變量。

另一個(gè)所需的目錄是靜態(tài)目錄。Flask應(yīng)用程序在靜態(tài)目錄中提取CSS來獲取Web網(wǎng)頁模板的格式,JavaScript和圖像文件。該圖像目錄是在咖啡館的菜單和標(biāo)識(shí)的文件將被放置。

前端模板

有一個(gè)默認(rèn)模板可以用作所有網(wǎng)頁的通用基礎(chǔ)。默認(rèn)模板處理諸如基本CSS主題,將出現(xiàn)在每個(gè)網(wǎng)頁上的頁眉和頁腳以及列出每個(gè)可用頁面的導(dǎo)航工具欄之類的事情。

在此模板中,將在每個(gè)網(wǎng)頁的標(biāo)題中調(diào)用咖啡店的徽標(biāo)。目前,菜單只有主頁,因此home.html是導(dǎo)航欄部分中的唯一選項(xiàng)。

默認(rèn)HTML模板:

主頁模板是顯示咖啡店菜單圖像文件的位置??梢哉{(diào)用一種簡(jiǎn)單的CSS樣式,使圖像自動(dòng)調(diào)整大小到當(dāng)前窗口的大小,以便在訪問該設(shè)備的任何設(shè)備上看起來都干凈整潔。

帶有菜單的主頁HTML模板:

HTML模板完成后,在MiniZed上啟動(dòng)Web服務(wù)器:

然后在瀏覽器中使用MiniZed本地IP來查看網(wǎng)頁。我把它放在手機(jī)上,因?yàn)榇蠖鄶?shù)客戶流量來自他們的智能手機(jī)。

  • prj-mi1dev1-01-04_schematic_prints_hS33bRebOC.pdf
    描述:原理圖
  • bdf-master.zip
    描述:碼
  • petalinux-master.zip
    描述:安富利PetaLinux存儲(chǔ)庫
  • hdl-master.zip
    描述:安富利HDL存儲(chǔ)庫

相關(guān)推薦

電子產(chǎn)業(yè)圖譜