uni-app IOS端image组件无法加载本地static文件夹里的图片

发布于 1周前 作者 caililin 来自 Uni-App

uni-app IOS端image组件无法加载本地static文件夹里的图片

uniapp X苹果手机自定义基座调试问题

uniapp X在苹果手机上自定义基座调试时,所有 image 组件都不显示图片,webview 也无法加载 static 下的文件。

@error 返回的错误信息如下:

{
  "errMsg": "Error Domain=NSURLErrorDomain Code=-1002 \"不支持的URL\" UserInfo={NSLocalizedDescription=不支持的URL, NSErrorFailingURLStringKey=/static/logo.png, NSErrorFailingURLKey=/static/logo.png, _NSURLErrorRelatedURLSessionTaskErrorKey=(\n    \"LocalDataTask <2212A12C-F4C1-4652-9284-C415DEC406DE>.<1>\"\n), _NSURLErrorFailingURLSessionTaskErrorKey=LocalDataTask <2212A12C-F4C1-4652-9284-C415DEC406DE>.<1>, NSUnderlyingError=0x281bf2100 {Error Domain=kCFErrorDomainCFNetwork Code=-1002 \"(null)\"}}"
}

调试手机为苹果6s plus,系统版本为 iOS 15.8.3。组件只能显示网络图片。有遇到过类似问题的大神吗?

开发环境与项目信息

项目创建方式 开发环境 版本号
自定义基座调试 uniapp X -

8 回复

测试下其他手机系统,或者不同版本的模拟器,缩小下问题范围


另外测试了苹果ipad5代,IOS版本16.7.10,也同样不显示本地路径的图片,连底部tab按钮上的图片也不显示。安卓一切正常。不是模拟器,都是真机自定义基座。标准基座也同样不显示。而且目前无法使用标准基座,运行的时候提示有个插件没找到或编译错误,但打包自定义基座可以。所有一直都是自定义基座调试的。hbx用的是Alpha版最新版。

回复 今非昔: 不应该啊,你新建一个 uniapp x 空白工程,这个工程有绿色的图片和 Hello 文字。

回复 DCloud_UNI_OttoJi: 我们要疯了,空白工程图片是显示的。那可能是什么地方的配置导致全局本地文件不能加载呢。快一个星期了被这个ios端的问题困扰。。。

回复 今非昔: 空白工程没问题应该是哪里的配置有问题,你可以把页面和逻辑都挪到空白工程里去,对比差异。

你试试 在需要引入logo的地方使用 import logo from ‘/static/logo.png’
//然后在模板里
<image :src="logo"/> 这样试试能否显示呢

感谢,试了一下,结果一样也是不显示,提示不支持的URL。

在uni-app中,如果你在IOS端遇到image组件无法加载本地static文件夹里的图片的问题,这通常是由于路径引用不正确或者资源打包配置有误引起的。以下是一些常见的解决方案和代码示例,帮助你排查和解决这个问题。

1. 确认图片路径引用正确

首先,确保你在image组件中引用的图片路径是正确的。uni-app中,引用static文件夹下的图片,通常应该使用相对路径,以/开头,指向static目录。例如:

<template>
  <view>
    <image src="/static/images/logo.png" mode="widthFix"></image>
  </view>
</template>

2. 检查资源打包配置

manifest.json中,确保mp-weixin(或其他目标平台)的配置中包含了正确的静态资源路径。虽然这主要影响小程序端,但检查配置总是好的习惯。

{
  "mp-weixin": {
    "appid": "your-app-id",
    "setting": {
      "urlCheck": false
    },
    "usingComponents": true,
    "es6": true,
    "compileType": "miniprogram",
    "libVersion": "2.24.5",
    "cloudfunctionRoot": "cloudfunctions/",
    "condition": {},
    "staticResources": [
      {
        "resourcePath": "static/images/**",
        "resourceType": "image"
      }
    ]
  }
}

注意:staticResources字段主要用于小程序,uni-app的H5和App端通常不需要这样的配置。

3. 使用绝对路径尝试

有时候,使用绝对路径(相对于项目的根目录)可以解决路径解析的问题,尽管这不是最佳实践,因为它降低了代码的可移植性。

<template>
  <view>
    <image src="../../static/images/logo.png" mode="widthFix"></image>
  </view>
</template>

注意:这里的路径../../可能需要根据你的项目结构调整。

4. 清理和重建项目

清理项目缓存并重新构建,有时候可以解决一些看似莫名其妙的问题。在HBuilderX中,你可以通过“运行”菜单下的“清理项目”和“重新编译”来实现。

5. 检查IOS特定问题

如果以上方法都没有解决问题,考虑是否是IOS特有的问题。检查Xcode的日志输出,看是否有关于资源加载失败的错误信息。此外,确保你的IOS项目配置(如Info.plist)没有阻止图片资源的加载。

通过上述步骤,你应该能够定位并解决uni-app IOS端image组件无法加载本地static文件夹里图片的问题。如果问题依然存在,可能需要更详细的日志信息来进一步分析。

回到顶部