精华内容
下载资源
问答
  • 共享单车小程序源码

    2019-03-01 15:35:03
    共享单车小程序案例 小程序开发案例
  • 共享单车小程序.zip

    2020-07-10 12:04:35
    微信小程序开发共享单车,使用springboot开发服务器,以及使用redis与mongodb数据库进行数据管理
  • 共享单车小程序需求规格说明书

    千次阅读 2020-03-29 15:47:16
    共享单车小程序需求规格说明书 目录 概述 1 1.1编写目的 1 1.2项目背景 1 1.3定义和缩写词 2 任务概述 2 2.1目标 2 2.2运行环境 2 2.3条件与限制 2 3.功能需求 2 3.1功能划分 2 3.2功能描述 3 4.性能需求 3 4.1时间...

    共享单车小程序需求规格说明书

    目录

    1. 概述 1
      1.1编写目的 1
      1.2项目背景 1
      1.3定义和缩写词 2
    2. 任务概述 2
      2.1目标 2
      2.2运行环境 2
      2.3条件与限制 2
      3.功能需求 2
      3.1功能划分 2
      3.2功能描述 3
      4.性能需求 3
      4.1时间特性 3
      4.2适应性 3
      5.运行需求 3
      5.1用户界面 3
      5.2硬件接口 3
      5.3软件接口 3
      5.4故障处理 3
      6.其他需求 4

    1.概述

    1.1编写目的
    该项目将开发一款基于微信平台的共享单车小程序。本需求规格说明书对该小程序进行简单的分析,给出了系统的数据流图。程序主要针对所有使用微信的用户。编写此需求规格说明书旨在能全方位的了解用户需求,与用户及时沟通,从而开发出一款无论是外观界面还是功能性能方面都能让用户满意的共享单车小程序。
    1.2项目背景
    随着共享经济的出现,提出了共享单车这个新概念。它是指企业与政府合作,在校园、地铁站点、公交站点、居民区、商业区、公共服务区等提供自行车单车共享的服务。与以往单车使用需下载app相比,基于微信平台的共享单车小程序对于用户来说更加方便快捷。我们将在原有功能的基础上进一步简化使用操作,把主要功能放在界面,次要功能进行隐藏,即用户打开小程序时只显示单车租赁和费用等信息,而查看账户管理,行车记录等次要业务需另下载app完成。
    1.3定义和缩写词
    缩写词:ETObike——易操作共享单车小程序

    2.任务概述

    2.1目标
    ETObike程序目标是借助微信平台简化自行车租赁系统的管理,把主要功能放大,次要功能隐藏,让用户使用操作起来更得心应手。该程序最终用户为拥有微信账号的用户,因而省去了注册功能。ETObike的目标还有:
    1.减少人力资源的使用和降低管理费用;
    2.提高信息准确度和可靠性;
    3.建立高效的信息传输和服务平台,提高信息处理速度和利用率; 
    4.界面设计精美、友好、快捷,人性化设计。
    2.2运行环境
    开发环境:Windows10 x86、JDK1.8.0
    开发语言:Java
    开发软件:MySQL、MyEclipse等
    客户端系统:安卓主流操作系统、ios7.1及以上
    2.3条件与限制
    开发与运行的硬件平台要能够支持多用户并发访问。本软件在开发的过程中,分为技术实现与软件工程两大部分,若技术问题出现故障或疑难问题无法解决,程序开发就会出现偏差,影响进度。若是工程方面出现问题,对功能描述不清,会对程序的完整性和准确性产生影响。

    3.功能需求

    3.1功能划分
    该程序主要实现两个功能:
    1.用户授权登录功能
    2.用户用车功能
    3.2功能描述
    用户授权登录功能希望通过微信平台授权直接登录,首次登录需提交手机号进行验证。
    用户用车功能包括立即用车、费用支付、报修投诉等子功能。其中立即用车功能希望用户在打开程序扫码或输入车辆编号后,如果车辆状态为可用状态,即没有故障,则车辆开始按照时间进行计费,如果发现故障,可以进行报修,如果车辆系统标定是故障车辆,则进行相应提示。费用支付功能是作为立即用车的包含功能,实现用户的费用统计,用户选择支付后,相应修改用户账户信息并添加支付记录。报修投诉功能可以报修指定编号的车辆,并且可以投诉其他用户或者单车服务人员的违规行为。

    4.性能需求

    4.1时间特性
    由于ETObike面向的用户群庞大,因而使用频率较高,使用性要求就比较高。为防止信息资料被恶意破坏,要求有较为可靠的安全性能。且在用车还车等功能上体现出响应速度的迅速。
    4.2适应性
    作为基于微信平台的小程序,它不是作为一个独立体运行的。为了适应微信内部数据要求,该程序设计了交换扩展接口。更具有操作的灵活性。

    5.运行需求

    5.1用户界面
    界面尽量简洁,不宜复杂,字体色彩搭配得当,符合大众审美。
    5.2硬件接口
    对于输入:人工输入设备信息;机器输入停车借车扣费等操作。
    对于输出:自行车借还信息统计、个人账户借还统计及停车管理信息记录。
    5.3软件接口
    要对车辆、用户、费用等信息的增加删除修改进行监控和审核。
    5.4故障处理
    正常使用时不应出错,若运行时遇到不可恢复的系统错误,也必须保证数据库完好无损。要进行数据备份,以防数据丢失无法恢复。对故障的处理要区分严重程度,尽可能的对错误进行恢复,随时监控。

    6.其他需求

    从安全保密的角度来说,该程序为用户提供多个功能模块,用户数据的的传输应该要求加密操作,生成严格的操作日志,定期反馈备份,重复检查。

    展开全文
  • 使用springBoot开发一个web后台程序,用于对接共享单车微信小程序,收集微信小程序产生的用户数据,以及单车的信息。
  • 文章目录共享单车——微信小程序(知识回顾)模块一了解HTML、CSS、JS微信小程序环境搭建共享单车页面地图布局模块二搭建一个web后台服务(SpringBoot)小程序向后台发送http请求**wx.request(Object object)**参数...


    大概涉及的知识点

    共享单车——微信小程序(知识回顾)

    模块一

    了解HTML、CSS、JS

    html超文本标记语言,是一种用于创建网页的标记语言。可以使用html来建立自己的web站点,html运行在浏览器上,由浏览器解析。

    css用于布局和美化网页,是一种标记语言,因此不用编译,可以直接由浏览器执行,大小写不敏感。

    javaScript是一门脚本语言,通常是结合html网页,在浏览器中执行的,给html网页做一些逻辑控制和增加一些动态功能。

    简单回顾

    <!DOCTYPE html>
    <html>
    	<!--头部 可以引用css和js-->
    	<head>
    		<meta charset="UTF-8">
    		<!--外部引入-->
    		<link rel="stylesheet" type="text/css" href="css/test.css" />
    		<script type="text/javascript" src="js/test.js" charset="UTF-8"></script>
    		<title></title>
    	</head>
    	<!--主要部分-->
    	<body>
    		<h1>这是一级标题</h1>
    		<h2>这是二级标题</h2>
    		<img class="i1" src="404.jpg" onclick="clickImg()"/>
    		<div class="d1">
    			<!--form表单 可以实现对象的提交-->
    			<form action="" method="post">
    				账号:<input type="text" name="account" /><br />
    				密码:<input type="password" name="pwd" /><br />
    				<input type="submit" value="提交" />
    			</form>
    		</div>
    	</body>
    </html>
    
    .d1{
    	text-align: center;
    }
    
    function clickImg(){
    	alert("点我干什么!");
    }
    

    微信小程序环境搭建

    1. 到微信公众话注册微信小程序账户

    2. 下载小程序开发工具

    3. 创建小程序项目(关联自己账户的appid)

      html微信小程序
      htmlwxml
      csswxss
      小程序中的文件说明
      app.js小程序入口程序
      app.wxss全局样式文件
      app.json全局配置文件

    共享单车页面地图布局

    Page中的属性

    属性类型默认值必填说明
    dataObject页面的初始数据
    onLoadfunction生命周期回调—监听页面加载
    onReadyfunction生命周期回调—监听页面初次渲染完成

    常用的map组件

    属性类型默认值必填说明最低版本
    longitudenumber中心经度1.0.0
    latitudenumber中心纬度1.0.0
    markersArray. 标记点1.0.0
    controlsArray.控件(即将废弃,建议使用 cover-view 代替)1.0.0
    scalenumber16缩放级别,取值范围为3-201.0.0
    show-locationbooleanfalse显示带有方向的当前定位点1.0.0
    bindcontroltapeventhandle点击控件时触发,e.detail = {controlId}1.0.0
    bindregionchangeeventhandle视野发生变化时触发,2.3.0

    模块二

    搭建一个web后台服务(SpringBoot)

    @SpringBootApplication是Springboot的入口程序,在Spring程序启动时进行扫描,扫描带有特殊注解的类。

    @Controller标记这个类是一个用于接收请求和响应用户的控制器,加上@Controller注解以后,Spring容器会对其进行实例化。

    @RequestMapping(“/hello”)会映射到Hello()上;@ResposeBody以json的形式返回

    在application.properties中写server.port=80,即访问SpringBoot的端口为80

    小程序向后台发送http请求

    wx.request(Object object)

    参数
    属性类型默认值必填说明最低版本
    urlstring开发者服务器接口地址
    datastring/object/ArrayBuffer请求的参数
    methodstringGETHTTP 请求方法
    dataTypestringjson返回的数据格式
    successfunction接口调用成功的回调函数
    method 的合法值
    说明最低版本
    OPTIONSHTTP 请求 OPTIONS
    GETHTTP 请求 GET
    HEADHTTP 请求 HEAD
    POSTHTTP 请求 POST
    PUTHTTP 请求 PUT
    DELETEHTTP 请求 DELETE
    TRACEHTTP 请求 TRACE
    CONNECTHTTP 请求 CONNECT
    dataType 的合法值
    说明最低版本
    json返回的数据为 JSON,返回后会对返回的数据进行一次 JSON.parse
    其他不对返回的内容进行 JSON.parse
    data 参数说明

    最终发送给服务器的数据是 String 类型,如果传入的 data 不是 String 类型,会被转换成 String 。转换规则如下:

    • 对于 GET 方法的数据,会将数据转换成 query string(encodeURIComponent(k)=encodeURIComponent(v)&encodeURIComponent(k)=encodeURIComponent(v)...
    • 对于 POST 方法且 header['content-type']application/json 的数据,会对数据进行 JSON 序列化
    • 对于 POST 方法且 header['content-type']application/x-www-form-urlencoded 的数据,会将数据转换成 query string (encodeURIComponent(k)=encodeURIComponent(v)&encodeURIComponent(k)=encodeURIComponent(v)...)

    wx.requestPayment(Object object)

    web后台服务返回json对象

    小程序解析返回的json对象

    相关其他知识

    WeUI

    源码:https://github.com/Tencent/weui/releases

    导入WeUI样式

    1. 在微信小程序中创建一个目录,例如style

    2. 在app.wxss中引入

      @import ‘./weui.wxss’

    3. 在页面中引入样式

    Redis

    Redis(Remote Dictionary Server ),即远程字典服务,是一个开源的使用ANSI C语言编写、支持网络、可基于内存亦可持久化的日志型、Key-Value数据库,并提供多种语言的API。从2010年3月15日起,Redis的开发工作由VMware主持。从2013年5月开始,Redis的开发由Pivotal赞助。

    微软提供的Redis:https://github.com/microsoftarchive/redis/releases

    1. 启动Redis命名行客户端 redis-cli.exe
    2. 添加数据 set xiaoniu 666
    3. 删除数据 del xiaoniu
    4. 设置key-value数据超时时间 set 18091798888 6666 EX 30

    set name www 添加一个键值对

    keys * 查询现在所有的键值对

    get name 通过key获取value

    del name 通过key删除

    腾讯云

    用来处理有关验证码的信息

    MongoDB

    MongoDB是一个基于分布式文件存储 [1] 的数据库。由C++语言编写。旨在为WEB应用提供可扩展的高性能数据存储解决方案。

    MongoDB是一个介于关系数据库和非关系数据库之间的产品,是非关系数据库当中功能最丰富,最像关系数据库的。它支持的数据结构非常松散,是类似jsonbson格式,因此可以存储比较复杂的数据类型。Mongo最大的特点是它支持的查询语言非常强大,其语法有点类似于面向对象的查询语言,几乎可以实现类似关系数据库单表查询的绝大部分功能,而且还支持对数据建立索引

    MongoDBMysql
    databasedatabase
    collectiontable
    BSON二维表
    不支持SQL查询支持SQL查询
    _id主键
    支持GEO索引不支持GEO索引

    JPA

    前端不是很完善,但基本可以,实现了扫码的一系列功能,返回原地址,以及添加单车的功能,但是在添加单车的实现,出了些问题,如果有会的小伙伴,欢迎指导和交流。
    想要源码的私信我,本来想放在gitee上,半天没弄好。

    展开全文
  • vue仿ofo共享单车微信小程序
  • 共享单车微信小程序源码,前端微信开发者工具的代码和后端java代码
  • 仿ofo共享单车微信小程序,微信小程序(wei xin xiao cheng xu),简称小程序,英文名Mini Program,是一种不需要下载安装即可使用的应用,它实现了应用“触手可及”的梦想,用户扫一扫或搜一下即可打开应用。
  • 模仿共享单车小程序 最近和同学一起做一个项目是有关共享搬运车的,这个文章记录这个过程中遇到的一些奇奇怪怪的问题 关于小程序真机调试苹果手机可以而安卓手机却链接不上的问题 小程序的网络连接只能是小程序...

    模仿共享单车的小程序

    最近和同学一起做一个项目是有关共享搬运车的,这个文章记录这个过程中遇到的一些奇奇怪怪的问题


    关于小程序真机调试苹果手机可以而安卓手机却链接不上的问题

    小程序的网络连接只能是小程序加密的或者是SSL证书的https非常的麻烦,所以才会出现一些奇奇怪怪的问题。再者由于学生没有什么钱用的东西都是免费的,以及 自身不可能学习每一个细节,所以一些地方用的都是别人做好的程序后台或者应用。感谢每一位帮助到我的博主和B站up。

    • 经过繁琐的服务器搭建完成后能得到的只是一个公网ip ,想要在小程序发布后正常使用还需要很多步骤。域名申请配置SSL证书以及在EMQX的配置文件加上ssl证书的pem文件和key文件
    • 一开始以为是免费证书不合格的原因更改了pem,后来发现是在EMQX的配置文件少配置了两行,修改之后reboot重启服务器重新真机调试安卓手机成功连接。

    在这里插入图片描述
    在这里插入图片描述

    展开全文
  • 绿色的 共享单车管理小程序
  • 仿ofo共享单车微信小程序.rar
  • 仿ofo共享单车.zip小程序精选源码
  • 共享单车摩拜ofo微信小程序源代码,仅使用与个人实验,请勿完全抄袭盗版
  • 共享单车微信小程序

    千次阅读 2018-08-30 00:56:00
    微信小程序bike单车,前台使用小程序地图控件+weui+小程序相关组件和API,后台使用SpringBoot+JPA,用户及单车信息保存进mongodb,短信平台的配置信息和临时生成的验证码存放进redis用于校验。实现定位,单车增加及...

     微信小程序bike单车,前台使用小程序地图控件+weui+小程序相关组件和API,后台使用SpringBoot+JPA,用户及单车信息保存进mongodb,短信平台的配置信息和临时生成的验证码存放进redis用于校验。实现定位,单车增加及搜索,用户注册,短信接口调用,支付押金等功能。

    1. 地图定位及显示周围单车数量

    页面通过<map>标签来引入微信地图

    <map id='myMap' longitude='{{longitude}}' latitude='{{latitude}}' controls='{{controls}}' markers='{{markers}}' show-location='true' 
    bindcontroltap='controltap' scale='17' style='width: 100%; height: 100%'> </map>

    定位通过监听页面加载的生命周期函数onLoad获取经纬度来实现,同时获取周围的单车信息

     onLoad: function() {
        var that = this;
        wx.getLocation({
          success: function(res) {
            var longitude = res.longitude;
            var latitude = res.latitude;
            that.setData({
              longitude: longitude,
              latitude: latitude
            })
            // 查找单车信息
            findBikes(longitude, latitude, that);
          },
        });
    
    /*其他加载项*/
    }

    查找周围单车

    function findBikes(longitude, latitude, that) {
      wx.request({
        url: 'http://localhost:8080/bike/findNear',
        method: 'GET',
        data: {
          longitude: longitude,
          latitude: latitude
        },
        success: function(res) {
          var bikes = res.data.map((geoResult) => {
            return {
              longitude: geoResult.content.location[0],
              latitude: geoResult.content.location[1],
              iconPath: '/images/bike.png',
              width: 35,
              height: 40,
              id: geoResult.content.id
            }
          })
          // 将bike数组set到当前页面的marker
          that.setData({
            markers: bikes
          })
        }
      })
    }

    service层中获取周围单车信息

        /**
         * 根据当前经纬度查找附近的bikes
         * @param longitude
         * @param latitude
         * @return
         */
        @Override
        public List<GeoResult<Bike>> findNear(double longitude, double latitude) {
            // 2千米范围内,状态为的0的bike, 数量限制20
            NearQuery nearQuery = NearQuery
                    .near(longitude, latitude)
                    .maxDistance(2, Metrics.KILOMETERS)
                    .query(new Query(Criteria.where("status").is(0)).limit(20));
    
            GeoResults<Bike> geoResults = mongoTemplate.geoNear(nearQuery, Bike.class);
            return geoResults.getContent();
    
        }

    2. 调用短信接口发送验证码

     

    前台方法省略,电话号码填写完毕后获取短信验证码及校验【注意:短信签名需要在腾讯云申请并获得通过】

        /**
         * 调用腾讯云短信API发送短信,并将手机号及验证码存入redis
         * @param countryCode
         * @param phoneNum
         * @return
         */
        @Override
        public boolean sendMsg(String countryCode, String phoneNum) {
            Jedis jedis = pool.getResource();
    
            // 从redis中获取之前存储的appid与appkey
            int appid = Integer.parseInt(jedis.get("appid"));
            String appkey = jedis.get("appkey");
    
            boolean flag = true;
            try {
                // 生成短信验证码(4位)
                int code = (int)((Math.random() * 9 + 1) * 1000);
                SmsSingleSender ssender = new SmsSingleSender(appid, appkey);
                // 向对应手机号的用户发送短信
                SmsSingleSenderResult result = ssender.send(0, countryCode, phoneNum, "【bike单车】你的验证码为:" + code + "。如非本人操作,请忽略本短信。" , "", "");
                // 将发送的手机号作为key,验证码作为value保存到redis中(有效时长300s)
                jedis.setex(phoneNum, 300, code + "");
            } catch (Exception e) {
                flag = false;
                logger.error("调用短信接口异常" + e.getMessage());
            } finally {
                jedis.close();
            }
            return flag;
        }
    
        /**
         * 从redis中获取并校验验证码是否匹配
         * @param phoneNum
         * @param verifyCode
         * @return
         */
        @Override
        public boolean verify(String phoneNum, String verifyCode) {
            Jedis jedis = pool.getResource();
            String code = jedis.get(phoneNum);
            jedis.close();
            return code != null && code.equals(verifyCode);
        }

    3. 押金充值

    需要企业认证,方法参考API,需要注意的是充值成功后更新用户押金及状态

       success: function (res) {
                  // 关闭充值中的加载对话框
                  wx.hideLoading();
                  // 交过押金后,将用户status更新为2
                  var globalData = getApp().globalData;
                  globalData.status = 2;
                  wx.setStorageSync("status", 2);
                  wx.navigateTo({
                    url: '../identify/identify',
                  })
                }

    4. 实名认证

    formSubmit: function(e) {
        // 获取全局变量的数据
        var globalData = getApp().globalData;
    
        // 获取手机号
        var phoneNum = myUtil.get('phoneNum');
    
        // 获取姓名和身份证号
        var name = e.detail.value.name;
        var idNum = e.detail.value.idNum;
        wx.request({
          url: 'http://localhost:8080/user/identify',
          header: {'content-type': 'application/x-www-form-urlencoded' },
          data: {
            phoneNum: phoneNum,
            name: name,
            idNum: idNum,
            status: 3
          },
          method: 'POST',
          success: function(res) {
            globalData.status = 3;
            wx.setStorageSync('status', 3);
            // 完成所有注册流程,跳转到首页
            wx.navigateTo({
              url: '../index/index',
            });
          }
        })
      }

    完成这一步,将用户信息存进mongodb,并且跳转到用车界面

    5. 故障申报

     将故障信息及地理位置写入数据库,修改单车状态。

     

    展开全文
  • 于是我就萌生了一个给ofo共享单车撸一个小程序(不知道为啥ofo没有小程序)的想法。Let's do it! 由于本文篇幅过长,影响浏览体验,我对这篇文章做了一下拆分,修正了一些错误。有需要的可以移步浏览 后续: 有位php攻...
  • 微信小程序仿ofo共享单车demo完整源码微信小程序仿ofo共享单车demo完整源码
  • ofoShareBicycle 微信小程序共享单车
  • 共享单车微信小程序之初体验

    千次阅读 2018-07-07 10:07:10
    本文的学习内容来自小牛课堂,微信小程序的学习地址:https://www.nowcoder.com/study/vod/204/2/2 微信小程序开发官方帮助文档:https://developers.weixin.qq.com/miniprogram/dev/component/map.html 注:...
  • 仿ofo在线共享单车租用程序源码.zip
  • 微信小程序源代码-模仿共享单车ofo
  • mobike-applet 微信小程序 共享单车
  • 于是我就萌生了一个给ofo共享单车撸一个小程序(不知道为啥ofo没有小程序)的想法。Let's do it! 由于本文篇幅过长,影响浏览体验,我对这篇文章做了一下拆分,修正了一些错误 先上一波效果图: 目录 (Table of ...
  • 基于微信小程序共享单车用户满意度调查系统设计与实现.pdf
  • 上一节实现了扫码,这一节我们开始实现点击单车报障控件之后跳转的页面: (此图片来源于网络,如有侵权,请联系删除! )(此图片来源于网络,如有侵权,请联系删除! ) 页面分析  页面可以勾选故障类型,所以需要用到...
  • 微信小程序Demo:ofo共享单车(高仿版) 项目地址:http://www.wxapp-union.com/forum.php?mod=viewthread&tid=8672&page=1&extra=#pid59526

空空如也

空空如也

1 2 3 4 5 ... 20
收藏数 3,283
精华内容 1,313
关键字:

共享单车小程序