我使用instascan.min.js创建了一个使用html和javascript的QR扫描器，如下面的代码所示。目前，我可以扫描并查看网站上显示的QR码的内容，但我不知道如何POST QR码输出{scan.content}。QR值在html中传递到{scan.content}。
我想把它传递给python函数：view_doctor.py中的doctor_qrscan，以便写入数据库中。如有帮助，不胜感激！以下是相关代码：
{% block mainbody %}
{% verbatim %}
<div id="app2" class="container">
<head>
<title>Instascan – Demo</title>
<link rel="icon" type="image/png" href="favicon.png">
<!--<link rel="stylesheet" href="../static/css/style.css">-->
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/webrtc-adapter/3.3.3/adapter.min.js"></script>
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/vue/2.1.10/vue.min.js"></script>
<script type="text/javascript" src="https://rawgit.com/schmich/instascan-builds/master/instascan.min.js"></script>
</head>
<body>
<div id="app">
<div class="sidebar">
<section class="cameras">
<h2>Cameras</h2>
<ul>
<li v-if="cameras.length === 0" class="empty">No cameras found</li>
<li v-for="camera in cameras">
<span v-if="camera.id == activeCameraId" :title="formatName(camera.name)" class="active">{{ formatName(camera.name) }}</span>
<span v-if="camera.id != activeCameraId" :title="formatName(camera.name)">
<a @click.stop="selectCamera(camera)">{{ formatName(camera.name) }}</a>
</span>
</li>
</ul>
</section>
<section class="scans">
<h2>Scans</h2>
<ul v-if="scans.length === 0">
<li class="empty">No scans yet</li>
</ul>
<transition-group name="scans" tag="ul">
<li v-for="scan in scans" :key="scan.date" :title="scan.content">{{ scan.content }}</li>
</transition-group>
</section>
</div>
<div class="preview-container">
<video id="preview"></video>
</div>
</div>
</body>
</div>
{% endverbatim %}
<script>
var app = new Vue({
el: '#app2',
data: {
scanner: null,
activeCameraId: null,
cameras: [],
scans: []
},
mounted: function () {
var self = this;
self.scanner = new Instascan.Scanner({ video: document.getElementById('preview'), scanPeriod: 5});
self.scanner.addListener('scan', function (content, image) {
self.scans.unshift({ date: +(Date.now()), content: content });
});
Instascan.Camera.getCameras().then(function (cameras) {
self.cameras = cameras;
if (cameras.length > 0) {
self.activeCameraId = cameras[0].id;
self.scanner.start(cameras[0]);
} else {
console.error('There is no camera.');
}
}).catch(function (e) {
console.error(e);
});
},
methods: {
formatName: function (name) {
return name || '(unknown)';
},
selectCamera: function (camera) {
this.activeCameraId = camera.id;
this.scanner.start(camera);
}
}
});
</script>- <view_doctor.py>*
@api_view(['GET',"POST"])
def doctor_qrscan(request):
if request.method == 'POST':
# parse the JSON data
data = json.load(request)
result = data.get("scan.content") # Not sure if I am doing it correctly
if result != None:
c = connection.cursor()
# Saving the result to database
c.execute("INSERT INTO doctor_QR (output) VALUES ('{0}');".format(result))
return Action.success()
1条答案
按热度按时间kxeu7u2r1#
既然你使用的是DjangoREST框架，我建议你充分利用它的特性。
这包括通过定义模型来使用ORM，而不是使用原始的SQL语句，然后还可以使用序列化程序来验证数据并将其存储在DB中。
无论如何，如果您坚持以“手动”方式执行，那么
request.data将返回解析后的请求正文（JSON）内容。我并不真正了解您如何从前端发送数据，因此我不知道所发送数据的确切结构。