21ic电子技术开发论坛 › 开源创客 › DIY讨论区 › 【Lemaker Guitar】GPIO点亮LED灯管+WEB控制，最详细教 ...
返回列表 发新帖我要提问本帖赏金: 5.00元(功能说明)

[开源硬件] 【Lemaker Guitar】GPIO点亮LED灯管+WEB控制，最详细教程

[复制链接]
 楼主| 312976625 发表于 2016-5-13 22:41 | 显示全部楼层 |阅读模式
LEM, GPIO, LED灯管, GUI, 控制
写在前面：为什么说是最详细的教程呢，首先说明我并不是电子技术专业的，所以我会站在最小白的角度去讲解实现方法，既然是小白方式，肯定有不专业的地方，欢迎指正！
但我做的例子肯定是经过我测试通过的。

录了一段视频放上来


通过网页远程控制，视频 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
复制
  1. sudo apt-get install git
WiringLMK
复制
  1. git clone https: //github.com/LeMaker/WiringLMK.git 
    

  2. cd WiringLMK
    

  3. chmod +x ./build
    

  4. sudo ./build
注意请把 git clone https: //github.com/LeMaker/WiringLMK.git这句中的http:后边的一个空格去掉，因为我当前的权限不能发URL，太不方便了，@小喇叭

【设计硬件电路】

面包板用法：面包板旁边竖着的两排接vcc和gnd是竖向导通，中间的横排插口是横向导通的。





LED灯管的正负极识别


串联一个1K欧的电阻，和LED的正极引脚相连


将LED的负极引脚接地


开发板上电后


再来一张GPIO的引脚图，我标记了我接线的IO口

到这里我们的电路就接好了，接下来就是写程序驱动11号IO口高低电平的切换输出。



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

  2. #include <wiringPi.h>
    


  3. 

  4. //程序默认操作引脚编号为11号的IO口的电平
    

  5. #define PIN 11
    


  6. 

  7. int main(int argc,char *argv[])
    

  8. {
    

  9.         int pin;
    


  10. 

  11.         //如果用户没有输入参数
    

  12.         if(argc == 1)
    

  13.         {
    

  14.                 //选用默认的PIN脚
    

  15.                 pin = PIN;
    

  16.         }
    

  17.         else
    

  18.         {
    

  19.                 //选用用户指定的PIN脚
    

  20.                 pin = atoi(argv[1]);
    

  21.         }
    


  22. 

  23.         
    

  24.         /**
    

  25.            初始化WiringLMK库，官方提供了4种初始化的方式，每种方式对引脚的定义不同
    

  26.            本例为了简单，选用了按引脚的物理排列顺序访问的方式进行初始化
    

  27.            int wiringPiSetup (void) ;
    

  28.            int wiringPiSetupGpio (void) ;
    

  29.            int wiringPiSetupPhys (void) ; 与物理管脚号一致
    

  30.            int wiringPiSetupSys (void) ;
    

  31.            其他初始化方式的说明请查看wiki文档，这里不在说明
    

  32.         */
    

  33.         if(wiringPiSetupPhys() == -1)
    

  34.         {
    

  35.                 puts("wiringPi setup error");
    

  36.                 return -1;
    

  37.         }
    

  38.         puts("wiringPi setup ok");
    

  39.         
    


  40. 

  41.         //读取pin脚的电平状态
    

  42.         int pinState = digitalRead(pin);
    

  43.         if(pinState)
    

  44.         {
    

  45.                 //如果当前状态是高电平
    

  46.                 //将pin脚设置为低电平
    

  47.                 pinMode(pin,OUTPUT);
    

  48.                 digitalWrite(pin,LOW);
    

  49.                 printf("PIN %d LOW\n",pin);
    

  50.         }
    

  51.         else
    

  52.         {
    

  53.                 //如果当前状态是低电平
    

  54.                 //将pin脚设置未低电平
    

  55.                 pinMode(pin,OUTPUT);
    

  56.                 digitalWrite(pin,HIGH);
    

  57.                 printf("PIN %d HIGH",pin);
    

  58.         }
    

  59.         return 0;
    

  60. }
编译源代码，生成二进制程序
cd到gpio.c源文件所在的目录
gcc -o gpio -lwiringPi gpio.c
解释：
-o 指定编译后生成的可执行程序的文件路径，只写文件名就生成在当前目录下
-lwiringPi 因为程序使用了wiringPi的库，这个参数是指定连接程序的时候和wiringPi库进行连接，(WiringLMK本身就是在wiringPi的基础上实现的)
gpio.c  要参与编译的源文件
编译后生成gpio可执行程序，这个时候就可以运行该程序看看LED是否亮起来。

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

