Kết nối Raspberry Pi của bạn với Web: 9 bước

2024 Tác giả: John Day | [email protected]. Sửa đổi lần cuối: 2024-01-30 13:31

Trong bài học này, bạn sẽ học cách tạo một trang web, thu thập dữ liệu bằng cách sử dụng world wide web và sử dụng các API để đăng hình ảnh lên Tumblr và Twitter.

Bước 1: Máy khách và Máy chủ

Trong tin học, máy khách-máy chủ là một mô hình phần mềm bao gồm hai phần: máy khách và máy chủ. Cả hai giao tiếp qua mạng máy tính hoặc cùng nhau trên cùng một máy tính. Máy khách là một chương trình hoặc một máy tính có phần mềm dựa vào việc thực hiện các yêu cầu dịch vụ tới máy chủ. Máy chủ là một chương trình máy tính hoặc một thiết bị có thể chấp nhận các yêu cầu này, xử lý chúng và trả lại thông tin được yêu cầu cho máy khách. Đôi khi thật khó để tìm ra đâu là khi làm việc với các máy thực hiện nhiều tác vụ cùng một lúc. Dưới đây là một số đặc điểm để giúp bạn phân biệt máy khách và máy chủ.

Đặc điểm khách hàng:

• Nó là hoạt động đầu tiên
• Gửi yêu cầu đến máy chủ
• Nó mong đợi và nhận được phản hồi từ máy chủ
• Thường tương tác trực tiếp với người dùng cuối bằng bất kỳ giao diện người dùng nào, chẳng hạn như giao diện người dùng đồ họa

Đặc điểm máy chủ:

• Ban đầu nó bị động
• Nó đang lắng nghe, sẵn sàng đáp ứng các yêu cầu do khách hàng gửi đến
• khi có yêu cầu, sẽ trả lời kèm theo dữ liệu được yêu cầu cho khách hàng
• Người dùng cuối thường không tương tác trực tiếp với máy chủ mà sử dụng máy khách.

Một ví dụ phổ biến về mối quan hệ máy khách và máy chủ là trình duyệt web (máy khách) yêu cầu và nhận các tệp trang web được lưu trữ trên máy chủ web.

Bước 2: Tạo máy chủ web cục bộ

Raspberry Pi có thể trở thành một máy chủ web bằng cách cài đặt và chạy một ứng dụng máy chủ. Hai ứng dụng máy chủ nguồn mở phổ biến là: NGINX (phát âm là engine x) và Apache. Trong bài học này, bạn sẽ sử dụng Apache vì trong bài viết này, nó được ghi chép nhiều hơn. Điều này làm cho việc tìm kiếm câu trả lời trực tuyến dễ dàng hơn khi bạn học.

Raspberry Pi của bạn sẽ lưu trữ một trang web mà bất kỳ thiết bị nào trên cùng một mạng đều có thể truy cập. Bắt đầu nào!

Bước 3: Cài đặt Apache

Cài đặt gói apache2. Cờ -y trả lời câu hỏi bảo mật cài đặt trước cho bạn.

sudo apt-get install apache2 -y

Apache đi kèm với một tệp HTML thử nghiệm tạo ra một trang web giữ chỗ để kiểm tra cài đặt với. Tệp HTML thử nghiệm này nằm trong thư mục gốc của Apache. Theo mặc định, Apache được đặt để tìm tài liệu web trong thư mục này để tạo nội dung trong trình duyệt web. Để xem trang thử nghiệm này và xác nhận Apache đã thực sự cài đặt đúng cách, hãy kéo nó lên trong trình duyệt web của bạn bằng cách nhập địa chỉ URL này:

localhost /

Nếu Apache được cài đặt đúng cách, bạn sẽ thấy trang web kiểm tra Apache trong trình duyệt:

Tìm địa chỉ IP Raspberry Pi của bạn

Bạn có thể sử dụng địa chỉ localhost để truy cập trang web khi sử dụng Raspberry Pi. Để truy cập trang web từ một máy tính khác, bạn cần có địa chỉ IP của Raspberry Pi. Để tìm loại địa chỉ IP trong LXTerminal:

ifconfig

Bạn cũng có thể tìm thấy nó trên máy tính để bàn nếu di con trỏ qua biểu tượng tiếp nhận WiFi.

Bước 4: Tạo một trang web tĩnh

