HarmonyOS鸿蒙Next中预览器可以显示后端传回的网络地址的图片，模拟器显示不出来

HarmonyOS鸿蒙Next中预览器可以显示后端传回的网络地址的图片，模拟器显示不出来 以下是选择图片上传保存，返回的日志，但是模拟器没有显示
你选中的图片：file://media/Photo/3/IMG_1773129005_002/5f1c485450c3697e9f2ad15ddb01fc46.png

03-10 17:40:44.601 27432-27432 A03d00/JSAPP com.zyc.littletrip I 选择的头像： file://media/Photo/3/IMG_1773129005_002/5f1c485450c3697e9f2ad15ddb01fc46.png

03-10 17:42:02.137 27432-27432 A03d00/JSAPP com.zyc.littletrip I upOnHeader headers:{“headers”:{“content-type”:“application/json”,“date”:“Tue, 10 Mar 2026 09:42:00 GMT”,“transfer-encoding”:“chunked”,“vary”:“Origin, Access-Control-Request-Method, Access-Control-Request-Headers”},“body”:"{“code”:“200”,“msg”:“请求成功”,“data”:"http://localhost:9090/files/download/1773135720925-1773135721700.png"}"}

03-10 17:42:02.140 27432-27432 A00001/[axios] com.zyc.littletrip I : axios request

03-10 17:42:02.154 27432-27432 A00001/[axios] com.zyc.littletrip I : http request : <private>

03-10 17:42:02.182 27432-27432 A03d00/JSAPP com.zyc.littletrip I upload complete taskState: {“path”:"/data/storage/el2/base/haps/entry/cache/1773135721700.png",“responseCode”:0,“message”:""}

03-10 17:42:02.230 27432-27432 A00000/Interview_Pass com.zyc.littletrip I 请求成功

03-10 17:42:02.231 27432-27432 A00000/Interview_Pass com.zyc.littletrip D 读取Preferences[user_data_key = "{“id”:1,“username”:“aaa”,“name”:“煊赫门”,“password”:“555555”,“role”:“普通用户”,“newPassword”:null,“avatar”:"http://localhost:9090/files/download/1773133689218-1773133690188.png",“token”:“eyJ0eXAiOiJKV1QiLCJhbGciOiJIUzI1NiJ9.eyJhdWQiOiIxLeaZrumAmueUqOaItyIsImV4cCI6MTc3MzIxNDkzOX0.VRCv0TCAZtxtQL81LDond3gwP1OHrqLYldCRqhOBfOQ”,“phone”:“13285998500”,“email”:""}"]成功

03-10 17:42:02.233 27432-27432 A03d00/JSAPP com.zyc.littletrip I 本地存储的头像 http://localhost:9090/files/download/1773135720925-1773135721700.png

03-10 17:42:02.260 27432-27432 A00000/Interview_Pass com.zyc.littletrip D 保存Preferences[user_data_key]成功

Image(this.userAvatar)
  .width(80)
  .height(80)
  .borderRadius(40)
  .border({ width: 2, color: '#FFFFFF' })
  .opacity(1) // 确保头像不透明
  .onError((error: ImageError) => {
    console.error('[ImageError]', `${error.message}`)
    this.userAvatar = $r('app.media.default_avatar')
  })
以下是报错日志

03-10 17:42:02.262 27432-27432 A03d00/JSAPP com.zyc.littletrip E [ImageError] Http task of url http://localhost:9090/files/download/1773135720925-1773135721700.png failed, response code 0, msg from netStack: Couldn’t connect to server

http://localhost:9090/files/download/1773133689218-1773133690188.png这个路径在预览器可以，模拟器不行，看了一圈下来的方法都不行。


更多关于HarmonyOS鸿蒙Next中预览器可以显示后端传回的网络地址的图片，模拟器显示不出来的实战教程也可以访问 https://www.itying.com/category-93-b0.html

2 回复

在HarmonyOS Next中，预览器与模拟器图片显示差异通常源于网络权限配置。预览器可能默认允许访问网络，而模拟器需要明确声明网络权限。请检查项目配置文件（如module.json5），确保已添加ohos.permission.INTERNET权限。同时，确认图片地址可公开访问，模拟器网络连接正常。

更多关于HarmonyOS鸿蒙Next中预览器可以显示后端传回的网络地址的图片，模拟器显示不出来的实战系列教程也可以访问 https://www.itying.com/category-93-b0.html


这是一个典型的网络地址访问问题。预览器运行在开发机的浏览器环境中，可以直接访问 localhost:9090（即开发机本地的后端服务）。而模拟器是一个独立的虚拟设备，其 localhost 指向的是模拟器自身，而非你的开发主机。

核心原因： 模拟器无法直接解析 http://localhost:9090 为开发机的后端服务地址。

解决方案：

  1. 使用开发机的局域网IP地址（推荐）：将代码中的 localhost 替换为开发机在局域网中的实际IP地址（例如 http://192.168.1.100:9090）。确保开发机和模拟器在同一局域网，且防火墙允许9090端口的连接。

  2. 配置模拟器网络代理（如果后端在公网）：如果后端服务部署在公网，确保模拟器可以访问互联网，并使用公网URL。

  3. 检查网络权限：在应用的 module.json5 配置文件中，确认已声明必要的网络权限：

    "requestPermissions": [
  {
    "name": "ohos.permission.INTERNET"
  }
]

从你的日志 Couldn't connect to server 来看，是网络连接失败。请优先将 localhost 替换为开发机的实际IP地址再测试。

回到顶部