appweb的开发步骤简介

之前的博客上讲了开发板上移植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
iiimake
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>
<head>
<title>MyLogin</title>
</head>

<body>
    <h1>MyLogin</h1>
    <form action=/do/login/check method=POST>
        <table>
        <tr>
            <td>Name:</td><td><input type=text name=name size=50 value=""></td>
        </tr>
        <tr>
            <td>Pwd:</td><td><input type=text name=pwd size=50 value=""></td>
        </tr>
        <tr>
            <td align="CENTER"> 
                <input type=submit name=login value="Login"> 
                <% inputSecurityToken();%>
            </td>
        </tr>
        </table>
    </form>
</body>
</html>

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

login-ok.esp:

<html>
<head>
<title>OK</title>
</head>

<body>
    <h1>login OK</h1>
</body>
</html>

login-error.esp:

<html>
<head>
<title>error</title>
</head>

<body>
    <h1>login Error</h1>
</body>
</html>
2.2.3 修改/编写Controller
这里主要是修改controller文件夹下的login.c,这里 的action的命名是这样的:比如./do/login/check的uri对应的就是login-cmd-check

/*
    login Controller for esp-html-mvc (esp-html-mvc)
 */
#include "esp.h"
static void checkLogin() {
    cchar *name = param("name");
    cchar *pwd = param("pwd");
    if(smatch("abc",name) && smatch("123",pwd))
    {
        renderView("login/login-ok");
    }else{
        renderView("login/login-error");  
    }      
}
static void common(HttpConn *conn) {
}

/*
    Dynamic module initialization
 */
ESP_EXPORT int esp_controller_mylogin_login(HttpRoute *route, MprModule *module) {
    espDefineBase(route, common);
    espDefineAction(route, "login-cmd-check", checkLogin);
    return 0;
}

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就行,其它的用模板里面的就行

ErrorLog "error.log" size=10MB level=2 backup=5 anew stamp=1hr
Listen 4000

Documents /home/jxm

AddHandler fileHandler html gif jpeg jpg png pdf ico css js txt ""


<if ESP_MODULE>
    LoadModule espHandler libmod_esp
    AddHandler espHandler esp
    EspUpdate off

    EspKeepSource on

    EspApp name=mylogin

   EspRoute name="login" methods="GET,POST" prefix="^/{controller}(~/{action}~)" target="${controller}-${action}" source="${controller}.c"

<else>
    AddHandler errorHandler esp
</if>


Cache 1day 

SessionTimeout 30mins

RequestParseTimeout 5sec

RequestTimeout 10mins

InactivityTimeout 1min

ExitTimeout 30secs


LimitWorkers 4

MemoryPolicy restart


LimitBuffer 32K

LimitMemory 100MB

LimitCache 10MB

LimitCacheItem 200K


LimitClients 20

LimitChunk 64K

LimitConnections 50

LimitFiles 0

LimitRequestsPerClient 20

LimitKeepAlive 200
  
LimitRequestBody 100K
 
LimitRequestForm 32K
 
LimitRequestHeader 32K
 
LimitRequestHeaderLines 64
  
LimitResponseBody 2GB

LimitSessions 100

LimitUpload 1GB

LimitUri 8K


2.2.5启动

$appweb --config sample.conf
2.2.6访问

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

appweb的开发步骤简介_第1张图片
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的目录也要变

你可能感兴趣的:(appweb)