步驟1：您需要做什么

對(duì)于此項(xiàng)目，只需最少兩件事即可使其工作。其他所有內(nèi)容都是您可以包括的附加功能。

所需的部件是：

Arduino

Arduino以太網(wǎng)屏蔽-注意：如果您使用的是較舊的屏蔽，則將無(wú)法使用。 SD卡。如果您沒(méi)有防護(hù)罩，請(qǐng)獲取最新版本！?。?/p>

可選部件：

放入其中的盒子-推薦

伺服

液晶屏

某些LED 更多可選部件-這些用于外部控制和/或傳感器：

第二個(gè)Arduino

所需的任何聲納和控制器

長(zhǎng)電纜或無(wú)線收發(fā)器（像Xbee）

步驟2：Web入門(mén)

您要做的第一件事需要做的是在arduino上放置以太網(wǎng)屏蔽。如果需要幫助，請(qǐng)將屏蔽罩上的引腳名稱與Arduino的引腳名稱對(duì)齊。然后將其插入計(jì)算機(jī)，然后將以太網(wǎng)電纜從路由器連接到Arduino。打開(kāi)Arduino IDE，并在arduino-00xx-》 library-》 Ethernet下運(yùn)行WebServer示例。

打開(kāi)您喜歡的Web瀏覽器，然后輸入http://192.168.1.177。您應(yīng)該看到類似下圖的內(nèi)容。如果它不起作用，請(qǐng)勿恐慌！您可能有一個(gè)Internet服務(wù)提供商，其阻止了端口80（標(biāo)準(zhǔn)的http端口）。

要對(duì)此進(jìn)行測(cè)試，我們將嘗試以下方法之一轉(zhuǎn)到端口8080或8081。轉(zhuǎn)到WebServer草圖，找到顯示以下內(nèi)容的行：Server server（80）;它是草圖的開(kāi)始。將80更改為8080或8081?，F(xiàn)在上傳。要進(jìn)入您的網(wǎng)站，您需要輸入：http://192.168.1.177:8080或http://192.168.1.177:8081。如果有效，那就太好了，您可以繼續(xù)下一步?。?！ portforward.com是尋求轉(zhuǎn)發(fā)幫助的好地方。

在您興奮并打電話給您的朋友上車(chē)之前，我們遇到了問(wèn)題。您站點(diǎn)的IP地址只能由連接到路由器的計(jì)算機(jī)訪問(wèn)。沒(méi)有其他人可以訪問(wèn)它。我們?nèi)绾谓鉀Q這個(gè)問(wèn)題？？？我們使用端口轉(zhuǎn)發(fā)。這可能很容易，也可能很難，具體取決于您和路由器的制作方式。您將需要訪問(wèn)路由器的設(shè)置頁(yè)面并進(jìn)行搜索，直到看到鏈接或選項(xiàng)卡或任何名為“端口轉(zhuǎn)發(fā)”或“端口轉(zhuǎn)發(fā)/端口觸發(fā)”或類似名稱的內(nèi)容。轉(zhuǎn)到該頁(yè)面，然后選擇一個(gè)新的 http 服務(wù)。輸入Web服務(wù)器的IP，并將起始端口和結(jié)束端口設(shè)置為8080或8081。保存更改，現(xiàn)在人們可以從路由器外部訪問(wèn)您的網(wǎng)站。但是您將需要一個(gè)新的IP。路由器的IP。請(qǐng)?jiān)L問(wèn)www.whatismyip.com。請(qǐng)勿訪問(wèn)http：//this.is.my.ip：8080或http：//this.is.my.ip：8081的IP。使用這個(gè)和是以及我和 ip 分別代表您的地址。

現(xiàn)在致電您的最親密的朋友，讓他們看看?？墒堑鹊龋。?！仍然存在一個(gè)問(wèn)題，記住所有這些數(shù)字可能會(huì)很痛苦！我們并不擅長(zhǎng)記住數(shù)字字符串，但是我們擅長(zhǎng)記住單詞和名稱。

要解決此問(wèn)題，您可能希望獲得一個(gè)實(shí)際的域名，例如example.com。最簡(jiǎn)單的方法是訪問(wèn)dyndns.com并注冊(cè)一個(gè)免費(fèi)帳戶，然后選擇一個(gè)免費(fèi)域名。其中包括您的名字 .dyndns- 某物 .com或您的名字 .dyndns。 some2or3letterending ?，F(xiàn)在將此域設(shè)置為路由器的IP。要訪問(wèn)您的站點(diǎn)，您將鍵入http：//yourname.dyndns.whatever：8080或8081，具體取決于您的服務(wù)器端口。在Internet Explorer中，需要http：//，但對(duì)于80以外的其他端口，則不需要Firefox。

