script.onload = () => { const bsdfp = new BSDeviceFingerprint() bsdfp.getFingerprint({ extendFields: [] }, (data) => { data = JSON.parse(data) console.log("fingerprint", data) localStorage.dfp = data.dfp; localStorage.exp = data.exp; }) } document.head.append(script);在vue里面怎么写
时间: 2024-03-22 13:42:56 浏览: 14
在 Vue 中,我们可以使用 `document.createElement('script')` 和 `document.head.appendChild(script)` 方法来动态添加 `<script>` 标签。在创建标签后,我们可以使用 `script.onload` 方法来指定脚本文件加载完成后要执行的函数。下面是一个示例代码:
```
<template>
<div></div>
</template>
<script>
export default {
data() {
return {
ymd: ''
}
},
created() {
const date = new Date();
const year = date.getFullYear();
const month = date.getMonth() + 1;
const day = date.getDate();
this.ymd = `${year}${month < 10 ? '0' : ''}${month}${day < 10 ? '0' : ''}${day}`;
const script = document.createElement('script');
script.src = `https://dfp.cmft.com.cn/dfp/public/downloads/frms-fingerprint.js?custID=dfp&serviceUrl=https://dfp.cmft.com.cn/dfp/public/generate/jsonp&channel=WEB&autoExec=false&ymd=${this.ymd}`;
script.onload = () => {
const bsdfp = new BSDeviceFingerprint();
bsdfp.getFingerprint({
extendFields: []
}, (data) => {
data = JSON.parse(data);
console.log("fingerprint", data);
localStorage.dfp = data.dfp;
localStorage.exp = data.exp;
});
};
document.head.appendChild(script);
}
}
</script>
```
在上面的代码中,我们创建了一个新的 `<script>` 标签,并将 `src` 属性设置为需要加载的脚本文件的 URL。然后,我们使用 `script.onload` 方法来指定脚本文件加载完成后要执行的函数。在函数中,我们实例化了 `BSDeviceFingerprint` 对象,并使用 `getFingerprint()` 方法获取设备指纹。当获取到指纹后,我们将其存储在 `localStorage` 中,以便在之后的代码中使用。注意,我们将 `ymd` 字符串作为 URL 的一个参数来传递给脚本文件,以便脚本文件可以使用该参数进行一些操作。最后,我们将该标签添加到 `<head>` 标签中。