背景
本次项目中,使用了vue+Django开发,但是没有构建构建vue项目,使用的是轻量级的vue。因此在解决问题的时候遇到了很多问题,如跨域、网站解析,解决起来比工程项目麻烦。
一、问题
由于没有使用vue整套的解决方案,因此在进行ajax或者是其他请求的时候,需要自己手动完成,因此记录一下自己遇到的问题。包括跨域的解决,重点在url的解析
二、解决办法
2.1 跨域
由于我后端使用的是Django,因此使用corsheaders可以很好的解决问题,可以参考我在跨域问题中解决问题的blog,值得一提的是查看别人的blog,只有同域名下的内容可以访问,给出图片的链接地址。除此之外都涉及到跨域问题的解决。与此同时下面的几个标签不收跨域的影响。
<img src=XXX> # 图片的地址
<link href=XXX> # css的文件资源
<script src=XXX> # js的脚本资源
2.2 解析
我使用的是Django做后端,但是在解析的时候遇到一些问题,由于传入的数据是bytes,因此我们需要把数据进行转码,但是出现了一个问题就是无法解决下面出现的url,当然这跟我的请求方式有问题,我用的是post的请求方式。
name=%E9%98%BF%E6%96%AF%E8%92%82%E8%8A%AC
前段代码,使用的是jQuery发送的Ajax的请求
// 使用jQuery发送请求的关键代码,同时使用了vue.js
$.ajax({
url: globalurl + 'register/1.html',
type: 'post',
data: {email: this.email, password: this.Password},
contentType: 'application/json;charset=utf-8',
dataType: 'json',
success: function (message) {
alert("提交成功"+JSON.stringify(message));
},
error: function () {
alert("注册失败请重新尝试!");
this.email = "";
this.Password = "";
this.RepeatPassword = "";
}
})
这样的数据传送到后端,就需要引入unquote进行解析,使用下面的指令安装包
# 使用下面的指令安装urllib库
pip install urllib
使用以下的代码,进行解析
from urllib.parse import unquote
def transform(str_param):
param = {i[0]: unquote(i[1]).encode('utf-8').decode('utf-8') for i in [i.split('=') for i in str_param.split('&')]}
return param
结果