工作总结（采坑及总结）

此文章仅供于记录本人日常工作上遇到的一些问题及经验总结

1、ajax参数传递到后端中文会被转换为16进制字符串

from urllib.request import quote, unquote
report_pdf_name='%E4%B9%99%E9%86%87%E6%8E%A7%E5%88%B6%E5%AF%B9%E7%8E%AF%E5%AD%A2%E7%B4%A0%E8%BD%AF%E8%83%B6%E5%9B%8A%E8%B4%A8%E9%87%8F%E5%BD%B1%E5%93%8D%E7%A0%94%E7%A9%B6.docx'
report_pdf_name = unquote(report_pdf_name)

2、Django ConnectionAbortedError: [WinError 10053]一系列错误

错误范例：

Exception happened during processing of request from ('127.0.0.1', 61328)
Traceback (most recent call last):
  File "D:\Anaconda\lib\wsgiref\handlers.py", line 138, in run
    self.finish_response()
  File "D:\Anaconda\lib\wsgiref\handlers.py", line 180, in finish_response
    self.write(data)
  File "D:\Anaconda\lib\wsgiref\handlers.py", line 274, in write
    self.send_headers()
  File "D:\Anaconda\lib\wsgiref\handlers.py", line 332, in send_headers
    self.send_preamble()
  File "D:\Anaconda\lib\wsgiref\handlers.py", line 255, in send_preamble
    ('Date: %s\r\n' % format_date_time(time.time())).encode('iso-8859-1')
  File "D:\Anaconda\lib\wsgiref\handlers.py", line 453, in _write
    result = self.stdout.write(data)
  File "D:\Anaconda\lib\socketserver.py", line 775, in write
    self._sock.sendall(b)
ConnectionAbortedError: [WinError 10053] 你的主机中的软件中止了一个已建立的连接。
 
During handling of the above exception, another exception occurred:
 
Traceback (most recent call last):
  File "D:\Anaconda\lib\wsgiref\handlers.py", line 141, in run
    self.handle_error()
  File "D:\Anaconda\lib\site-packages\django\core\servers\basehttp.py", line 86, in handle_error
    super().handle_error()
  File "D:\Anaconda\lib\wsgiref\handlers.py", line 368, in handle_error
    self.finish_response()
  File "D:\Anaconda\lib\wsgiref\handlers.py", line 180, in finish_response
    self.write(data)
  File "D:\Anaconda\lib\wsgiref\handlers.py", line 274, in write
    self.send_headers()
  File "D:\Anaconda\lib\wsgiref\handlers.py", line 331, in send_headers
    if not self.origin_server or self.client_is_modern():
  File "D:\Anaconda\lib\wsgiref\handlers.py", line 344, in client_is_modern
    return self.environ['SERVER_PROTOCOL'].upper() != 'HTTP/0.9'
TypeError: 'NoneType' object is not subscriptable
 
During handling of the above exception, another exception occurred:
 
Traceback (most recent call last):
  File "D:\Anaconda\lib\socketserver.py", line 639, in process_request_thread
    self.finish_request(request, client_address)
  File "D:\Anaconda\lib\socketserver.py", line 361, in finish_request
    self.RequestHandlerClass(request, client_address, self)
  File "D:\Anaconda\lib\socketserver.py", line 696, in __init__
    self.handle()
  File "D:\Anaconda\lib\site-packages\django\core\servers\basehttp.py", line 154, in handle
    handler.run(self.server.get_app())
  File "D:\Anaconda\lib\wsgiref\handlers.py", line 144, in run
    self.close()
  File "D:\Anaconda\lib\wsgiref\simple_server.py", line 35, in close
    self.status.split(' ',1)[0], self.bytes_sent
AttributeError: 'NoneType' object has no attribute 'split'

解决方式一：
在ajax进行异步提交时，将async 改为 false 即可

$.ajax({  
         type : "post",  
         url : "**************",  
         data : data,  
         async : false,  
         success : function(data){  
            alert(data)  
         }  
     });

