发新帖本帖赏金 5.00元(功能说明)我要提问
返回列表
[开源硬件]

【Lemaker Guitar】GPIO点亮LED灯管+WEB控制,最详细教程

[复制链接]
2643|19
手机看帖
扫描二维码
随时随地手机跟帖
312976625|  楼主 | 2016-5-13 22:41 | 显示全部楼层 |阅读模式
写在前面:为什么说是最详细的教程呢,首先说明我并不是电子技术专业的,所以我会站在最小白的角度去讲解实现方法,既然是小白方式,肯定有不专业的地方,欢迎指正!
但我做的例子肯定是经过我测试通过的。

录了一段视频放上来


通过网页远程控制,视频 http://v.youku.com/v_show/id_XMTU2OTA5NzIxMg==.html

一共分为四个方面操作:
1,在Guitar开发板上搭建软件环境,安装Git和WiringLMK
2,设计硬件电路
3,用C语言写一个程序,驱动LED的亮和灭
4,通过PHP实现在网页上控制LED灯(非必须)

做实验所需准备的材料:
1,Lemaker Guitar 开发板一块
2,面包板一块
3,1K欧电阻一个
4,LED灯管 5mm 一个
5,杜邦线,公对母2根,公对公1根


以下所有的操作,除电路设计外,软件安装和配置都是在Lemaker Guitar开发板上的Linux系统上进行

【软件安装】
Git
sudo apt-get install git
WiringLMK
git clone https: //github.com/LeMaker/WiringLMK.git 
cd WiringLMK
chmod +x ./build
sudo ./build
注意请把 git clone https: //github.com/LeMaker/WiringLMK.git这句中的http:后边的一个空格去掉,因为我当前的权限不能发URL,太不方便了,@小喇叭

【设计硬件电路】

面包板用法:面包板旁边竖着的两排接vcc和gnd是竖向导通,中间的横排插口是横向导通的。
44c9db5c4d06e1624857d&690.jpg


1.jpg

LED灯管的正负极识别
4.jpg

串联一个1K欧的电阻,和LED的正极引脚相连
2.jpg

将LED的负极引脚接地
3.jpg

开发板上电后
5.jpg

再来一张GPIO的引脚图,我标记了我接线的IO口
Image008(11-05-13-42-56)副本.jpg
到这里我们的电路就接好了,接下来就是写程序驱动11号IO口高低电平的切换输出。



【程序开发】
新建并编辑gpio.c文件,写入下面的程序源码到gpio.c文件中。
#include <stdio.h>
#include <wiringPi.h>

//程序默认操作引脚编号为11号的IO口的电平
#define PIN 11

int main(int argc,char *argv[])
{
        int pin;

        //如果用户没有输入参数
        if(argc == 1)
        {
                //选用默认的PIN脚
                pin = PIN;
        }
        else
        {
                //选用用户指定的PIN脚
                pin = atoi(argv[1]);
        }

        
        /**
           初始化WiringLMK库,官方提供了4种初始化的方式,每种方式对引脚的定义不同
           本例为了简单,选用了按引脚的物理排列顺序访问的方式进行初始化
           int wiringPiSetup (void) ;
           int wiringPiSetupGpio (void) ;
           int wiringPiSetupPhys (void) ; 与物理管脚号一致
           int wiringPiSetupSys (void) ;
           其他初始化方式的说明请查看wiki文档,这里不在说明
        */
        if(wiringPiSetupPhys() == -1)
        {
                puts("wiringPi setup error");
                return -1;
        }
        puts("wiringPi setup ok");
        

        //读取pin脚的电平状态
        int pinState = digitalRead(pin);
        if(pinState)
        {
                //如果当前状态是高电平
                //将pin脚设置为低电平
                pinMode(pin,OUTPUT);
                digitalWrite(pin,LOW);
                printf("PIN %d LOW\n",pin);
        }
        else
        {
                //如果当前状态是低电平
                //将pin脚设置未低电平
                pinMode(pin,OUTPUT);
                digitalWrite(pin,HIGH);
                printf("PIN %d HIGH",pin);
        }
        return 0;
}
编译源代码,生成二进制程序
cd到gpio.c源文件所在的目录
gcc -o gpio -lwiringPi gpio.c
解释:
-o 指定编译后生成的可执行程序的文件路径,只写文件名就生成在当前目录下
-lwiringPi 因为程序使用了wiringPi的库,这个参数是指定连接程序的时候和wiringPi库进行连接,(WiringLMK本身就是在wiringPi的基础上实现的)
gpio.c  要参与编译的源文件
编译后生成gpio可执行程序,这个时候就可以运行该程序看看LED是否亮起来。

