技术文章

写在前面的话 前后端分离的项目中，需要分别部署前端与后端项目。前端项目使用npm打包，将得到的dist文件夹下的内容上传到服务器后，用nginx的alias指向文件夹即可访问，而后端项目使用maven打包，需使用tomcat在后台启动，再通过nginx转发，供前端项目调用。 打包 前端的打包 前端项目使用的是vue-element-admin的基础版本：vue-admin-template 根据教程从github上下载后，在webstorm中运行成功。 原项目中只有前端，但可以完成简单的数据交互，根据使用手册介绍，该项目使用了mockjs模拟数据。 而我们需要做前后端交互，故不使用mockjs。 修改为访问后端的路径 方法很简单，在根目录下的.env.development文件下，将VUE_APP_BASE_API改为你的本地后端地址。 .env.development VUE_APP_BASE_API = 'http://localhost:8080' 在根目录下的.env.production文件下，将VUE_APP_BASE_API改为你的云服务器的后端地址。 .env.production # just a flag ENV = 'production' # base api VUE_APP_BASE_API = 'http://？？？？？？？/springbootdemo' 这里可能会有一些小bug，主要是要与服务器的路径对应起来。 根据该项目package.json内所设置的，使用npm run build:prod打包，生成dist文件夹 最后得到dist文件夹。 后端的打包 编写接口 首先，编写Controller，写一些接口。 package com.windypath.demo.controller; import com.windypath.demo.response.ResponseData; import com.windypath.demo.response.ResponseDataUtil; import org.springframework.web.bind.annotation.RequestMapping; import org.springframework.web.bind.annotation.RestController; @RequestMapping("/") @RestController public class MainController { @RequestMapping("/hello") public ResponseData hello() { return ResponseDataUtil.buildSuccess("hello!"); } @RequestMapping("/") public ResponseData root() { return ResponseDataUtil.buildSuccess("root!"); } } 此处使用的ResponseData来自于https://blog....

strip()、lstrip()、和rstrip() Python strip() 方法用于移除字符串头尾指定的字符（默认为空格或换行符）或字符序列。 注意：该方法只能删除开头或是结尾的字符，不能删除中间部分的字符。 lstrip()就是从左边匹配然后删除字符，rstrip()从右边匹配然后删除字符。 表面上挺好理解的，但是用起来还是有一些陷阱。 如： if __name__ == '__main__': string = 'abcdefghijkl' print(string.lstrip('bac')) # 输出 defghijkl 可以看到，虽然左侧开头的’abc’和’bac‘顺序不同，但lstrip()方法依旧将其匹配然后删除了。 所以如果我只是要删除开头的某一部分，比如获取标签内的字符： if __name__ == '__main__': string = '<a href="http://www.windypath.com">abcde</a>' print(string.lstrip('<a href="http://www.windypath.com">').rstrip('</a>')) # 输出 bcde 就会把标签内容的最左边的a给匹配到了。 那么如何实现只根据字符顺序，匹配前面的字符呢？ 用正则表达式：re.sub() Python 的 re 模块提供了re.sub用于替换字符串中的匹配项。 语法： re.sub(pattern, repl, string, count=0, flags=0) 参数： pattern : 正则中的模式字符串。 repl : 替换的字符串，也可为一个函数。 string : 要被查找替换的原始字符串。 count : 模式匹配后替换的最大次数，默认 0 表示替换所有的匹配。 使用该方法： import re if __name__ == '__main__': string = '<a href="http://www....

参考文献 java正则表达式（find()和 matches()） java正则表达式，求匹配：双反斜杠（\）合法，单反斜杠不合法（\） Java 正则表达式-菜鸟教程 正则表达式-菜鸟教程 Pattern类和Matcher类 在Java中，与正则表达式相关的类有两个：Pattern和Matcher 菜鸟教程已经介绍的很好了。 java.util.regex 包主要包括以下三个类： Pattern 类：pattern 对象是一个正则表达式的编译表示。Pattern 类没有公共构造方法。要创建一个 Pattern 对象，你必须首先调用其公共静态编译方法，它返回一个 Pattern 对象。该方法接受一个正则表达式作为它的第一个参数。 Matcher 类：Matcher 对象是对输入字符串进行解释和匹配操作的引擎。与Pattern 类一样，Matcher 也没有公共构造方法。你需要调用 Pattern 对象的 matcher 方法来获得一个 Matcher 对象。 PatternSyntaxException：PatternSyntaxException 是一个非强制异常类，它表示一个正则表达式模式中的语法错误。 然后菜鸟教程的第一个代码样例如下： import java.util.regex.*; class RegexExample1{ public static void main(String args[]){ String content = "I am noob " + "from runoob.com."; String pattern = ".*runoob.*"; boolean isMatch = Pattern.matches(pattern, content); System.out.println("字符串中是否包含了 'runoob' 子字符串? " + isMatch); } } 但我尝试把他改成自己的正则表达式，如”^I am“来匹配开头的”I am"字符串时，我发现程序一直返回false。...