Raspberry Pi của bạn bây giờ có thể lưu trữ một trang web và tất cả nội dung sẽ được xuất bản trên đó. Có hai loại trang web cơ bản: tĩnh và động. Một trang tĩnh có nội dung không thay đổi. Một trang động có thể hiển thị dữ liệu thay đổi, chẳng hạn như các chỉ số cảm biến hoặc ngày và giờ thay đổi.

Hãy bắt đầu với một trang tĩnh. Để tạo một tài khoản, bạn cần sử dụng một ngôn ngữ gọi là HTML. Khi bạn truy cập một trang web, điều đầu tiên bạn thấy hiển thị có thể là trang index.html. Trang này là trang mặc định mà trình duyệt hiển thị nếu trang khác không được chỉ định. Theo mặc định, Apache tìm kiếm tệp index.html tại đây:

/ var / www / html

Đây được gọi là gốc tài liệu và nó là một thư mục ẩn. Nó được chỉ định để giữ các trang web. Đến đó và xem xét xung quanh:

cd / var / www / html

ls

Bạn sẽ thấy tệp index.html kiểm tra mặc định được liệt kê. Nếu bạn muốn lưu tệp mặc định, hãy đổi tên nó thành một cái gì đó như defaultIndex.html bằng cách sử dụng lệnh mv.

sudo mv index.html defaultIndex.html

nếu bạn không muốn lưu nó, hãy xóa tệp bằng cách sử dụng lệnh rm:

sudo rm index.html

Bây giờ, bạn có thể tạo và bắt đầu chỉnh sửa tệp index.html của riêng mình:

sudo nano index.html

Hãy nhớ sử dụng sudo, các thư mục www và html được sở hữu bởi root vì vậy bạn cần phải hoạt động như root để tạo, chỉnh sửa và thao tác với bất kỳ tệp nào nằm trong các thư mục đó.

Trang HTML cơ bản

HTML là một ngôn ngữ đi sâu. Bạn có thể làm được rất nhiều điều với nó. Nếu bạn muốn tìm hiểu thêm, hãy xem trang web của W3Schools, nơi bạn có thể tìm thấy nhiều hướng dẫn về cách sử dụng HTML để xây dựng một trang web. Chúng ta sẽ bắt đầu với một trang HTML đơn giản.

Trước tiên, hãy cho trình duyệt biết bạn đang sử dụng phiên bản HTML nào. Tài liệu này được khai báo dưới dạng tài liệu HTML5:

Bắt đầu với các thẻ html và body:

Tiếp theo, phần lớn nội dung của bạn sẽ nằm giữa các thẻ body. Đặt dòng đầu tiên thành tiêu đề với thẻ h1. Số sau chữ "h" xác định tầm quan trọng của tiêu đề ảnh hưởng đến kích thước của phông chữ. Sử dụng thẻ p để xác định một đoạn văn:

Raspberry Pi của tôi có một trang web

Tôi nên đặt cái gì ở đây?

Kết thúc trang bằng cách đóng phần nội dung và html và các thẻ:

Lưu tài liệu với hậu tố.html và truy cập localhost trong trình duyệt của bạn. Bạn sẽ thấy trang web của mình!

Bạn nên đặt gì trên trang web? Hãy đưa một hình ảnh lên, hoặc tốt hơn là animateMe.gif! Để bất kỳ nội dung nào được hiển thị trên trang web này, nó phải được đặt nó trong thư mục gốc của Apache. Bạn nên sao chép và dán nó để nó cũng nằm trong thư mục boof / fotos của bạn. Để sao chép và dán một tệp trong dòng lệnh, hãy sử dụng lệnh cp. Đầu tiên, cd vào thư mục chính của bạn:

cd ~

Sao chép và dán tệp animateMe.gif:

sudo cp boof / fotos / animateMe.gif / var / www / html

Quay lại thư mục html:

cd / var / www / html

Mở lại tệp index.html để bạn có thể thêm hình ảnh:

sudo nano index.html

Để xác định và nhúng hình ảnh trên trang HTML, hãy sử dụng thẻ img. Đặt dòng sau giữa tiêu đề và đoạn văn.

Mở trang trong trình duyệt và nó sẽ trông giống như thế này ngoại trừ với ảnh-g.webp

Bước 5: Thêm một số kiểu