解决方式二：
1、找到D:\Anaconda\lib\socketserver.py文件775行，修改SocketWriter类的write方法，具体如下：

def write(self, b):
        try:
            self._sock.sendall(b)
        except Exception as e:
          self._sock.close()
        with memoryview(b) as view:
            return view.nbytes

2、找到D:\Anaconda\lib\wsgiref\handlers.py文件344行，修改client_is_modern函数，具体如下：

def client_is_modern(self):
        """True if client can accept status and headers"""
        try:
            cmp = self.environ['SERVER_PROTOCOL'].upper() != 'HTTP/0.9'
        except Exception as e:
            cmp = False
        return cmp

3、打开python\lib\wsgiref\simple_server.py文件28行，修改ServerHandler类，具体如下：

class ServerHandler(SimpleHandler):
 
    server_software = software_version
 
    def close(self):
        try:
            self.request_handler.log_request(
                self.status.split(' ',1)[0], self.bytes_sent
            )
            SimpleHandler.close(self)
        except Exception as e:
            SimpleHandler.close(self)

3、前后端分离的意义

1.彻底解放前端

前端不再需要向后台提供模板或是后台在前端html中嵌入后台代码
前端通过AJAX调用后台接口，数据逻辑放在前端，由前端维护。

2.提高工作效率，分工更加明确

前后端分离的工作流程可以使前端只关注前端的事，后台只关心后台的活，两者开发可以同时进行，在后台还没有时间提供接口的时候，前端可以先将数据写死或者调用本地的json文件即可，页面的增加和路由的修改也不必再去麻烦后台，开发更加灵活。

3.局部性能提升

通过前端路由的配置，我们可以实现页面的按需加载，无需一开始加载首页便加载网站的所有的资源，服务器也不再需要解析前端页面，在页面交互及用户体验上有所提升。

4.降低维护成本

通过目前主流的前端MVC框架，我们可以非常快速的定位及发现问题的所在，客户端的问题不再需要后台人员参与及调试，代码重构及可维护性增强。

5.总结

我都会为前后端分离带来的优势而感慨一番：
1、项目一开始制作前端页面的时候，我不再需要后台给我配置服务器环境了
2、项目的前端文件可以在需要调用后台接口的时候丢进服务器就好了，完全不需要事先放进去
3、增加一个项目页面需要配置路由的时候不再需要让后台同事给我加了，自己前端搞定
4、前端文件里不再掺杂后台的代码逻辑了，看起来舒服多了
5、页面跳转比之前更加流畅了，局部渲染局部加载非常快速
6、页面模板可以重复使用了，前端组件化开发提高了开发效率

4、Linux解压zip文件乱码问题

解决方式：

unzip -O CP936 xxx.zip

5、PYPDF2错误

PyPDF2.utils.PdfReadError: Illegal character in Name Object

修改三方库PyPDF2里的generic.py及utils.py如下：

utils

generic

6、MYSQL实现聚合所有文章地域，并返回聚合数量

如：{‘美国’:100,'中国'：159}

Report.objects.extra(select={'region_id': 'regional_id'}).values('regional_id').annotate(count=Count('regional_id')).order_by('-count')

7、python单例模式

class MusicPlayer(object):
    # 记录第一个被创建对象的引用
    instance = None
    # 记录是否执行过初始化动作
    init_flag = False

    def __new__(cls, *args, **kwargs):

        # 1. 判断类属性是否是空对象
        if cls.instance is None:
            # 2. 调用父类的方法，为第一个对象分配空间
            cls.instance = super().__new__(cls)

        # 3. 返回类属性保存的对象引用
        return cls.instance

    def __init__(self):

        if not MusicPlayer.init_flag:
            print("初始化音乐播放器")

            MusicPlayer.init_flag = True

# 创建多个对象
player1 = MusicPlayer()
player1.num = 1
print(player1.init_flag)
print(player1.instance)

player2 = MusicPlayer()
player2.num +=1
print(player2.init_flag)
print(player2.instance)
print(player2.num)