需要使用系统最高权限执行
sudo ./gpio
或者可以在程序后面给参数,指定要操作的IO口(注意不要选接地(GND)和VCC的引脚编号)
sudo ./gpio 11

当11号IO口为高电平时,LED灯管是发光状态。(前面的图是提前拍的白色的LED,这张图是一个蓝色的LED,都是一样的)
6.jpg

到目前为止LED已经能够驱动了,下面通过PHP程序调用我们刚刚写好的程序,实现在网页上控制。


【PHP网页控制】


安装Apache2
sudo apt-get install apache2
安装PHP5
sudo apt-get install php5

在/var/www/html目录下创建test.php
cd /var/www/html
sudo vim test.php
test.php为测试php环境的文件,输入以下内容
<?php
phpinfo();
?>
打开浏览器 输入http: // 192.168.0.102 / test.php(注意去空格)(192.168.0.102是我开发板的IP
如果看到下图表示php的环境已经搭建好,再继续下面的步骤(注意,下图是我在公司截的是php7.0的环境,咱们安装的是php5.x,只要能看见这个信息页面就已经表示php已经和apache集成好了)
phpinfo.png

需要的程序:gpio(编译好的c程序) gpio.php(php代码)
复制gpio可执行程序和gpio.php都复制到站点根目录
编辑gpio.php,输入以下代码
<?php

/**
* 判断客户端的请求是否是POST方式
*/
function isPost(){
    return $_SERVER['REQUEST_METHOD'] == 'POST';
}


if(isPost()){
    $pin = array_key_exists('pin',$_POST) && !empty($_POST['pin']) ? $_POST['pin'] : '';
    $pin = (int)$pin;
    if($pin == 0){
        die('pin must be a number');
    }
   //这一行需要编辑 /etc/sudoers 配置文件,下面有说明,visudo命令就是直接编辑该文件的
   $output = shell_exec('sudo ./gpio');
}


?>

<!DOCTYPE html>
<html>
<head lang="en">
    <meta charset="UTF-8">
    <title>GPIO Control</title>
    <meta http-equiv="pragma" content="no-cache">
    <meta http-equiv="cache-control" content="no-cache">
    <meta http-equiv="expires" content="0">
    <meta name="viewport" content="initial-scale=1, minimum-scale=1, maximum-scale=1, user-scalable=0">
    <!-- Bootstrap -->
    <link rel="stylesheet" href="http: //cdn.bootcss.com/bootstrap/3.3.5/css/bootstrap.min.css">
</head>
<body>
<div class="container">
    <div style="padding:10px;">
        <form action="gpio.php" class="form-inline" method="post">
            <div class="form-group">
                <div class="input-group">
                    <div class="input-group-addon">PIN</div>
                    <input type="text" class="form-control" id="pin" name="pin" placeholder="请输入有效的PIN引脚号" value="<?=isset($pin) ? $pin : '' ?>">
                </div>
            </div>
            <button type="submit" class="btn btn-primary">提交</button>
        </form>
    </div>
    <?php if(isset($output)){ ?>
    <div class="alert alert-success" role="alert">
        <strong>程序输出结果:</strong>
        <br/>
        <?=$output ?>
    </div>
    <?php } ?>
</div>
</body>
</html>
注意 http: //cdn.bootcss.com/bootstrap/3.3.5/css/bootstrap.min.css,老规矩,去掉http:后面的一个空格

重要的一步

因为wiringPi的程序需要用sudo或者root用户去运行,但是当前PHP的web服务器是用www-data用户运行的,当我们在调用shell_exec('sudo ./gpio')函数时,是没有任何反应的。解决办法:
输入命令
sudo -s
visudo
会出现一个编辑配置文件的页面,
在 root    ALL=(ALL:ALL) ALL 的下面,另起一行,写上 www-data ALL=(ALL:ALL) ALL (表示把www-data用户加入sudo,www-data就支持sudo命令了)
在 %sudo   ALL=(ALL:ALL) ALL 的下面,另起一行,写上 %www-data ALL=(ALL:ALL) NOPASSWD: ALL (表示www-data用户组中的所有sudo操作不需要输入密码)
Ctrl+x,提示保存,输入y,然后回车
上面的两条配置很重要
再执行一条命令
sudo gpasswd -a www-data www-data
之后,www-data 这个用户在执行sudo命令的时候就不需要输入密码了。
visudo.jpg
Lemaker Guitar 的 IP地址:192.168.0.102
端口:80打开手机浏览器访问 http: // 192。168。0。102/gpio。php (惯例,请自行脑补url)即可打开程序。
428799071876249561.jpg

