您可以采取的最后一步（可選）是制作網(wǎng)絡(luò)跳，而不必在：808x上鍵入結(jié)束。我已將http://teslalingeweb.dyndns-web.com指向路由器的ip，并將http://teslaling.dyndns-web.com設(shè)置為http://teslalingeweb.dyndns-web.com:8081的網(wǎng)絡(luò)跳。對(duì)于端口80上的網(wǎng)站，不需要http：//。

現(xiàn)在您已經(jīng)在網(wǎng)站上擁有了網(wǎng)站，您可以構(gòu)建服務(wù)器并設(shè)計(jì)網(wǎng)站！

步驟3：構(gòu)建Web服務(wù)器

雖然我將向您展示我的Web服務(wù)器設(shè)計(jì)，但完全由您決定如何布局和設(shè)計(jì)，但是這里有一些指導(dǎo)原則。

我建議將arduino放在一個(gè)角落，以便可以訪問(wèn)電源，USB和以太網(wǎng)端口以及SD卡插槽。

我也建議使用堅(jiān)固的盒子，我使用的盒子不是很堅(jiān)固，現(xiàn)在伺服器的重量

如果打算安裝LCD屏幕，請(qǐng)先將其焊接在其上，然后將其連接至以太網(wǎng)屏蔽，然后再放入盒中，盒內(nèi)有8根電線可供連接！ ！

第4步：連接設(shè)備

與該項(xiàng)目的其他所有內(nèi)容一樣，您可以選擇要添加到ServDuino中的其他內(nèi)容。我有一些建議和規(guī)則，您可以遵循這些建議和規(guī)則以使其成功構(gòu)建。

伺服。

Theservo易于連接，將紅色線連接到+5，黑色線連接到gnd，黃色（或第三根導(dǎo)線）連接到pwm引腳。在主板上，pwm引腳包括3、5、6、9、10、11。但是，不能使用引腳10和11，因?yàn)樗鼈冇糜谂c以太網(wǎng)屏蔽和SD卡的SPI通信。如果您使用delay或millis（），我建議不要使用5或6針，因?yàn)槿绻鸖ervDuino在計(jì)算機(jī)旁邊，會(huì)有一個(gè)令人討厭的抖動(dòng)！

LCD屏幕。

一個(gè)字符LCD屏幕最多可連接6個(gè)數(shù)據(jù)引腳。很好，因?yàn)閮H剩6個(gè)數(shù)字引腳。現(xiàn)在，在您發(fā)表評(píng)論并告訴我實(shí)際上有9個(gè)圖釘之前，讓我解釋一下。我們使用了別針13，12，11，10和我們選擇的9，6，5或3。這留下了9個(gè)別針。但是，我們需要一個(gè)用于與SD卡進(jìn)行SPI通信的引腳，即引腳4。接下來(lái)，我們必須記住，Arduino使用UART來(lái)上傳其草圖，因此我們不想使用引腳0或1，如果?，F(xiàn)在我們?cè)撊绾蝺H用6個(gè)引腳連接LCD屏幕，如下所示：

Vss接地，

Vcc接地+5伏特。

Vo可以接地，也可以連接電位計(jì)。RS與數(shù)據(jù)引腳相連。記住什么針?。。』蛘吒玫姆椒ㄊ菍⑵鋵?xiě)下來(lái)！

R/W接地。

E接地到數(shù)據(jù)引腳。記下來(lái)！

DB0-DB3未連接。

DB4-DB7與數(shù)據(jù)引腳相連。寫(xiě)下來(lái)吧！

背光引腳可以連接到各自的電壓源。

模擬傳感器：

模擬傳感器非常簡(jiǎn)單，但是在較新的以太網(wǎng)屏蔽上，也許在較舊的以太網(wǎng)屏蔽上也是如此是在模擬引腳0和1上與+ 5v相連的10K電阻器。當(dāng)心！

Xbee和串行通信：

嗯，我在這里沒(méi)有太多產(chǎn)品，我沒(méi)有任何Xbees 。..但。..但我想提一些建議。任何時(shí)候需要上傳草圖時(shí)，您都需要關(guān)掉xbee跳線或斷開(kāi)串行線（如果不進(jìn)行無(wú)線連接），因此您可能希望嘗試在服務(wù)器盒上放置一個(gè)跳線選擇。如果您不這樣做，則必須將其撕碎以上傳草圖。