当11号IO口为高电平时，LED灯管是发光状态。（前面的图是提前拍的白色的LED，这张图是一个蓝色的LED，都是一样的）


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


【PHP网页控制】


安装Apache2
复制
  1. sudo apt-get install apache2
安装PHP5
复制
  1. sudo apt-get install php5

在/var/www/html目录下创建test.php
复制
  1. cd /var/www/html
    

  2. sudo vim test.php
test.php为测试php环境的文件，输入以下内容
复制
  1. <?php
    

  2. phpinfo();
    

  3. ?>
打开浏览器 输入http: // 192.168.0.102 / test.php(注意去空格)（192.168.0.102是我开发板的IP）
如果看到下图表示php的环境已经搭建好，再继续下面的步骤(注意，下图是我在公司截的是php7.0的环境，咱们安装的是php5.x，只要能看见这个信息页面就已经表示php已经和apache集成好了)


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


  2. 

  3. /**
    

  4.  * 判断客户端的请求是否是POST方式
    

  5.  */
    

  6. function isPost(){
    

  7.     return $_SERVER['REQUEST_METHOD'] == 'POST';
    

  8. }
    


  9. 


  10. 

  11. if(isPost()){
    

  12.     $pin = array_key_exists('pin',$_POST) && !empty($_POST['pin']) ? $_POST['pin'] : '';
    

  13.     $pin = (int)$pin;
    

  14.     if($pin == 0){
    

  15.         die('pin must be a number');
    

  16.     }
    

  17.    //这一行需要编辑 /etc/sudoers 配置文件，下面有说明，visudo命令就是直接编辑该文件的
    

  18.    $output = shell_exec('sudo ./gpio');
    

  19. }
    


  20. 


  21. 

  22. ?>
    


  23. 

  24. <!DOCTYPE html>
    

  25. <html>
    

  26. <head lang="en">
    

  27.     <meta charset="UTF-8">
    

  28.     <title>GPIO Control</title>
    

  29.     <meta http-equiv="pragma" content="no-cache">
    

  30.     <meta http-equiv="cache-control" content="no-cache">
    

  31.     <meta http-equiv="expires" content="0">
    

  32.     <meta name="viewport" content="initial-scale=1, minimum-scale=1, maximum-scale=1, user-scalable=0">
    

  33.     <!-- Bootstrap -->
    

  34.     <link rel="stylesheet" href="http: //cdn.bootcss.com/bootstrap/3.3.5/css/bootstrap.min.css">
    

  35. </head>
    

  36. <body>
    

  37. <div class="container">
    

  38.     <div style="padding:10px;">
    

  39.         <form action="gpio.php" class="form-inline" method="post">
    

  40.             <div class="form-group">
    

  41.                 <div class="input-group">
    

  42.                     <div class="input-group-addon">PIN</div>
    

  43.                     <input type="text" class="form-control" id="pin" name="pin" placeholder="请输入有效的PIN引脚号" value="<?=isset($pin) ? $pin : '' ?>">
    

  44.                 </div>
    

  45.             </div>
    

  46.             <button type="submit" class="btn btn-primary">提交</button>
    

  47.         </form>
    

  48.     </div>
    

  49.     <?php if(isset($output)){ ?>
    

  50.     <div class="alert alert-success" role="alert">
    

  51.         <strong>程序输出结果：</strong>
    

  52.         <br/>
    

  53.         <?=$output ?>
    

  54.     </div>
    

  55.     <?php } ?>
    

  56. </div>
    

  57. </body>
    

  58. </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')函数时，是没有任何反应的。解决办法：
输入命令
复制
  1. sudo -s
    

  2. 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，然后回车
上面的两条配置很重要
再执行一条命令
复制
  1. sudo gpasswd -a www-data www-data
之后，www-data 这个用户在执行sudo命令的时候就不需要输入密码了。

Lemaker Guitar 的 IP地址：192.168.0.102
端口：80打开手机浏览器访问 http: // 192。168。0。102/gpio。php (惯例，请自行脑补url)即可打开程序。


















本帖子中包含更多资源

您需要 登录 才可以下载或查看，没有账号？注册

×
回复 赏

举报

打赏榜单

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 | 显示全部楼层
sjqlwy 发表于 2016-5-14 12:38
这个不错~

谢谢支持
回复 赏

举报

 楼主| 312976625 发表于 2016-5-14 14:58 | 显示全部楼层
sjqlwy 发表于 2016-5-14 12:38
这个不错~

谢谢支持
回复 赏

举报

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
来学习一下。。。。。。。。。。。

请指教
回复 赏

举报

返回列表 发新帖
高级模式
B Color Image Link Quote Code Smilies
您需要登录后才可以回帖 登录 | 注册

本版积分规则

312976625

8

主题

49

帖子

2

粉丝
快速回复 返回顶部 返回列表