打赏榜单

21ic小喇叭 打赏了 5.00 元 2016-05-17

评分
参与人数 1威望 +1 收起 理由
kqh1120 + 1 很给力!

相关帖子

312976625|  楼主 | 2016-5-13 22:49 | 显示全部楼层
自己顶一下

使用特权

评论回复
michael_llh| | 2016-5-13 23:06 | 显示全部楼层
哇,这个真心赞吖!!!感谢分享!对得起标题

使用特权

评论回复
312976625|  楼主 | 2016-5-13 23:15 | 显示全部楼层
michael_llh 发表于 2016-5-13 23:06
哇,这个真心赞吖!!!感谢分享!对得起标题

谢谢支持,刚刚咯好读了一遍,发现有些地方写的还不够仔细,明天再改改,先在已经躺下了

使用特权

评论回复
312976625|  楼主 | 2016-5-14 08:12 | 显示全部楼层
今天补充上搭建 Apache+PHP 的方法吧。

使用特权

评论回复
2223445830| | 2016-5-14 09:40 | 显示全部楼层
顶!!!

使用特权

评论回复
michael_llh| | 2016-5-14 11:05 | 显示全部楼层
312976625 发表于 2016-5-13 23:15
谢谢支持,刚刚咯好读了一遍,发现有些地方写的还不够仔细,明天再改改,先在已经躺下了 ...

哈哈,很用心吖,加油加油!

使用特权

评论回复
kqh1120| | 2016-5-14 11:26 | 显示全部楼层
这个很不错啊。。收藏了

使用特权

评论回复
sjqlwy| | 2016-5-14 12:38 | 显示全部楼层
这个不错~

使用特权

评论回复
312976625|  楼主 | 2016-5-14 14:56 | 显示全部楼层

谢谢支持

使用特权

评论回复
312976625|  楼主 | 2016-5-14 14:58 | 显示全部楼层

谢谢支持

使用特权

评论回复
michael_llh| | 2016-5-14 19:27 | 显示全部楼层
突然想起来,这样有一个问题,只能是内网访问

使用特权

评论回复
312976625|  楼主 | 2016-5-14 20:29 | 显示全部楼层
michael_llh 发表于 2016-5-14 19:27
突然想起来,这样有一个问题,只能是内网访问

帖子上用的是的是内网,想外网的话,搭配ngrok使用。

使用特权

评论回复
312976625|  楼主 | 2016-5-14 20:31 | 显示全部楼层
michael_llh 发表于 2016-5-14 19:27
突然想起来,这样有一个问题,只能是内网访问

具体的步骤是:apache建立虚拟主机,绑定一个域名,该域名是指向ngrok反向端口映射的域名。详细操作你可以百度下。我成功过,也一直在用这个办法。国内ngrok网站qydev.com

使用特权

评论回复
michael_llh| | 2016-5-16 14:27 | 显示全部楼层
312976625 发表于 2016-5-14 20:31
具体的步骤是:apache建立虚拟主机,绑定一个域名,该域名是指向ngrok反向端口映射的域名。详细操作你可 ...

好的,谢谢你咯!

使用特权

评论回复
312976625|  楼主 | 2016-5-16 15:01 | 显示全部楼层
michael_llh 发表于 2016-5-16 14:27
好的,谢谢你咯!

不客气,多提提意见。

使用特权

评论回复
21ic小喇叭| | 2016-5-17 08:46 | 显示全部楼层
很走心的测评

使用特权

评论回复
tdsxlw| | 2016-5-23 19:40 | 显示全部楼层
来学习一下。。。。。。。。。。。

使用特权

评论回复
312976625|  楼主 | 2016-5-23 22:02 | 显示全部楼层
tdsxlw 发表于 2016-5-23 19:40
来学习一下。。。。。。。。。。。

请指教

使用特权

评论回复
发新帖 本帖赏金 5.00元(功能说明)我要提问
您需要登录后才可以回帖 登录 | 注册

本版积分规则

8

主题

49

帖子

2

粉丝