tauri加载本地资源展示到前端页面报错because it appears in neither the directive nor the default-src direc

Refused to load asset://localhost/%2FUsers%2Fsong%2FLibrary%2FCaches%2Fdefault.png because it does not appear in the img-src directive of the Content Security Policy.

Refused to apply a stylesheet because its hash, its nonce, or 'unsafe-inline' appears in neither the style-src directive nor the default-src directive of the Content Security Policy.

Refused to load data:font/woff2;base64,d09GMg.......... because it appears in neither the font-src directive nor the default-src directive of the Content Security Policy. 

这个错误是因为你的 Tauri 应用的 内容安全策略(Content Security Policy, CSP)限制了从 asset://localhost 加载本地资源,尤其是图片文件。要解决这个问题,你需要在 Tauri 的配置文件中更新 CSP,允许加载本地文件。

步骤:

1. 更新 tauri.conf.json 文件

你需要在 tauri.conf.json 文件中修改 security 部分,允许从 asset://localhost 加载图片。可以通过以下方式修改 CSP 设置:

        "security": {
            "csp": "default-src 'self' 'unsafe-inline' 'unsafe-eval'; img-src 'self' asset://localhost data:; font-src 'self' asset://localhost data:; asset: https://asset.localhost"
        },

解释:

  • default-src 'self':允许加载自身资源。
  • img-src 'self' asset://localhost data::允许从自身、asset://localhostdata: 源加载图片。这是关键的一部分,解决你无法加载本地图片的问题。
  • script-src 'self' 'unsafe-inline' 'unsafe-eval':允许执行内联脚本和 eval。如果你的应用需要在开发过程中允许这种操作,也可以添加。
  • font-src 'self' asset://localhost data::允许从当前应用、asset://localhostdata: URI 加载字体文件。这里的 data: 允许通过 Base64 嵌入字体文件。
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包

打赏作者

1024小神

你的鼓励将是我创作的最大动力

¥1 ¥2 ¥4 ¥6 ¥10 ¥20
扫码支付:¥1
获取中
扫码支付

您的余额不足,请更换扫码支付或充值

打赏作者

实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值