2024年想做个维修类的小程序 篇1
序：北漂做了几年的程序猿，英语水平极差，所以在程序上没有太高的造诣，但是还是想把自己所能做的的记录下来。
下边来完成一个微信小程序的车辆违章查询，在最后我会放上源码链接，所以内容上就不对代码做太多解释，只说下思想。
1:数据来源，车辆违章查询的数据来源想到的就是三方接口，那么我选择的是以前做公众号开发时候时候的聚合数据(API数据接口_开发者数据定制),注册申请。
进入全国车辆违章查询可以看到三个接口：1:获取支持城市参数接口 2:请求违章查询接口3:接口剩余次数请求。有了这三个接口就可以实现一个简单的车辆违章查询了。
2:微信小程序，有了数据的来源就等于有了灵魂，之后就是怎样利用数据源来实现了，首先就是小程序的学习。安装以及创建项目。查看文档(https://mp.weixin.qq.com/debug/wxadoc/dev/?t=1476197488080)
个人建议先把文档看一遍，这一遍并不是要记住文档，而是要在脑子里对小程序有一个初步的印象，更重要的是建立一个索引目录，之后开发的时候能够根据目录索引到具体位置。
一遍文档看下来，首先想到的是需要哪些知识才能开发
懂一点html,css,js,每个页面包括一个js,ixml,wuss
之前有对react native (react native)了解点，发现在页面与数据交互上有很多的相似，建议有兴趣的可以看了解一下，有助于理解。
API方面因为之前做过公众号开发，所以看了一下应该是wxjs的接口开放。
安装创建工程根据文档来就好了，因为没有内测号就只能创建一个无appid的项目
下载IDE创建项目：MyCar
ui方面需要三个：主页，添加查询车辆信息页，查询页
在app.json中加入三个页面
"pages": [
"pages/home/home",
"pages/addcar/addcar",
"pages/query/query"
]
主页需要展示添加查询车辆列表以及添加车辆
点击添加车辆需转到添加页面
在wxml中添加按钮的组建对应的js中实现对页面的跳转
home.wxml:
<view wx:if="{{surplus >= 0}}">
<button type="default" bindtap="bindtapAdd" hover-class="other-button-hover"> 添加车辆 </button>
</view>
home.js:
bindtapAdd:function(){
wx.navigateTo({
url: '../addcar/addcar'
})
},
在添加页面要做的是将车辆信息缓存的微信的本地，那么就需要使用聚合的接口来获取支持的城市供用户选择，获取聚合的数据后需要做一个二级联动，由于还没有太多时间来研究wxcss所以页面做的比较粗糙。
当用户填好数据后存储到数据缓存，这里涉及到两个知识点一个是请求url一个是数据缓存
请求可查询城市数据
requestCitys:function(){
var page = this;
wx.request({
url: 'http://localhost:3000/wz/citys',
header: {
'Content-Type': 'application/json'
},
success:function(res){
var res = res.data;
page.analysisRes(res);
},
fail:function(res){
page.setData({
toastInfo:util.toErrMsg(0),
toastHidden:false
})
console.log(res);
}
})
}
保存用户数据并且退回到主界面
wx.setStorageSync('cars',cars);
wx.navigateBack();
用户在主界面需要将缓存的数据用列表形式展示并且点击列表后需要使用查询车辆违章接口进行查询
home.js
//加载列表数据
reloadData:function(){
var value = wx.getStorageSync('cars')
if (value) {
var cars = [];
var i = 0;
for(var key in value) {
cars[i]= value[key];
i++;
}
this.setData({
cars:cars
})
}
},
//跳转到查询页面
onclikItem:function(e){
var id = e.target.id;
var carname = this.data.cars[id].name
wx.navigateTo({
url: '../query/query?carname='+carname
})
},
home.wxml:
<scroll-view scroll-x="true">
<viewwx:for="{{cars}}" wx:for-index="idx" wx:for-item="car">
<view id="{{idx}}" bindtap="onclikItem">
<text id="{{idx}}">
{{car.name}}
</text>
<text id="{{idx}}">
{{car.showhphm}}
</text>
</view>
</view>
在查询页面需要调用查询接口
requestQuery:function(car){
var hphm = encodeURI(car.city.abbr+car.hphm)
var page = this;
wx.request({
url: 'http://localhost:3000/wz/query',
method:'POST',
data:{
key:page.data.AppKey,
city:car.city_code,
hphm:hphm,
hpzl:car.hpzl,
engineno:car.engineno,
classno:car.classno
},
header: {
// 'Content-Type': 'application/json'
},
success: function(res) {
var res = res.data;
if(res.resultcode == 200){
console.log(res.result.lists);
page.setData({
lists:res.result.lists
})
}else{
page.setData({
toastInfo:res.reason,
toastHidden:false
})
console.log(res);
}
},
fail:function(res){
page.setData({
toastInfo:util.toErrMsg(0),
toastHidden:false
})
console.log(res);
}
})
}
这样小程序的基本功能就算完成了，这里要说下的是小程序测数据与页面刷新很类似react native ,Page中的data数据改变，wxml中使用数据的的组件就会自动刷新，这个跟以往我做android ios 的略有区别，适应下就好了。
下面说下中转路由，这次选用的是node的express作为web服务器 数据库用嘛mongodb,这个是才接触的所以使用的也比较初级。
Node.js
Express - 基于 Node.js 平台的 web 应用开发框架
建议安装Homebrew这样会比较方便
Homebrew
Homebrew, Mac系统的包管理器，用于安装NodeJS和一些其他必需的工具软件。
/usr/bin/ruby -e "$(curl -fsSL https://raw.githubusercontent.com/Homebrew/install/master/install)"
译注：在Max OS X 10.11（El Capitan)版本中，homebrew在安装软件时可能会碰到/usr/local目录不可写的权限问题。可以使用下面的命令修复：
sudo chown -R `whoami` /usr/localbrew install node
$ npm install express --save
创建web服务器MyCarServer,编辑器个人习惯用Sublime Text: The text editor you'll fall in love with
这里需要再下载两个扩展包用来实现post以及mongodb的连接
GitHub - expressjs/body-parser: Node.js body parsing middleware
$ npm install body-parser
GitHub - Automattic/mongoose: MongoDB object modeling designed to work in an asynchronous environment.
$ npm install mongoose
安装mongoldb这个我是看的视频，大家页可以自行百度
http://www.jikexueyuan.com/course/1976_1.html?ss=1
项目中创建models.js来驱动数据库
var config = require('./config.json');
// var uri = 'mongodb://username:password@hostname:post/databasename';
var host = config.host;
var port = config.port;
var dbName = config.dbname;
var uri = 'mongodb://' + host + ':' + port + '/' + dbName
var mongoose = require('mongoose')
console.log('uri:', uri)
mongoose.connect(uri);
var CarStatusScheme = new mongoose.Schema({
cachetime: Number,
resdata: String
})
var CarCitysScheme = new mongoose.Schema({
cachetime: Number,
resdata: String
})
var CarQueryScheme = new mongoose.Schema({
cachetime: Number,
resdata: String,
hphm: String
})
mongoose.model('CarStatus', CarStatusScheme);
mongoose.model('CarCitys', CarCitysScheme);
mongoose.model('CarQuery', CarQueryScheme);
在app.js中
var mongoose = require('mongoose');
require('./models.js');
在创建config.json用来做一些常规配置
{
"dbname": "mycar",
"port": "27017",
"host": "localhost",
"statuscache": 1000,
"cityscache": 1000,
"querycache": 1000,
"debug": true
}
在app.js中使用配置
var config = require('./config.json')
var debug = config.debug
get请求
//接口剩余请求次数查询
// 请求示例：http://v.juhe.cn/wz/status?key=xxxxxxx
// 请求参数说明：
// 名称 类型 必填 说明
// key string 是 应用APPKEY(应用详细页查询)
// dtype string 否 返回数据的格式,xml或json，默认json
// 返回参数说明：
// 名称 类型 说明
// error_code int 返回码
// reason string 返回说明
// data - 返回结果集
// surplus string 剩余次数
app.get('/wz/status', function(req, res) {
if (debug) {
http://console.info('http get /wz/status')
}
CarStatus.find({}, function(err, docs) {
if (err) {
console.error("CarStatus.find err:", err)
} else {
if (docs.length > 0) {
var carStatus = docs[0];
var curtime = Date.now();
var cachetime = carStatus.cachetime;
if (curtime - cachetime < statuscachetime * 1000) {
var resData = carStatus.resdata;
res.json(JSON.parse(resData))
} else {
requestJHStatus(res);
}
} else {
requestJHStatus(res);
}
}
});
});
post 请求
// 接口地址：http://v.juhe.cn/wz/query
// 支持格式：json/xml/jsonp
// 请求方式：post get
// 请求示例：http://v.juhe.cn/wz/query?city=SH&hphm=苏L50A11&engineno=123456&key=key
// 接口备注：因交管局线路迁移，即日起至四月底安徽，山东，杭州等省市偶尔出现临时维护，请关注
// 调用样例及调试工具：API测试工具
// 请求参数说明：
// 名称 类型 必填 说明
// dtype string 是 返回数据格式：json或xml或jsonp,默认json
// callback String 否 返回格式选择jsonp时，必须传递
// key string 是 你申请的key
// city String 是 城市代码 *
// hphm String 是 号牌号码 完整7位 ,需要utf8 urlencode*
// hpzl String 是 号牌类型，默认02，暂只支持小型车
// engineno String 否 发动机号 (根据城市接口中的参数填写)
// classno String 否 车架号 (根据城市接口中的参数填写)
// 返回参数说明：
// 名称 类型 说明
// province String 查询省份代码
// city String 查询城市代码
// hphm String 查询的号牌号码
// lists Array 违章列表
// date String 违章时间
// area String 违章地点
// act String 违章行为
// code String 违章代码(仅供参考，不一定有值)
// fen String 违章扣分(仅供参考，不一定有值)
// money String 违章罚款(仅供参考，不一定有值)
// handled String 是否处理,1处理 0未处理 空未知
app.post('/wz/query', function(req, res) {
if (debug) {
http://console.info('http post /wz/query')
}
console.log(req.headers['content-type'])
http://console.info('/wz/query req.body:', req.body)
// http://console.info('/wz/query req.data:', req)
var carquery = new CarQuery({
hphm: req.body.hphm,
cachetime: Date.now()
})
http://console.info('/wz/query hphm:', carquery.hphm)
CarQuery.find({
'hphm': carquery.hphm
}, function(err, docs) {
if (err) {
console.error("CarQuery.find err:", err)
} else {
if (docs.length > 0) {
var carQuery = docs[0];
var curtime = Date.now();
var cachetime = carQuery.cachetime;
if (curtime - cachetime < querycache * 1000) {
var resData = carQuery.resdata;
res.json(JSON.parse(resData))
} else {
requestJHQuery(req.body, res);
}
} else {
requestJHQuery(req.body, res);
}
}
});
});
post请求需要引入body-parse
var bodyParser = require('body-parser');
// parse application/x-www-form-urlencoded
app.use(bodyParser.urlencoded({
extended: false
}))
// parse application/json
app.use(bodyParser.json())
这里还有一个未解决的就是小程序中请求中如果设置
header: {
// 'Content-Type': 'application/json'
},
在web服务器中是接收不到body数据的，所以暂时的解决方式是注释 // 'Content-Type': 'application/json'
这样就算完成了基础功能
哎！不会文章表达还是微信（xiongandaqu）沟通吧
2024年想做个维修类的小程序 篇2
1，小程序本来就是为实体店服务的，汽修店是典型的传统实体店，客户覆盖范围大，不像士多店就近消费，当然需要小程度来协助店老板扩大宣传，提升业绩！
2，汽修店业绩的好坏，和老板本人有很大的关系，除了车间技师技术精湛，价格实惠，正品配件以外，就是要源源不断的有新的客户进来，同时还要维护好现有的客户！店老板永远是汽修店营销推广第一人！
3，酒香不怕巷子深，这种观念早已过时了，很多汽修店老板抱着老观念不放，不愿意拥抱互联网营销，或者没有能力做互联网营销，实际上很多互联网营销价格也不是很贵，外面做小程序的公司很多！
4，小程序可以解决以下问题：
@协助汽修店找更多的客户，小程序可以基于汽修店的地址覆盖方圆五公里，很多人玩手机的时候或者在微信里面搜索的时候，有可能会看到你的店，就像在汽修店周边五公里撒了一个大网，包括每天有多少人看了汽修店的小程序，小程序后台就可以看到，达到宣传片的目的，当然小程序里面有一些促销的产品，可以吸引车主到店！
@很多汽修店每月或者每一个季度都会有一些促销信息，这些促销信息可以放在微信小程序里面，可以主动推送给汽修店的车主用户，车主用户也可以主动分享给更多的车主，后台还可以统计，车主对哪些促销信息感兴趣！
@另外现有客户在即将快要保养的时候，比如说还有十天就要到下一个保养里程了，微信小程序可以主动提醒汽修店的老板或者客服可以和车主联系，防止客户流失！
@还有就是汽修店做了自己的微信小程序，给自己的客户也会留下一个很好的印象，与时俱进，契合了车主日常的互联网下单习惯，毕竟开车的基本都会通过网上消费或者预订，尤其年轻的车主越来越多，他们是伴随着互联网发展起来的一代！
当然小程序还有很多应用，最主要的就是容易上手，制作成本也不高，我平时去保养的那家汽修店也有微信小程序，经常能看到一些促销信息，也能省不少费用！
车友会群主，玩越野，玩飘移，利用休息的时间亲自码字，用通俗易懂的文字回答车主的各类问题，认为有用的请点赞并关注，想发私信提问的也可以一对一解答！
2024年想做个维修类的小程序 篇3
我想自己制作一个微信小程序，有哪些建议？建议如下：
1.确定目标
确定开发小程序，明确做什么，做小程序的目的是什么，都是需要去考虑的。
2.选择制作开发的方法
一般微信小程序制作开发方法可分为三种，一是组建团队，自行开发。二是自己购买模板或者开发资源包，前提要有开发经验，三是外包给专业的小程序开发公司。至于如何选择开发方式，看企业自己选择。
3.市场调研
商家在开发微信小程序之前，除了需要选择好开发的方式之外，对于市场调研也是必不可少的。商家在制作开发之前，一定要事先对小程序面向的人群、年龄段、行为特征等等做一个细致的分析，以便更好确定小程序的风格、功能等，提升用户体验。
4.竞争对手分析
无论你做什么行业的微信小程序，商家在制作开发之前，都需要了解一下竞争对手的情况。您可以搜索一下同行的微信小程序，看看同行的小程序都有哪些特征，有哪些值得学习重点，然后吸取对方的优点，这样才能让我们的小程序在同类小程序中脱颖而出。
5.小程序功能需求分析
商家要确定微信小程序开发的目标，以及微信小程序功能需求的分析，这两点对于商家而言，是一项非常重要工作，因为这会直接影响到用户体验，所以在开发之前，一定要做好需求分析工作。
2024年想做个维修类的小程序 篇4
做小程序一般都是找第三方来开发，虽然第三方公司很多，但靠谱的很少，最关键的问题就在于要找一个背景、实力都比较雄厚的开发公司，这样才能为小程序的后期服务提供保障。
作为线下的商户，要想做好做大，是需要结合新零售，把线上线下联动起来。相比之下，小程序的使用就简单得多，不用下载安装，用完即走，方便快捷。想更深入的了解小程序，可以去官网免费试用下有赞小程序，我们有自己专业的开发团队，和6年的开发经验。很多知名商家都比如海底捞、时尚芭莎、名创优品等等他们都在用有赞小程序。
2024年想做个维修类的小程序 篇5
小程序的出现，使人们摆脱恼人的安装更新推送，即用即走，简单高效，在微信上给用户最轻、最快、最好的体验，帮助商家实现高效的品牌宣传，从第一次接触小程序的兴奋好奇，到现在的熟知运用，小程序已经开始影响我们的生活。小程序的普及使商家们发现了其中的商机，投身其中，并且收获巨大。所以小程序定制开发哪家好成为商家一度讨论的热门话题。
想要知道小程序定制开发哪家好，首先你必须要了解商家为什么要进行小程序定制开发，以下详细列出了开发的好处，让你清楚地了解到小程序对企业发展的必要性。
一、开发小程序能够为商家拓宽产品销售渠道；基于微信的社交属性可利用小程序提升企业知名度，让更多的人本公司的产品，为企业发展注入鲜活的生命力。商家也可合理安排资源，节省用户时间。在快速发展的城市当中，很多企业都需要小程序帮助企业实现拓宽渠道。
二、小程序能够帮助企业快速树立企业形象；小程序入口繁多，与订阅号服务号绑定，公众号文章传播，搜索入口等，快速实现高效的品牌宣传。两阿红的品牌效应可助力企业发展壮大。使企业订单满满，轻松赚钱。否则你整天在外奔波可能还没有小程序一个小时的订单多。企业想要在巨大的竞争中赢得有利地位，打出一片天地，就必须要有属于自己的小程序。
三、小程序开发已迫在眉睫，率先上线小程序的商家，可共享9.35亿微信注册用户，6.5亿微信支付用户，2000万微信公众号，在市场抢占流量红利。并且依附在微信上的小程序，可以给电商们去提供越来越多的营销新玩法，而不只是局限在淘宝等平台上。
那么小程序定制开发哪家好呢？江苏微盛网络科技有限公司是是一家基于微信为企业提供开发、运营、培训、推广一体化解决方案的知名小程序开发公司，是腾讯云小程序联合解决方案合作厂商，联合推出小程序行业应用，服务于中小企业和渠道商，助力企业实现互联网+的业务转型与升级。已服务于包含多家500强企业在内的近10万家客户，并且深受客户好评。