appweb的开发步骤简介

来源:互联网 发布:英雄无敌5 知乎 编辑:程序博客网 时间:2024/05/11 05:06

之前的博客上讲了开发板上移植appweb的过程,这篇博客就记录一下如何开发一个典型的基于appweb的mvc架构的网站

1.前言

1.1环境参数

开发板:mini2440  64MB内存 256MB Flash

PC系统:X86 ubuntu10.04  gcc:4.4.3

交叉编译器:gcc  4.4.3

appweb版本:5.0.0-rc1

1.2简介

ESP全称是Embedded Server Page,和jsp(Java Server Pages)很相似,前者支持将C语言嵌套到html中后者支持将Java语言嵌套到html中来实现动态网页。下面摘抄一点官网上的原话:

ESP is the blazing fast "C" language web framework that works at thought-speed.ESP is not a traditional low-level environment. It is a powerhouse MVC framework in a tiny footprint with most things you'd expect from an enterprise web framework including: MVC, scaffolds, templates, WebSockets, integrated databases, database migrations and more.

ESP的document:https://embedthis.com/esp/doc/index.html

AppWeb的document:https://embedthis.com/appweb/doc/index.html

其他工具的网址:https://embedthis.com/products.html

2.一个简单的MVC登录

由于开发的是嵌入式web,每改动一点内容就要重新编译然后再下载到开发板中测试,很是麻烦,所以一般采取的方法是先在PC上开发好,测试好后然后移植到开发板上。所以我们先要在PC上安装AppWeb以及其它工具,然后开发一个web应用,最后移植到开发板上。

2.1向PC上安装AppWeb

下载源码:

去网址:http://appwebserver.org/downloads/appweb/download.esp下载appweb的源码,我下载的版本是appweb5.0
编译:
(i)解压源码文件
(ii)把文件appweb-linux-default-me.h中的#define ME_COMPILER_HAS_SYNC64 1注释掉,不然会报错“undefined reference to `__sync_add_and_fetch_8'collect2: ld returned 1 exit status”
//#define ME_COMPILER_HAS_SYNC64 1
(iii)make
make -f projects/appweb-linux-default.mk

编译完后会在../appweb-5.0.0-rc1/linux-x86-default文件下生成目标文件将

 (iiii)安装

make –f project/appweb-linux-default.mk install

2.2利用appweb提供的工具建立MVC模板

参考网址:https://embedthis.com/esp/doc/guide/esp/start/mvc-tour.html

这个程序很简单,就是输入用户名和密码,如果用户名是“abc”密码是“123”那么页面就跳到loginOK页面,如果不是那么页面就跳转到loginError页面。

目的是熟悉流程和简单地理解appweb,里面没有涉及到数据库,所以MVC中的M就没有很好地体现,主要是V和C,如果要完整的实现可以认真地阅读上面的参考网址。

2.2.1模板生成

(1)$ mkdirmylogin

(2)$cd mylogin

(3)$esp install esp-html-mvc

执行完(3)后会在文件夹里面出现:client  layouts  package.json  paks这几个文件或是文件夹,将package.json中的auth中的内容type删除,不然会报错:esp: Error: Cannot find auth type app

(4)$esp generate controller login
执行(4)的目的是产生controller,执行玩了之后就会发现文件夹里面多了个文件夹controllers,里面已经自动生成了login.c

2.2.2 修改/编写View

(1)修改mylogin/client/index.esp页面为用户名密码形式,这里一定要加这句话<% inputSecurityToken(); %>不然的话会报错误:

Access Error: 401 -- Unauthorized
Security token is stale. Please reload page.

[html] view plaincopy在CODE上查看代码片派生到我的代码片
  1. <html>  
  2. <head>  
  3. <title>MyLogin</title>  
  4. </head>  
  5.   
  6. <body>  
  7.     <h1>MyLogin</h1>  
  8.     <form action=/do/login/check method=POST>  
  9.         <table>  
  10.         <tr>  
  11.             <td>Name:</td><td><input type=text name=name size=50 value=""></td>  
  12.         </tr>  
  13.         <tr>  
  14.             <td>Pwd:</td><td><input type=text name=pwd size=50 value=""></td>  
  15.         </tr>  
  16.         <tr>  
  17.             <td align="CENTER">   
  18.                 <input type=submit name=login value="Login">   
  19.                 <% inputSecurityToken();%>  
  20.             </td>  
  21.         </tr>  
  22.         </table>  
  23.     </form>  
  24. </body>  
  25. </html>  

(2)在mylogin/client文件夹下建立app/login文件夹,在里面新建两个esp页面,login-ok.esp和login-error.esp

login-ok.esp:

[html] view plaincopy在CODE上查看代码片派生到我的代码片
  1. <html>  
  2. <head>  
  3. <title>OK</title>  
  4. </head>  
  5.   
  6. <body>  
  7.     <h1>login OK</h1>  
  8. </body>  
  9. </html>  

login-error.esp:

[html] view plaincopy在CODE上查看代码片派生到我的代码片
  1. <html>  
  2. <head>  
  3. <title>error</title>  
  4. </head>  
  5.   
  6. <body>  
  7.     <h1>login Error</h1>  
  8. </body>  
  9. </html>  