Trang này trông hơi nhạt nhẽo. Không có màu sắc và không có phong cách. Đây là lúc CSS xuất hiện. Nó là một ngôn ngữ hoạt động song song với HTML để làm cho trang web trở nên hấp dẫn hơn và sáng tạo hơn về mặt hình ảnh. Bạn sẽ chỉ chạm vào đây nhưng nếu bạn muốn tìm hiểu thêm, hãy đến W3schools để tìm hiểu thêm.

Ví dụ: hãy thay đổi màu của nền bằng cách thêm CSS vào tệp HTML của bạn. Có một số cách để tạo kiểu cho trang web của bạn bằng cách sử dụng CSS. Đối với lớp này, bạn sẽ sử dụng các thẻ kiểu để nhúng CSS ngay vào tệp HTML của mình.

Đặt các dòng sau vào giữa các thẻ html và body đầu tiên ở đầu trang HTML của bạn:

các thẻ body {background-color: powderblue;}. Nó sẽ trông giống thế này:

nội dung {background-color: powderblue;}

Bước 6: Cài đặt PHP

Thay vì trang tĩnh, bạn có thể tạo một trang động có khả năng thay đổi mà không cần tải tệp lên đó theo cách thủ công. Một cách phổ biến để làm điều này là sử dụng một ngôn ngữ kịch bản có tên là PHP. Để sử dụng PHP trên Raspberry Pi, trước tiên bạn cần cài đặt nó với gói mô-đun cho Apache:

sudo apt-get install libapache2-mod-php5 php5 -y

Bước 7: Tạo một trang web động

Kết hợp PHP với HTML Miễn là mã PHP được chứa trong các thẻ, bạn có thể đưa nó vào cấu trúc tệp HTML. Ví dụ: kết hợp các tập lệnh HTML và PHP hiện tại của bạn và làm cho văn bản lớn hơn bằng cách sử dụng các thẻ HTML.

Hãy bao gồm một tập lệnh PHP đơn giản hiển thị ngày và giờ. Dán nội dung sau vào bất kỳ đâu giữa các thẻ:

Lưu tệp bằng Ctrl + o nhưng thay đổi phần mở rộng từ.html thành.php, thao tác này sẽ lưu một tệp mới. Để không gây nhầm lẫn cho trình duyệt, hãy xóa phiên bản.html cũ:

sudo rm index.html

Làm mới localhost trong trình duyệt web của bạn. Đầu ra sẽ như thế này:

Ok, vậy sự khác biệt là gì? Nó trông giống như một trang HTML thông thường phải không? Làm mới trang và xem điều kỳ diệu. Điều kỳ diệu là thời gian sẽ thay đổi! Đó là PHP và hàm date () tích hợp của nó hoạt động để bạn tạo một trang web động.

Bước 8: Tạo ứng dụng Tumblr API

Raspberry Pi có thể yêu cầu và lấy thông tin từ các ứng dụng phần mềm khác trực tuyến thông qua một API (Giao diện lập trình ứng dụng). Một API giúp một thứ gì đó như Raspberry Pi dễ dàng cắt qua tất cả dữ liệu của một trang web để chỉ lấy những thứ hữu ích. Yêu cầu Raspberry Pi của bạn nói chuyện với Tumblr, Twitter và weather.com để tweet, đăng hình ảnh và hiển thị dự báo thời tiết.

Raspberry Pi và Tumblr

Bài tập sau tạo một cuộc trò chuyện giữa Raspberry Pi và Tumblr của bạn. Với tư cách là khách hàng, Raspberry Pi của bạn sẽ yêu cầu Tumblr cung cấp các đoạn dữ liệu để nó có thể tải hình ảnh lên máy chủ từ xa của Tumblr, dẫn đến việc các hình ảnh được đăng lên tài khoản Tumblr. Để Raspberry Pi hoạt động với API rất có thể đã có sẵn một thư viện để bạn sử dụng. Đối với Tumblr thì có Pytumblr. Một ứng dụng khách được tạo trong một chương trình Python bằng cách sử dụng một hàm tích hợp được tạo trong Pytumblr. Hàm này sử dụng bốn mã ủy quyền do Tumblr tạo ra:

• chìa khóa tiêu dùng
• bí mật của người tiêu dùng
• khóa mã thông báo
• mã thông báo bí mật

Trước khi có thể sử dụng Tumblr’s API, bạn phải có bốn khóa này (tương tự như mật khẩu). Để có được chúng, hãy làm theo các bước sau:

1. Tạo một tài khoản Tumblr miễn phí và đăng nhập.
2. Đăng ký một ứng dụng. Bạn chỉ cần cung cấp thông tin cơ bản như tiêu đề (thử "My Raspberry Pi"), mô tả, email và trang web (sử dụng cái này nếu bạn chưa có). Sau khi đăng ký, bạn sẽ nhận được khóa người tiêu dùng và bí mật của người tiêu dùng. Sao chép và dán chúng ở nơi an toàn, chẳng hạn như tệp văn bản hoặc email. Để truy cập lại chúng, hãy truy cập trang tài khoản Tumblr của bạn, chọn Cài đặt trong menu Tài khoản và nhấp vào Ứng dụng.
3. Đăng nhập vào bảng điều khiển dành cho nhà phát triển bằng khóa và mã ủy quyền bí mật của bạn. Nhấp vào cho phép khi được hỏi nếu bạn muốn nó đăng thay mặt bạn.
4. Sau khi đăng nhập vào bảng điều khiển dành cho nhà phát triển, bạn sẽ thấy mã ví dụ bằng một số ngôn ngữ khác nhau. Nhấp vào tab Python và sao chép khối OAuth hoặc trong menu trên cùng, nhấp vào Hiển thị khóa để xem khóa mã thông báo và mã bí mật mã thông báo cùng với hai mã bạn đã có.

Hãy đặt những mã này hoạt động và tạo một chương trình Python để đăng animateMe-g.webp

Lần đầu tiên cài đặt Pytumblr:

sudo apt-get cập nhật

sudo pip cài đặt pytumblr

Từ thư mục chính của bạn, cd vào thư mục boof và tạo tệp Python:

cd boof

Tạo tệp của bạn bằng trình chỉnh sửa của IDLE để cắt và dán các mã ủy quyền rất dài của bạn dễ dàng hơn. Đặt cái này vào tệp testPytumblr.py của bạn, cập nhật bốn khóa và tên người dùng của bạn:

nhập pytumblr

# Xác thực qua OAuth, sao chép từ https://api.tumblr.com/console/calls/user/info client = pytumblr. TumblrRestClient ('your_consumer_key', 'your_consumer_secret', 'your_token', 'your_token_secret') client.create_photooken 'your_account_username', state = "Publish", tags = ["raspberrypi", "picamera"], data = “fotos / animateMe.gif") print ("đã tải lên")

Chương trình gắn thẻ ảnh đã tải lên cho bạn bằng "raspberrypi" và "picamera". Nếu muốn, bạn có thể xóa, thay thế hoặc thêm vào các thẻ này. Chúng được lưu trữ trong một biến được gọi là thẻ được sử dụng trong client.create_photo ().

Nhấn F5 để chạy chương trình. Sẽ có lỗi… nhưng bạn đã cài đặt Pytumblr rồi, vậy tại sao Python lại nói rằng nó không thể tìm thấy mô-đun? Điều này là do Pytumblr không hỗ trợ Python 3, nó chỉ hoạt động trên Python 2 *. Mở trình chỉnh sửa Python 2 IDLE và cắt và dán mã của bạn, ghi đè lên chương trình Python 3 rồi chạy nó. Khi nó đã tải lên GIF, "đã tải lên" sẽ được in trong cửa sổ Python shell.

Đây là phần thú vị! Truy cập trang Tumblr của bạn và xem ảnh GIF! Hoán đổi "đã xuất bản" trong chương trình của bạn thành "nháp" nếu bạn muốn tạo các bài đăng nháp.

* Sau khi lớp này được xuất bản, một người dùng github khác đã tách lớp gốc, thêm hỗ trợ cho Python 3 cho một số lệnh nhất định.

Nếu bài đăng không xuất hiện, hãy kiểm tra lại xem bạn đã nhập đúng bốn khóa và tên người dùng Tumblr của mình và kết nối internet của Pi của bạn đang hoạt động. Bạn cũng có thể chạy tập lệnh của mình từ dòng lệnh bằng Python 2 (cd vào boof thư mục của bạn nếu bạn chưa ở đó):

python testPytumblr.py

Bước 9: Chụp ảnh màn hình của Tumblr và / hoặc trang web

Tạo trang web để hiển thị ảnh-g.webp