机器学习模型部署--打通前后端任督二脉

栏目: 编程语言 · 发布时间: 6年前

内容简介：近日在某论坛，有网友提问道：搞机器学习是不是要博士或是硕士学历，是不是要求很高，顶会论文？本科生或者更低学历的，是不是就没有机会了？从最近公司的招聘来看，算法工程师的 bar 确实有在提高。但在某些事业部，仍需要很大的人力来做落地场景。每个人都要找准自己的定位，公司也有它的部门定位。如果是发论文、要在学术界站稳脚跟，给投资人“我们很重视最新技术”的信心，那博士确实很重要。另一个角度，从实用角度来说，研究生和本科生可能性价比更高。当然，作为一个小本就工作的人，没有较为丰富的实战经验，有机会的话，还是拿到硕士及

近日在某论坛，有网友提问道：搞机器学习是不是要博士或是硕士学历，是不是要求很高，顶会论文？本科生或者更低学历的，是不是就没有机会了？从最近公司的招聘来看，算法工程师的 bar 确实有在提高。但在某些事业部，仍需要很大的人力来做落地场景。每个人都要找准自己的定位，公司也有它的部门定位。如果是发论文、要在学术界站稳脚跟，给投资人“我们很重视最新技术”的信心，那博士确实很重要。另一个角度，从实用角度来说，研究生和本科生可能性价比更高。当然，作为一个小本就工作的人，没有较为丰富的实战经验，有机会的话，还是拿到硕士及更高学历比较好。这里的实战经验就比如：搭建一个完整的、涉及算法模型、后端及前端的系统。

模型算法的实用主义

机器学习的实用主义，不是在论文多少，而是用正确的方法去解决正确的问题。而作为背后的工程师，除了调参、除了写 sql，做调包侠、做 sql boy、报表 boy 以外，在之前的文章也提到过，要学会做正确的展示，做全套的工程化实施。毕竟，等排期很难受；有些情况前后端资源不够，或者优先级很低，那就需要自己动手了。以下以上面的垃圾邮件分类为例子，说明该如何搭建一个前后端完整的机器学习系统。

关注微信公众号：谷粒先生，下载权重文件并第一时间获取更新。

这里将本次的任务拆解，分为三个部分来讲。后端 flask、前端 Vue、ML 模型采用 flair，项目地址 kuhung/flask_vue_ML

后端 flask

核心函数

导入函数包

from flask import Flask, jsonify, request
from flask_cors import CORS # 做跨域的准备
from flask import session # 追踪客户端会话

from flair.models import TextClassifier # 模型导入，采用前不久开源的 flair 做文本分类
from flair.data import Sentence

复制代码

准备工作

app = Flask(__name__) # 声明准备
app.secret_key = "super_secret_key"

CORS(app)
classifier = TextClassifier.load_from_file('models/best-model.pt') # 模型加载

复制代码

配置 flask 的路由

# 根路由配置
@app.route('/', methods=['GET'])
def index():
    return jsonify("welcome to Kuhung API")

# GET 方法，这里 session 的作用是追踪客户端会话，防止重复请求模型
@app.route('/api/tasks', methods=['GET'])
def get_result():
    result = []
    try:
        data_result = session['my_result']
        result.append ({'title': data_result['title'], 'tag': data_result['tag'] })
    except:
        result.append ({'title': 'The txt you input', 'tag': 'spam or ham' })
    return jsonify(result)

# POST 方法
@app.route('/api/task', methods=['POST'])
def input_predict_text():

    title = request.get_json()['title'] # 解析请求

    sentence = Sentence(title) # 对请求做数据预处理
    classifier.predict(sentence) # 调用模型，做预测，返回带标签的数据

    text = sentence.to_plain_string() # 解析出原始数据
    label = sentence.labels[0] # 解析出标签
    result = {'title' : text, 'tag' : label.value} # 拼接成字典格式
    session['my_result'] = result # 存入 session ，以减少重复请求对模型的压力
    
    return jsonify(result) # 返回 json 格式的数据

if __name__ == '__main__':
    app.run(debug=True)  # 开发过程中开启 debug 调试模式
复制代码

启动服务

python app.py

前端 vue

前端采用 Vue 框架，与后端分离。使用 Webpack 进行资源管理与打包。

自定义组件

通过 vue init webpack flask_vue_ML 后，进入项目文件夹，增加自定义内容。

index.html

<!DOCTYPE html>
<html>
  <head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width,initial-scale=1.0">
    <title>exposemodel</title>
  </head>
  <body>
    <div id="app"></div>
    <!-- 其它文件会自动注入这里 -->
  </body>
</html>

复制代码

src 文件夹

components
- Home.vue // 自定义组件，增加
router
- index.js // 路由，修改
App.vue // 主组件，修改
main.js // 入口文件，修改

Home.vue

这里定义页面的基本样式，以及获取数据的逻辑。