8、layui图片上传如何获取base64

直接将file转base64位，并传输到远程服务器

# 获取图片
def report_upload(request):
    file = request.FILES.get('file')
    file_name = file.name
    base64_data = base64.b64encode(file.read())
    file_base = base64_data.decode()
    file_base = file_base.split('base64,')[-1]
    name = ''.join(str(uuid4()).split('-')) + "." + file_name.split(".")[-1]
    requests.post("http://192.168.0.157:7999/face", data={"img_name": name, "img_data": file_base})
    url = "http://192.168.0.157:8001/face/" + name
    return JsonResponse({'code': 0, 'msg': '请求成功', 'data': {'url': url}})

9、layui复选框如何将值传输到后端

//获取checkbox[name='like']的值
var arr = new Array();
$("input:checkbox[name='like']:checked").each(function(i){
   arr[i] = $(this).val();
});
data.field.like = arr.join(",");//将数组合并成字符串

10、Element表单重置的坑

[Vue warn]: Error in event handler for "click": "TypeError: Cannot read property 'resetFields' of undefined"

解决：

this.$nextTick(()=>{

   this.$refs['addForm'].resetFields();

})

11、Vue兄弟组件实现通信

参考：https://blog.csdn.net/u010320804/article/details/79485047

12、Vue监听回车事件

@keyup.13.native="show_all"

13、Vuex的使用

由三个部分state、mutations、actions
值的声明需要在：state中
值的修改需要在：mutations中
因为mutations不能进行异步，所以需要在actions里面进行申请数据

14、关于vue ajax设置响应超时问题

export const postFileToJpg = (query) => service.post('http://192.168.0.189:8001/intelligence/api_back_file_to_jpg/', query,{timeout: 1000 * 60 * 10})

15、Vue 子传父和父传子的问题

1）父组件触发子组件的方法

父组件：

 


子组件：

 

2）子组件调用父组件的方法

父组件：



子组件：

15、JavaScript实现深拷贝

const form_data = JSON.parse(JSON.stringify(this.form))

附:
js深浅拷贝概念参考地址：https://www.cnblogs.com/136asdxxl/p/8645750.html

16、python 调用AES加密

python版本：3.6.5
首先安装pycryptodome

pip install pycryptodome

CBC加密需要一个key(密钥)和一个十六位iv(偏移量)
ECB加密不需要iv
下列例子采用CBC加密方式：

# AES加密方式有五种：ECB, CBC, CTR, CFB, OFB
from Crypto.Cipher import AES
from binascii import b2a_hex, a2b_hex
import json
# 密钥
key = 'F1TnWTfbPdsoZUaR'  # 密匙长度可为 16、24或32位
# 偏移量(因为是使用CBC模式所以，需要盐值参数)
iv = b'e9Ao7UWjjHGqeYOo'


# 如果text不是16位的倍数就用空格补足为16位
def add_to_16(text):
    if len(text.encode('utf-8')) % 16:
        add = 16 - (len(text.encode('utf-8')) % 16)
    else:
        add = 0
    text = text + ('\0' * add)
    return text.encode('utf-8')


# 加密函数
def encrypt(text):
    text = add_to_16(text)
    # 进行加密算法，模式ECB模式，把叠加完16位的秘钥传进来
    cryptos = AES.new(key.encode('utf-8'), AES.MODE_CBC, iv)
    cipher_text = cryptos.encrypt(text)
    # 因为AES加密后的字符串不一定是ascii字符集的，输出保存可能存在问题，所以这里转为16进制字符串
    return b2a_hex(cipher_text)


# 解密后，去掉补足的空格用strip() 去掉
def decrypt(text):
    cryptos = AES.new(key.encode('utf-8'), AES.MODE_CBC, iv)
    plain_text = cryptos.decrypt(a2b_hex(text))
    return bytes.decode(plain_text).rstrip('\0')


