点击此处查看最新的网赚项目教程

菜鸟学Python粉丝的第21篇投稿

阅读本文大概需要5分钟

粉丝独白

微信小程序大行其道,风口正盛,越来越多的公司和个人涌入这个风口。Python程序员如何进入小程序风口!我们开看看这篇文章,“如何快速搭建一个小程序”,也许会给你一些参考。

要点:

01

准备工作

1).一台云服务器

2).目标

我们的目标是实现一个简单的小程序,能够实现前后端对接。从http到https

开发程序员_程序开发_开发程序语言

02

小程序前端开发

1).开发环境

现在,打开你的小程序开发工具,并使用你的APPID新建一个项目。(我这里没有多余的APPID,所以先使用测试环境)

开发程序员_开发程序语言_程序开发

2).构建模版

可以先勾选“建立普通快速启动模板”来生成一个官方测试demo,如下图:

开发程序语言_开发程序员_程序开发

让我们来观察一下目录结构。app.js,app.json,app.wxss分别对应全局的方法,全局配置参数和全局样式。而在具体包下的index.js,index.wxml,index.wxss则对应相应的元素。

开发程序语言_开发程序员_程序开发

开发程序员_开发程序语言_程序开发

3).一个简单的页面已经生成了,让我们来看看效果

程序开发_开发程序语言_开发程序员

很简单,但是可以看出来「大事儿」里的内容是写死的,此时我们需要后端来提供数据。

03

服务器部分

1).安装5大件:2).配置

首先在你的/var/www/目录下创建一个测试目录,比如/var/www# mkdir test

然后使用chmod更改此目录的权限chmod 777 /var/www/test

这里讲一下chmod的规则,因为这里是测试用例,所以为了方便,直接使用777。

3).Nginx

Ubuntu下的Nginx的目录结构大致如下:

现在,我们需要进入到Nginx的配置中,改动配置文件。vim /etc/nginx/site-avalidable/default

4).Gunicorn

程序开发_开发程序语言_开发程序员

此时在测试目录下键入命令gunicorn -w 4 -b 127.0.0.1:8000 wsgi:app运行。

开发程序员_开发程序语言_程序开发

此时,访问服务器,可以看到“Hello World”已经可以正常显示了。

04

小程序后端开发

后端我们采用Python的Flask框架,外加Gunicorn+Nginx来快速搭建。首先需要一些Python的基础知识,相信大家在菜鸟学Python学了这么久,这完全不是问题。现在,让我们了解一下Flask如何使用。

1).获得对象

程序开发_开发程序语言_开发程序员

这是一个最简单的Demo。执行流程为:从flask模块获取对象app,通过路由,执行方法,返回内容。此时在浏览器访问(默认端口5000):127.0.0.1:5000/ ,可以看到国际惯例Helloworld的界面。

2).路由唯一URL

开发程序员_开发程序语言_程序开发

这个规则似乎有点拗口,但其实也不能理解。优点是:

3).模板渲染

大部分时候,在用户访问了一个URL的时候,我们都需要给他/她返回一个界面,我们当然不会用Python本身去渲染HTML,为此,Flask 配备了Jinja2模板引擎。

看完以下代码示例,相信你就能理解。

我们创建“templates”文件夹用于保存模板,Flask 会在 templates 文件夹里寻找模板。所以,如果你的应用是个模块,这个文件夹应该与模块同级;如果它是一个包,那么这个文件夹作为包的子目录:

#情况 1 模块:

/application.py

/templates

/hello.html

#情况 2 包:

/application

/__init__.py

/templates

/hello.html

4).GET和POST

请求方式不止这个两种,但是最常用的是这两种,如果对这两种不熟悉,可以先去查一下HTTP方法的资料,这里只演示在flask中的用法。

开发程序语言_开发程序员_程序开发

5).请求对象

下面我来模拟一个简单的登录操作,首先是控制器:

开发程序语言_开发程序员_程序开发

可以看到执行流程:

下面是上述用到的两个方法:

程序开发_开发程序员_开发程序语言

6).数据渲染

那么,现在如何在小程序端获取数据并显示呢?我们去简要读下小程序的官方文档。

开发程序语言_开发程序员_程序开发

请注意,小程序是纯异步方式来发送请求的。依葫芦画瓢,我们来模仿一下:

程序开发_开发程序语言_开发程序员

我们将获取的数据已经保存在”toast”这个变量中了,再去读文档,看看小程序是如何进行数据绑定的。

然后我们将之前写死的文本换成”{{toast}}”,这时再刷新,可以看到,数据已经显示了。

开发程序语言_开发程序员_程序开发

看一下效果:

开发程序员_程序开发_开发程序语言

好,经常上面这些步骤,此时,一套完整的流程已经结束,虽然实现了一个微小的功能,但麻雀虽小,五脏俱全。接下来,就是去进一步学习,去如何改造以及丰富我们的项目了。

比如稍微努力一下:

程序开发_开发程序员_开发程序语言

近期热门:

———END———
限 时 特 惠: 本站每日持续更新海量各大内部创业教程,一年会员只需98元,全站资源免费下载 点击查看详情
站 长 微 信: cai842612