爬虫的目的是采集网站的数据。而网站渲染数据有两种方式。我个人将其称为前端渲染和后端渲染。 前端渲染 前端渲染指的是网页并不直接展示数据，而是在读取完网页之后，再次向服务器请求数据。在得到数据之后再渲染到网页中。 后端渲染 后端渲染指的是服务器收到请求之后，将数据在后端写入网页，然后将带有数据的网页直接展示在浏览器中。 爬取方式 目前我并没有使用scrapy、webmagic等爬虫框架，仅使用python的requests模块，json模块和BeautifulSoup框架。 前端渲染的爬取方式 步骤：使用requests请求数据，再用json.loads()方法将返回的数据解析，最后操作得到的数据对象即可。 我们这里以豆瓣为例。 分析该网页。 爬取的url： https://movie.douban.com/explore#!type=movie&tag=%E7%83%AD%E9%97%A8&sort=recommend&page_limit=20&page_start=0 将url放进浏览器，先点开F12，然后访问。这里我使用谷歌浏览器 可以看到，红框内的All、XHR、JS等。这是一个筛选框，用来筛选该网页请求的数据。 All代表所有，XHR代表异步请求，JS代表Js文件，Css…… 对于前端渲染，必然有异步的过程，所以选择XHR。 通过观察，发现第三行是“选电影”列表的数据。 这时，我们点击Headers，查看其请求的详细信息。 可以看到，这是一个Get请求，在下面的Qurey String Parameters可以看到该请求的参数。 数据对应的网页内容为： 测试这个请求。 浏览器可以发起这个请求得到相应，但我们的代码不一定能做到。有一部分原因是网站开发者本身不希望数据被爬取。所以我们需要测试这个接口。这里推荐Postman，先对接口进行测试，查看是否有些Headers或者参数是不需要的，以简化代码量。 Postman的用法下回分解吧。 编写代码。 #!/usr/bin/env python # -*- coding: utf-8 -*- # @Time : 2019/11/15 22:11 # @Author : Johnathan Lin import requests import json if __name__ == '__main__': # 请求头，一般写上User-Agent防止爬虫，遇到有验证状态的网站要填写Cookie headers = { 'User-Agent': 'Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/77.0.3865.90 Safari/537.36' } # 请求Url url = 'https://movie....

​ vue-cli（vue脚手架）超详细教程：vue-cli（vue脚手架）超详细教程_Yin_Xiaobo的博客-CSDN博客_vue-cli(vue脚手架)超详细教程 这个教程里面是使用 vue init webpack app-name，但官方文档中建议的命令是 vue create app-name 但这两个命令创建的项目是有些不一样的，vue init是版本2的方法，vue create是版本3的方法。但网上搜索了一圈，有人说两种方法都是vue.js + webpack结合的。 当然了现在还不是很熟悉babel，所以根本看不懂。。 这回我使用vue init webpack vue-demo，一阵操作之后，得到： 这样的一个结构。注意，src/router下有个index.js，里面装着路由： import Vue from 'vue' import Router from 'vue-router' import HelloWorld from '@/components/HelloWorld' Vue.use(Router) export default new Router({ routes: [ { path: '/', name: 'HelloWorld', component: HelloWorld } ] }) 同时在components文件夹下有一个 HelloWorld.vue，里面装着一个模板文件。 注意到在/src/router/index.js里，第三行引入了HelloWorld的component，然后放在路由中，根目录指向的component。 所以在执行npm run dev之后，就可以直接打开HelloWorld了。 这个页面就是通过根目录的路由得到的。 然后我们添加一个路由： import Vue from 'vue' import Router from 'vue-router' import HelloWorld from '@/components/HelloWorld' import About from '@/components/About' Vue....