if __name__ == '__main__':
    e = encrypt(json.dumps({'id': '1', 'username': '姓名', 'pwd': 123456}))  # 加密
    d = decrypt(e)  # 解密
    print("加密:", e)
    print("解密:", json.loads(d))
    pass

17、解决 413 Request Entity Too Large

今天测试环境图片上传出现：Status Code:413 Request Entity Too Large

这是由于客服端可服务端之间采用了nginx做反向代理，当请求长度超过客户端(client_max_body_size )最大请求，就会出现413 entity too large的错误。

所以我们需要设置nginx的客户端最大请求大小：

client_max_body_size 10m;

可适用于 http server location不同的级别

18、js map()定义与用法

基本用法跟forEach方法类似
    map() 方法返回一个新数组，数组中的元素为原始数组元素调用函数处理后的值。
    map() 方法按照原始数组元素顺序依次处理元素。
        注意： map() 不会对空数组进行检测。
        注意： map()返回的是新数组，map() 不会改变原始数组。
    语法：
        array.map(function(currentValue,index,arr), thisValue)
    参数说明：
        function(currentValue, index,arr)：
            必须。函数，数组中的每个元素都会执行这个函数
            函数参数:
                currentValue     必须。当前元素的值
                index             可选。当前元素的索引值
                arr             可选。当前元素属于的数组对象
        thisValue：
            可选。对象作为该执行回调时使用，传递给函数，用作 "this" 的值。
            如果省略了 thisValue，或者传入 null、undefined，那么回调函数的 this 为全局对象。
    注意：
        function(currentValue, index,arr)回调函数必须要return返回值，不然会返回一个undefind的数组

    实际使用的时候，可以利用map方法方便获得对象数组中的特定属性值们。

实例： 
    var users = [
        {name: "熊大", "email": "[email protected]"},
        {name: "熊二",   "email": "[email protected]"},
        {name: "光头强",  "email": "[email protected]"}
    ];
    // emails => email的数组
    var emails = users.map(function (user) { return user.email; });

19、PIL.Image与Base64 String的互相转换

import base64
from io import BytesIO
import re
# pip3 install pillow
from PIL import Image

# 若img.save()报错 cannot write mode RGBA as JPEG
# 则img = Image.open(image_path).convert('RGB')

def image_to_base64(image_path):
    img = Image.open(image_path)
    output_buffer = BytesIO()
    img.save(output_buffer, format='JPEG')
    byte_data = output_buffer.getvalue()
    base64_str = base64.b64encode(byte_data)
    return base64_str


def base64_to_image(base64_str, image_path=None):
    base64_data = re.sub('^data:image/.+;base64,', '', base64_str)
    byte_data = base64.b64decode(base64_data)
    image_data = BytesIO(byte_data)
    img = Image.open(image_data)
    if image_path:
        img.save(image_path)
    return img

20、mysql联合索引

参考链接：https://blog.csdn.net/y87329396/article/details/51292457

截止到目前的5.7.4版本为止，MySQL的联合索引仍无法支持联合索引使用不同排序规则，例如：ALTER TABLE t ADD INDEX idx(col1, col2 DESC)。

在项目中遇到了需要进行两个字段进行排序，增加一个排序字段，操作就会成倍增加，所以需要建立联合索引（可以用explain 进行查看是否使用了联合索引）

21、django对字段添加权重（自定义排序）

参考链接：https://blog.csdn.net/weixin_30865427/article/details/98743949
参考资料里面是原生sql，可以再django中使用extra（）方法
extra使用方式

#(extra进行字段添加权重，标题权重99，描述1)
report_obj_list1 = title_con_all.filter(source_id=1).order_by('-id').extra(
            select={
                'weight': f'(IF(LOCATE("{key}",report_report.report_title) , 99, 0) + IF(LOCATE("{key}",report_report.report_abstract) , 1, 0))'})
report_obj_list1.order_by('-weight')

21、linux根据名称查询并杀死所有包含的进程

ps -ef|grep uwsgi | grep -v grep | awk '{print $2}'| xargs kill -9

查询出来的进程id