Skip to content

Commit 075b240

Browse files
TsMaskTsMask
committed
feat: 路由hash地址，访问路径改为/face-api-demo-vue
1 parent 25749c7 commit 075b240

16 files changed

+92
-82
lines changed

‎src/App.vue‎

Lines changed: 7 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,8 +1,14 @@
1+
<script setup>
2+
import { useRouter } from "vue-router";
3+
const router = useRouter(); // 返回路由器实例
4+
const routes = router.getRoutes();
5+
</script>
6+
17
<template>
28
<div class="layout">
39
<div class="layout_nav">
410
<ul>
5-
<li v-for="(item, index) in $router.options.routes" :key="index">
11+
<li v-for="(item, index) in routes" :key="index">
612
<router-link :to="item.path" v-text="item.meta.title"></router-link>
713
</li>
814
</ul>

‎src/router/index.js‎

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,8 +1,8 @@
1-
import { createRouter, createWebHistory } from "vue-router";
1+
import { createRouter, createWebHashHistory } from "vue-router";
22
import routes from "./routes";
33

44
const router = new createRouter({
5-
history: createWebHistory(),
5+
history: createWebHashHistory(),
66
routes,
77
scrollBehavior(to, from, savedPosition) {
88
if (savedPosition) {

‎src/views/AgeAndGenderRecognition.vue‎

Lines changed: 5 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -25,23 +25,23 @@ const state = reactive({
2525
/**初始化模型加载 */
2626
async function fnLoadModel() {
2727
// 面部轮廓模型
28-
await faceapi.loadFaceLandmarkModel("/models");
28+
await faceapi.loadFaceLandmarkModel(`${import.meta.env.BASE_URL}/models`);
2929
// 年龄性别模型
30-
await faceapi.loadAgeGenderModel("/models");
30+
await faceapi.loadAgeGenderModel(`${import.meta.env.BASE_URL}/models`);
3131
3232
// 模型参数-ssdMobilenetv1
33-
await faceapi.nets.ssdMobilenetv1.loadFromUri("/models");
33+
await faceapi.nets.ssdMobilenetv1.loadFromUri(`${import.meta.env.BASE_URL}/models`);
3434
state.netsOptions.ssdMobilenetv1 = new faceapi.SsdMobilenetv1Options({
3535
minConfidence: 0.5, // 0.1 ~ 0.9
3636
});
3737
// 模型参数-tinyFaceDetector
38-
await faceapi.nets.tinyFaceDetector.loadFromUri("/models");
38+
await faceapi.nets.tinyFaceDetector.loadFromUri(`${import.meta.env.BASE_URL}/models`);
3939
state.netsOptions.tinyFaceDetector = new faceapi.TinyFaceDetectorOptions({
4040
inputSize: 512, // 160 224 320 416 512 608
4141
scoreThreshold: 0.5, // 0.1 ~ 0.9
4242
});
4343
// 模型参数-mtcnn 已弃用，将很快被删除
44-
await faceapi.nets.mtcnn.loadFromUri("/models");
44+
await faceapi.nets.mtcnn.loadFromUri(`${import.meta.env.BASE_URL}/models`);
4545
state.netsOptions.mtcnn = new faceapi.MtcnnOptions({
4646
minFaceSize: 20, // 1 ~ 50
4747
scaleFactor: 0.66, // 0.1 ~ 0.9

‎src/views/BBTFaceRecognition.vue‎

Lines changed: 19 additions & 15 deletions
Original file line numberDiff line numberDiff line change
@@ -23,21 +23,21 @@ const state = reactive({
2323
// 预设样本图，支持本地，网络，beas64
2424
sampleArr: [
2525
{
26-
name: "曾小贤",
26+
name: "张伟",
2727
imgs: [
28-
"/images/zxx/face/zxx01.png",
29-
"/images/zxx/face/zxx02.png",
30-
"/images/zxx/face/zxx03.png",
31-
"/images/zxx/face/zxx04.png",
28+
`${import.meta.env.BASE_URL}/images/zw/face/zw01.png`,
29+
`${import.meta.env.BASE_URL}/images/zw/face/zw02.png`,
30+
`${import.meta.env.BASE_URL}/images/zw/face/zw03.png`,
31+
`${import.meta.env.BASE_URL}/images/zw/face/zw04.png`,
3232
],
3333
},
3434
{
35-
name: "张伟",
35+
name: "曾小贤",
3636
imgs: [
37-
"/images/zw/face/zw01.png",
38-
"/images/zw/face/zw02.png",
39-
"/images/zw/face/zw03.png",
40-
"/images/zw/face/zw04.png",
37+
`${import.meta.env.BASE_URL}/images/zxx/face/zxx01.png`,
38+
`${import.meta.env.BASE_URL}/images/zxx/face/zxx02.png`,
39+
`${import.meta.env.BASE_URL}/images/zxx/face/zxx03.png`,
40+
`${import.meta.env.BASE_URL}/images/zxx/face/zxx04.png`,
4141
],
4242
},
4343
],
@@ -46,23 +46,27 @@ const state = reactive({
4646
/**初始化模型加载 */
4747
async function fnLoadModel() {
4848
// 面部轮廓模型
49-
await faceapi.loadFaceLandmarkModel("/models");
49+
await faceapi.loadFaceLandmarkModel(`${import.meta.env.BASE_URL}/models`);
5050
// 面部识别模型
51-
await faceapi.loadFaceRecognitionModel("/models");
51+
await faceapi.loadFaceRecognitionModel(`${import.meta.env.BASE_URL}/models`);
5252
5353
// 模型参数-ssdMobilenetv1
54-
await faceapi.nets.ssdMobilenetv1.loadFromUri("/models");
54+
await faceapi.nets.ssdMobilenetv1.loadFromUri(
55+
`${import.meta.env.BASE_URL}/models`
56+
);
5557
state.netsOptions.ssdMobilenetv1 = new faceapi.SsdMobilenetv1Options({
5658
minConfidence: 0.6, // 0.1 ~ 0.9
5759
});
5860
// 模型参数-tinyFaceDetector
59-
await faceapi.nets.tinyFaceDetector.loadFromUri("/models");
61+
await faceapi.nets.tinyFaceDetector.loadFromUri(
62+
`${import.meta.env.BASE_URL}/models`
63+
);
6064
state.netsOptions.tinyFaceDetector = new faceapi.TinyFaceDetectorOptions({
6165
inputSize: 512, // 160 224 320 416 512 608
6266
scoreThreshold: 0.5, // 0.1 ~ 0.9
6367
});
6468
// 模型参数-mtcnn 已弃用，将很快被删除
65-
await faceapi.nets.mtcnn.loadFromUri("/models");
69+
await faceapi.nets.mtcnn.loadFromUri(`${import.meta.env.BASE_URL}/models`);
6670
state.netsOptions.mtcnn = new faceapi.MtcnnOptions({
6771
minFaceSize: 20, // 1 ~ 50
6872
scaleFactor: 0.709, // 0.1 ~ 0.9

‎src/views/BBTFaceSimilarity.vue‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -21,7 +21,7 @@ const state = reactive({
2121
/**初始化模型加载 */
2222
async function fnLoadModel() {
2323
// 面部识别模型
24-
await faceapi.loadFaceRecognitionModel("/models");
24+
await faceapi.loadFaceRecognitionModel(`${import.meta.env.BASE_URL}/models`);
2525
2626
// 节点元素
2727
state.targetImgEl = document.getElementById("page_draw-img-target");

‎src/views/BBTFaceSimilarityMore.vue‎

Lines changed: 13 additions & 13 deletions
Original file line numberDiff line numberDiff line change
@@ -11,28 +11,28 @@ const state = reactive({
1111
{
1212
name: "张伟",
1313
imgs: [
14-
"/images/zw/zw01.jpg",
15-
"/images/zw/zw02.jpg",
16-
"/images/zw/zw03.jpg",
17-
"/images/zw/zw04.jpg",
14+
`${import.meta.env.BASE_URL}/images/zw/zw01.jpg`,
15+
`${import.meta.env.BASE_URL}/images/zw/zw02.jpg`,
16+
`${import.meta.env.BASE_URL}/images/zw/zw03.jpg`,
17+
`${import.meta.env.BASE_URL}/images/zw/zw04.jpg`,
1818
],
1919
},
2020
{
2121
name: "曾小贤",
2222
imgs: [
23-
"/images/zxx/zxx01.jpg",
24-
"/images/zxx/zxx02.jpg",
25-
"/images/zxx/zxx03.jpg",
26-
"/images/zxx/zxx04.jpg",
23+
`${import.meta.env.BASE_URL}/images/zxx/zxx01.jpg`,
24+
`${import.meta.env.BASE_URL}/images/zxx/zxx02.jpg`,
25+
`${import.meta.env.BASE_URL}/images/zxx/zxx03.jpg`,
26+
`${import.meta.env.BASE_URL}/images/zxx/zxx04.jpg`,
2727
],
2828
},
2929
],
3030
// 匹配图，支持本地，网络，beas64
3131
detArr: [
32-
"/images/zw/zw04.jpg",
33-
"/images/zw/zw02.jpg",
34-
"/images/zxx/zxx02.jpg",
35-
"/images/zxx/zxx04.jpg",
32+
`${import.meta.env.BASE_URL}/images/zw/zw02.jpg`,
33+
`${import.meta.env.BASE_URL}/images/zw/zw04.jpg`,
34+
`${import.meta.env.BASE_URL}/images/zxx/zxx02.jpg`,
35+
`${import.meta.env.BASE_URL}/images/zxx/zxx04.jpg`,
3636
],
3737
// 匹配结果
3838
resultArr: [],
@@ -43,7 +43,7 @@ const state = reactive({
4343
/**初始化模型加载 */
4444
async function fnLoadModel() {
4545
// 面部识别模型
46-
await faceapi.loadFaceRecognitionModel("/models");
46+
await faceapi.loadFaceRecognitionModel(`${import.meta.env.BASE_URL}/models`);
4747
4848
// 关闭模型加载
4949
state.netsLoadModel = false;

‎src/views/FaceExpressionRecognition.vue‎

Lines changed: 5 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -25,23 +25,23 @@ const state = reactive({
2525
/**初始化模型加载 */
2626
async function fnLoadModel() {
2727
// 面部轮廓模型
28-
await faceapi.loadFaceLandmarkModel("/models");
28+
await faceapi.loadFaceLandmarkModel(`${import.meta.env.BASE_URL}/models`);
2929
// 面部表情模型
30-
await faceapi.loadFaceExpressionModel("/models");
30+
await faceapi.loadFaceExpressionModel(`${import.meta.env.BASE_URL}/models`);
3131
3232
// 模型参数-ssdMobilenetv1
33-
await faceapi.nets.ssdMobilenetv1.loadFromUri("/models");
33+
await faceapi.nets.ssdMobilenetv1.loadFromUri(`${import.meta.env.BASE_URL}/models`);
3434
state.netsOptions.ssdMobilenetv1 = new faceapi.SsdMobilenetv1Options({
3535
minConfidence: 0.5, // 0.1 ~ 0.9
3636
});
3737
// 模型参数-tinyFaceDetector
38-
await faceapi.nets.tinyFaceDetector.loadFromUri("/models");
38+
await faceapi.nets.tinyFaceDetector.loadFromUri(`${import.meta.env.BASE_URL}/models`);
3939
state.netsOptions.tinyFaceDetector = new faceapi.TinyFaceDetectorOptions({
4040
inputSize: 224, // 160 224 320 416 512 608
4141
scoreThreshold: 0.5, // 0.1 ~ 0.9
4242
});
4343
// 模型参数-mtcnn 已弃用，将很快被删除
44-
await faceapi.nets.mtcnn.loadFromUri("/models");
44+
await faceapi.nets.mtcnn.loadFromUri(`${import.meta.env.BASE_URL}/models`);
4545
state.netsOptions.mtcnn = new faceapi.MtcnnOptions({
4646
minFaceSize: 20, // 1 ~ 50
4747
scaleFactor: 0.56, // 0.1 ~ 0.9

‎src/views/FaceExtraction.vue‎

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -23,18 +23,18 @@ const state = reactive({
2323
/**初始化模型加载 */
2424
async function fnLoadModel() {
2525
// 模型参数-ssdMobilenetv1
26-
await faceapi.nets.ssdMobilenetv1.loadFromUri("/models");
26+
await faceapi.nets.ssdMobilenetv1.loadFromUri(`${import.meta.env.BASE_URL}/models`);
2727
state.netsOptions.ssdMobilenetv1 = new faceapi.SsdMobilenetv1Options({
2828
minConfidence: 0.5, // 0.1 ~ 0.9
2929
});
3030
// 模型参数-tinyFaceDetector
31-
await faceapi.nets.tinyFaceDetector.loadFromUri("/models");
31+
await faceapi.nets.tinyFaceDetector.loadFromUri(`${import.meta.env.BASE_URL}/models`);
3232
state.netsOptions.tinyFaceDetector = new faceapi.TinyFaceDetectorOptions({
3333
inputSize: 224, // 160 224 320 416 512 608
3434
scoreThreshold: 0.5, // 0.1 ~ 0.9
3535
});
3636
// 模型参数-mtcnn 已弃用，将很快被删除
37-
await faceapi.nets.mtcnn.loadFromUri("/models");
37+
await faceapi.nets.mtcnn.loadFromUri(`${import.meta.env.BASE_URL}/models`);
3838
state.netsOptions.mtcnn = new faceapi.MtcnnOptions({
3939
minFaceSize: 20, // 1 ~ 50
4040
scaleFactor: 0.56, // 0.1 ~ 0.9

‎src/views/FaceLandmarkDetection.vue‎

Lines changed: 4 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -25,21 +25,21 @@ const state = reactive({
2525
/**初始化模型加载 */
2626
async function fnLoadModel() {
2727
// 面部轮廓模型
28-
await faceapi.loadFaceLandmarkModel("/models");
28+
await faceapi.loadFaceLandmarkModel(`${import.meta.env.BASE_URL}/models`);
2929
3030
// 模型参数-ssdMobilenetv1
31-
await faceapi.nets.ssdMobilenetv1.loadFromUri("/models");
31+
await faceapi.nets.ssdMobilenetv1.loadFromUri(`${import.meta.env.BASE_URL}/models`);
3232
state.netsOptions.ssdMobilenetv1 = new faceapi.SsdMobilenetv1Options({
3333
minConfidence: 0.5, // 0.1 ~ 0.9
3434
});
3535
// 模型参数-tinyFaceDetector
36-
await faceapi.nets.tinyFaceDetector.loadFromUri("/models");
36+
await faceapi.nets.tinyFaceDetector.loadFromUri(`${import.meta.env.BASE_URL}/models`);
3737
state.netsOptions.tinyFaceDetector = new faceapi.TinyFaceDetectorOptions({
3838
inputSize: 512, // 160 224 320 416 512 608
3939
scoreThreshold: 0.5, // 0.1 ~ 0.9
4040
});
4141
// 模型参数-mtcnn 已弃用，将很快被删除
42-
await faceapi.nets.mtcnn.loadFromUri("/models");
42+
await faceapi.nets.mtcnn.loadFromUri(`${import.meta.env.BASE_URL}/models`);
4343
state.netsOptions.mtcnn = new faceapi.MtcnnOptions({
4444
minFaceSize: 20, // 1 ~ 50
4545
scaleFactor: 0.709, // 0.1 ~ 0.9

‎src/views/FaceRecognition.vue‎

Lines changed: 5 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -29,23 +29,23 @@ const state = reactive({
2929
/**初始化模型加载 */
3030
async function fnLoadModel() {
3131
// 面部轮廓模型
32-
await faceapi.loadFaceLandmarkModel("/models");
32+
await faceapi.loadFaceLandmarkModel(`${import.meta.env.BASE_URL}/models`);
3333
// 面部识别模型
34-
await faceapi.loadFaceRecognitionModel("/models");
34+
await faceapi.loadFaceRecognitionModel(`${import.meta.env.BASE_URL}/models`);
3535
3636
// 模型参数-ssdMobilenetv1
37-
await faceapi.nets.ssdMobilenetv1.loadFromUri("/models");
37+
await faceapi.nets.ssdMobilenetv1.loadFromUri(`${import.meta.env.BASE_URL}/models`);
3838
state.netsOptions.ssdMobilenetv1 = new faceapi.SsdMobilenetv1Options({
3939
minConfidence: 0.5, // 0.1 ~ 0.9
4040
});
4141
// 模型参数-tinyFaceDetector
42-
await faceapi.nets.tinyFaceDetector.loadFromUri("/models");
42+
await faceapi.nets.tinyFaceDetector.loadFromUri(`${import.meta.env.BASE_URL}/models`);
4343
state.netsOptions.tinyFaceDetector = new faceapi.TinyFaceDetectorOptions({
4444
inputSize: 512, // 160 224 320 416 512 608
4545
scoreThreshold: 0.5, // 0.1 ~ 0.9
4646
});
4747
// 模型参数-mtcnn 已弃用，将很快被删除
48-
await faceapi.nets.mtcnn.loadFromUri("/models");
48+
await faceapi.nets.mtcnn.loadFromUri(`${import.meta.env.BASE_URL}/models`);
4949
state.netsOptions.mtcnn = new faceapi.MtcnnOptions({
5050
minFaceSize: 20, // 1 ~ 50
5151
scaleFactor: 0.709, // 0.1 ~ 0.9

0 commit comments

Comments
 (0)