<template>
  <div id="todo-list-example" class="container">
    <!-- 我是进度条，最上方的 -->
    <vue-progress-bar></vue-progress-bar>
    <div class="row">
      <div class="col-md-6 mx-auto">
        <h1 class="text-center">Natural Language Processing (NLP)</h1>
        <form v-on:submit.prevent="addNewTask">
          <label for="tasknameinput">Spam Classification</label>
          <input v-model="taskname" type="text" id="tasknameinput" class="form-control" placeholder="Enter Sentence">
          <button type="submit" class="btn btn-success btn-block mt-3">
            Submit
          </button>
        </form>
          
<!-- 省略表格定义内容 -->


<script>
// 这里解决跨域请求问题，向后端发起请求
import axios from 'axios'

export default {
  data () {
    return {
      textClassify: [],
      id: '',
      taskname: '',
      isEdit: false
    }
  },
  mounted () {
    this.getTasks()
  },
    
// 省略进度条内容
    
// 请求任务相关操作
    getTasks () {
      axios({ method: 'GET', url: '/api/tasks' }).then(
        result => {
          console.log(result.data)
          this.textClassify = result.data
        },
        error => {
          console.error(error)
        }
      )
    },
</script>
```
复制代码

index.js

定义路由，设定访问路径，并将路径和组件关联

import Vue from 'vue'
import Router from 'vue-router'
import Home from '@/components/Home'

Vue.use(Router)

export default new Router({
  routes: [
    {
      path: '/',
      name: 'Home',
      component: Home
    }
  ]
})
复制代码

App.vue

主组件

<template>
  <div id="app">
    <router-view/>
    <!-- 植入一波广告：微信搜索：谷粒先生，关注我的公众号 -->
    <img src="./assets/wechat.jpg">
  </div>
</template>

<script>
export default {
  name: 'App'
}
</script>

<style>
#app {
  font-family: 'Avenir', Helvetica, Arial, sans-serif;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  text-align: center;
  color: #2c3e50;
  margin-top: 60px;
}
</style>
复制代码

main.js

初始化实例并加载必要插件

// The Vue build version to load with the `import` command
// (runtime-only or standalone) has been set in webpack.base.conf with an alias.
import Vue from 'vue'
import App from './App'
import router from './router'
import VueProgressBar from 'vue-progressbar'
require('../node_modules/bootstrap/dist/css/bootstrap.css')

Vue.config.productionTip = false

// 这是进度条
Vue.use(VueProgressBar, {
  color: 'rgb(143, 255, 199)',
  failedColor: 'red',
  height: '10px'
})

/* eslint-disable no-new */
new Vue({
  el: '#app',
  router,
  components: { App },
  template: '<App/>'
})

复制代码

启动服务

npm run dev

模型 flair

模型这里采用 fair 框架，该框架在 2018 年底发布，易用性和效果都较前方案有了较大提升。这里直接采用官方样例训练好的垃圾邮件分类模型的权重，也就是在上文后端所读取的文件。关注我的公众号：谷粒先生，回复权重，即可获得权重文件:link:链接。

模型调用

from flair.models import TextClassifier # 模型导入，采用前不久开源的 flair 做文本分类
from flair.data import Sentence

classifier = TextClassifier.load_from_file('models/best-model.pt') # 模型加载

sentence = Sentence(title) # 对请求做数据预处理
classifier.predict(sentence) # 调用模型，做预测，返回带标签的数据
复制代码

效果展示

本教程针对文本分类这个场景，构建了一套前后端分离的“完整”框架，能够给到一个最直观的感受。当然，这里还有很多优化空间，还有后续部署等事宜没有详细展开，有心的同学可以自行检索学习。通过这套流程，可以在测试服搭建一套实用主义哲学的算法模型。给到领导做展示或是公司内部使用，已经足够。项目地址 kuhung/flask_vue_ML

以上就是本文的全部内容，希望本文的内容对大家的学习或者工作能带来一定的帮助，也希望大家多多支持码农网

查看所有标签

猜你喜欢:

本站部分资源来源于网络，本站转载出于传递更多信息之目的，版权归原作者或者来源机构所有，如转载稿涉及版权问题，请联系我们。

码农书籍

Cascading Style Sheets 2.0 Programmer's Reference

Eric A. Meyer / McGraw-Hill Osborne Media / 2001-03-20 / USD 19.99

The most authoritative quick reference available for CSS programmers. This handy resource gives you programming essentials at your fingertips, including all the new tags and features in CSS 2.0. You'l......一起来看看《Cascading Style Sheets 2.0 Programmer's Reference》这本书的介绍吧!

码农工具

机器学习模型部署--打通前后端任督二脉

模型算法的实用主义

后端 flask

相关依赖的安装

核心函数

启动服务

前端 vue

相关依赖的安装

自定义组件

index.html

src 文件夹

Home.vue

index.js

App.vue

main.js

启动服务

模型 flair

模型调用

效果展示

Cascading Style Sheets 2.0 Programmer's Reference

正则表达式在线测试

HEX CMYK 转换工具

HSV CMYK 转换工具