第5步：設(shè)計(jì)網(wǎng)站

在這里，您必須在這里開(kāi)始思考什么您希望您的網(wǎng)站看起來(lái)像和做的一樣，以便您可以選擇存儲(chǔ)網(wǎng)站信息的方式。

如果您想擁有一個(gè)非常基本的網(wǎng)站，可能只有一頁(yè)，或者希望能夠控制一些led或電燈開(kāi)關(guān)或您的心臟想要的任何東西，您應(yīng)該使用保存在Arduino內(nèi)存中的站點(diǎn)。

如果您想要具有類似的功能，但想要超過(guò)一頁(yè)，則需要考慮使用

如果您想要一個(gè)包含圖片，視頻和許多頁(yè)面的常規(guī)站點(diǎn)，或者其他任何內(nèi)容，則需要使用SD卡。

限制和功能：

使用ram選項(xiàng)，該站點(diǎn)只能是1500個(gè)字符（包含html代碼，而不是實(shí)際文本），這非常有限，但是對(duì)于簡(jiǎn)單的led（led可能實(shí)際上是任何東西）控制器來(lái)說(shuō)非常有用。

使用PROGMEM選項(xiàng)，您少得多。使用atmega328，您最多可以存儲(chǔ)12，000-13，000個(gè)html字符?。?！它適用于家庭自動(dòng)化或不帶SD卡的多頁(yè)站點(diǎn)，但是您無(wú)法在其中存儲(chǔ)圖片或文件，并且您仍然只能使用12k字符。

SD卡是大型站點(diǎn)的最佳選擇，其中包含許多腳本，圖片，頁(yè)面等。但是到目前為止，它不能用于控制Web上的LED，但是我正在研究它！我也在研究目錄，并使用SD庫(kù)而不是sdfatlib（但不要期待一會(huì)兒，因?yàn)槲业闹饕κ窃趌ed控制器和目錄上，除非‘ibles社區(qū)想提供幫助?。?/p>

第6步：存儲(chǔ)選項(xiàng)

這是我在上一章中介紹的存儲(chǔ)選項(xiàng)的更深入的介紹步驟。

Ram：

第一個(gè)選項(xiàng)是將站點(diǎn)存儲(chǔ)在Arduino的ram中。這是最簡(jiǎn)單的方法，因?yàn)槟恍枵{(diào)用client.print（）函數(shù)并在其中寫(xiě)入html代碼。限制為大約1500個(gè)字符，因?yàn)锳rduino僅具有2048字節(jié)的ram。*

Ex：client.print（“

。..”）;

程序存儲(chǔ)器：

如果您可以將代碼存儲(chǔ)在程序存儲(chǔ)器而不是ram中，那不是很好。好吧，實(shí)際上，上述選項(xiàng)可以做到這一點(diǎn)，但是編譯器隨后會(huì)在啟動(dòng)時(shí)讓微型計(jì)算機(jī)將所有內(nèi)容都讀入內(nèi)存。我們?cè)撊绾谓鉀Q？我們使用PROGMEM庫(kù)pgmspace.h。這告訴編譯器我們想將數(shù)據(jù)保留在程序存儲(chǔ)器中?，F(xiàn)在我們已經(jīng)可以有12k個(gè)字符。*唯一的問(wèn)題是，micro傾向于容易凍結(jié)，但是在下一步中，我有解決方法。

SD卡：

當(dāng)涉及到SD卡無(wú)疑是最佳選擇。您最多可以擁有64GB的內(nèi)存！最大的問(wèn)題是，不建議使用ATMEGA168或更舊版本的Duemilanove，因?yàn)樗淖钚【幾g大小約為16000字節(jié)。與PROGMEM代碼不同，我很少遇到SD卡死機(jī)的問(wèn)題，而且我非常接近獲得有效的led控制器代碼。

第7步：編程！

從這里開(kāi)始樂(lè)趣-或沮喪-開(kāi)始！現(xiàn)在，您可以上傳您選擇的草圖并測(cè)試您的Web服務(wù)器了！

我這里有很多草圖可供下載。我將在以下類別中列出它們：RAM，PROGMEM，SD。我將簡(jiǎn)要介紹每個(gè)草圖及其功能。我將為每個(gè)新功能提供一個(gè)草圖。完全可以根據(jù)需要將它們組合在一起。

RAM：

RAMWebServer_Basic-基本的Ram WebServer草圖。