2.2.3 修改/编写Controller
这里主要是修改controller文件夹下的login.c,这里的action的命名是这样的:比如./do/login/check的uri对应的就是login-cmd-check

[cpp] view plaincopy在CODE上查看代码片派生到我的代码片
  1. /* 
  2.     login Controller for esp-html-mvc (esp-html-mvc) 
  3.  */  
  4. #include "esp.h"  
  5. static void checkLogin() {  
  6.     cchar *name = param("name");  
  7.     cchar *pwd = param("pwd");  
  8.     if(smatch("abc",name) && smatch("123",pwd))  
  9.     {  
  10.         renderView("login/login-ok");  
  11.     }else{  
  12.         renderView("login/login-error");    
  13.     }        
  14. }  
  15. static void common(HttpConn *conn) {  
  16. }  
  17.   
  18. /* 
  19.     Dynamic module initialization 
  20.  */  
  21. ESP_EXPORT int esp_controller_mylogin_login(HttpRoute *route, MprModule *module) {  
  22.     espDefineBase(route, common);  
  23.     espDefineAction(route, "login-cmd-check", checkLogin);  
  24.     return 0;  
  25. }  

2.2.3编译

$esp compile

如果没有错误的话,机会生成cache文件,里面的.so文件就是appweb要加载的文件,这里我们可以看到,esp会被“翻译”成c文件,就像jsp会被“翻译”成java文件(servlet)一样

2.2.4配置文件

为了节省空间我把不必要的注释和其它的东西都删除了,如果想看完整版(里面有很多的注释,建议看一下),就去看appweb-5.0.0-rc1/src/server/sample.conf

需要注意的是以下几个:

(1)Listen 4000 监听端口

(2)Documents /home/jxm 这个表示你的web应用所在的目录,比如我的文件夹mylogin就在/home/jxm文件夹下

(3)EspRoute name="login" methods="GET,POST" prefix="^/{controller}(~/{action}~)" target="${controller}-${action}" source="${controller}.c" 这个文件就是配置action的语句,只需要修改name就行,其它的用模板里面的就行

[html] view plaincopy在CODE上查看代码片派生到我的代码片
  1. ErrorLog "error.log" size=10MB level=2 backup=5 anew stamp=1hr  
  2. Listen 4000  
  3.   
  4. Documents /home/jxm  
  5.   
  6. AddHandler fileHandler html gif jpeg jpg png pdf ico css js txt ""  
  7.   
  8.   
  9. <if ESP_MODULE>  
  10.     LoadModule espHandler libmod_esp  
  11.     AddHandler espHandler esp  
  12.     EspUpdate off  
  13.   
  14.     EspKeepSource on  
  15.   
  16.     EspApp name=mylogin  
  17.   
  18.    EspRoute name="login" methods="GET,POST" prefix="^/{controller}(~/{action}~)" target="${controller}-${action}" source="${controller}.c"  
  19.   
  20. <else>  
  21.     AddHandler errorHandler esp  
  22. </if>  
  23.   
  24.   
  25. Cache 1day   
  26.   
  27. SessionTimeout 30mins  
  28.   
  29. RequestParseTimeout 5sec  
  30.   
  31. RequestTimeout 10mins  
  32.   
  33. InactivityTimeout 1min  
  34.   
  35. ExitTimeout 30secs  
  36.   
  37.   
  38. LimitWorkers 4  
  39.   
  40. MemoryPolicy restart  
  41.   
  42.   
  43. LimitBuffer 32K  
  44.   
  45. LimitMemory 100MB  
  46.   
  47. LimitCache 10MB  
  48.   
  49. LimitCacheItem 200K  
  50.   
  51.   
  52. LimitClients 20  
  53.   
  54. LimitChunk 64K  
  55.   
  56. LimitConnections 50  
  57.   
  58. LimitFiles 0  
  59.   
  60. LimitRequestsPerClient 20  
  61.   
  62. LimitKeepAlive 200  
  63.     
  64. LimitRequestBody 100K  
  65.    
  66. LimitRequestForm 32K  
  67.    
  68. LimitRequestHeader 32K  
  69.    
  70. LimitRequestHeaderLines 64  
  71.     
  72. LimitResponseBody 2GB  
  73.   
  74. LimitSessions 100  
  75.   
  76. LimitUpload 1GB  
  77.   
  78. LimitUri 8K  


2.2.5启动

$appweb --config sample.conf
2.2.6访问

向浏览器中输入网址:127.0.0.1:4000就会出现登录界面,如果要去掉最上面的“Home”banner,需要将文件夹mylogin/layouts中的default.esp文件删除,然后重新编译再运行


2.2移植到开发版

2.2.1 交叉编译

在编译前建议将cache文件夹删除

$export CC=arm-linux-gcc

$esp --platform../appweb-5.0.0-r1/linux-arm-release(这个路径是你之前交叉编译appweb产生的目录) compile

然后将整个mylogin文件拷贝到开发板中,这里需要注意的是,由于目录变化所以在sample.conf 中的Document的目录也要变


转载:http://blog.csdn.net/xiaominthere/article/details/38756421

0 0
原创粉丝点击