RAMWebServer_Control-包含控制代碼和LED指示燈。

*更多內(nèi)容即將推出！

PROGMEM：

*更多即將推出！

SD：

重要提示：如果您沒(méi)有SDFatLib和/或您具有SD.h庫(kù)，則SDFat文件將無(wú)法編譯。 （包含在Arduino-0022中）

SDFatWebServer_Normal-基本SD卡WebServer草圖

SDFatWebServer_Fast-包含SD卡讀取和客戶端寫(xiě)入功能之間的緩沖區(qū)，從而使上傳速度更快

SDFatWebServer_Normal_404-具有用于自定義的404文件未找到頁(yè)面，稱為404error.htm

SDFatWebServer_Fast_404-具有404頁(yè)面和緩沖區(qū)的代碼

SDFatWebServer_Normal_LCD-具有LCD屏幕點(diǎn)擊計(jì)數(shù)器的代碼

SDFatWebServer_Fast_LCD-具有LCD的代碼和緩沖區(qū)

SDFatWebServer_Normal_Servo-支持Web流量伺服儀表。

SDFatWebServer_Fast_Servo-Servos a nd緩沖區(qū)，還有什么更好的方法？

*很快就會(huì)有更多的東西?。?！

步驟8：更進(jìn)一步

好，您現(xiàn)在擁有自己的工作ServDuino Web服務(wù)器?。‖F(xiàn)在您可以嘗試使用不同的代碼，甚至可以編寫(xiě)自己的代碼，如果很好，請(qǐng)將其發(fā)送給我，我會(huì)將其發(fā)布在可指導(dǎo)的位置，并為您效勞?。?！

PROGMEM修復(fù)：

服務(wù)器喜歡在使用PROGMEM存儲(chǔ)運(yùn)行時(shí)凍結(jié)很多。一個(gè)簡(jiǎn)單的解決方法是使用看門(mén)狗定時(shí)器，但是問(wèn)題在于當(dāng)它復(fù)位時(shí)，Arduino進(jìn)入了一個(gè)無(wú)限循環(huán)，因?yàn)橐龑?dǎo)加載程序中有些混亂。最簡(jiǎn)單的方法就是使用555定時(shí)器作為外部看門(mén)狗，但是如果要使其保持基于軟件，則需要ladyada bootloader。這使您可以使用看門(mén)狗計(jì)時(shí)器重置凍結(jié)的Arduino?，F(xiàn)在，盡管您在使用軟件時(shí)遇到了另一個(gè)問(wèn)題。您仍然需要重置以太網(wǎng)屏蔽。怎么樣？從屏蔽層上剪下復(fù)位針，然后將一根導(dǎo)線連接到您選擇的針上。現(xiàn)在，您只需在setup（）中將引腳設(shè)置為高電平，然后將其拉低幾微秒，然后再在setup（）中初始化以太網(wǎng)芯片即可?？撮T(mén)狗在RAM和SD選項(xiàng)中也很有用。

SD卡favicon.ico：

當(dāng)我測(cè)試SD卡代碼時(shí)，我將USB電纜插入了計(jì)算機(jī)，并有一個(gè)終端監(jiān)視輸入的串行。當(dāng)有人到達(dá)站點(diǎn)時(shí)，Arduino會(huì)發(fā)送他們剛剛請(qǐng)求的頁(yè)面。我注意到，每當(dāng)有人訪問(wèn)主頁(yè)時(shí)，也會(huì)有一個(gè)favicon.ico的請(qǐng)求。 favicon.ico是地址欄中，該選項(xiàng)卡上以及該站點(diǎn)旁邊的“收藏夾”文件夾中的小圖標(biāo)。要獲得自己的favicon.ico，您將需要找到一個(gè)在線的圖標(biāo)生成器（使用Google制作），然后將其下載并放在根目錄（而不是任何文件夾）的SD卡中。如果您將網(wǎng)站另存為收藏夾，請(qǐng)刪除收藏夾，然后轉(zhuǎn)到您的站點(diǎn)。您應(yīng)該看到它出現(xiàn)。注意：如果您進(jìn)行繪畫(huà)并制作一個(gè)并將其另存為.ico，Internet Explorer將拒絕您的收藏夾圖標(biāo)。它可以在Firefox和Chrome中使用，但不能在ie中使用。如果需要，還可以通過(guò)將瀏覽器放入首頁(yè)html文件（index.htm）來(lái)使瀏覽器請(qǐng)求收藏夾圖標(biāo)：