uni-app 安卓 nvue页面下APP里无法显示https图片

uni-app 安卓 nvue页面下APP里无法显示https图片

操作步骤：

  • 运行附件就可以

预期结果：

  • 运行附件就可以

实际结果：

  • 运行附件就可以

bug描述：

  • 安卓 nvue页面下APP里无法显示https图片
  • 打包方式，直接HBuilderx里运行到手机 华为Mate 30

运行附件就可以

nginx 配置

server  
{  
    listen 80;  
    listen 443 ssl http2;  
    server_name wbtask_pic.len168.com;  
    index index.php index.html index.htm default.php default.htm default.html;  
    root /home/www/wbtask_api/upload;  
    add_header Access-Control-Allow-Origin '*' always;  
    add_header Access-Control-Allow-Headers '*' always;  

    #SSL-START SSL相关配置，请勿删除或修改下一行带注释的404规则  
    #error_page 404/404.html;  
    ssl_certificate    /www/server/panel/vhost/cert/wbtask_pic.len168.com/fullchain.pem;  
    ssl_certificate_key    /www/server/panel/vhost/cert/wbtask_pic.len168.com/privkey.pem;  
    ssl_protocols TLSv1.1 TLSv1.2 TLSv1.3;  
    ssl_ciphers EECDH+CHACHA20:EECDH+CHACHA20-draft:EECDH+AES128:RSA+AES128:EECDH+AES256:RSA+AES256:EECDH+3DES:RSA+3DES:!MD5;  
    ssl_prefer_server_ciphers on;  
    ssl_session_cache shared:SSL:10m;  
    ssl_session_timeout 10m;  
    add_header Strict-Transport-Security "max-age=31536000";  
    error_page 497  https://$host$request_uri;  

    #SSL-END  

    #ERROR-PAGE-START  错误页配置，可以注释、删除或修改  
    #error_page 404 /404.html;  
    #error_page 502 /502.html;  
    #ERROR-PAGE-END  

    #PHP-INFO-START  PHP引用配置，可以注释或修改  
    include enable-php-00.conf;  
    #PHP-INFO-END  

    #REWRITE-START URL重写规则引用,修改后将导致面板设置的伪静态规则失效  
    include /www/server/panel/vhost/rewrite/wbtask_pic.len168.com.conf;  
    #REWRITE-END  

    #禁止访问的文件或目录  
    location ~ ^/(\.user.ini|\.htaccess|\.git|\.svn|\.project|LICENSE|README.md)  
    {  
        return 404;  
    }  

    #一键申请SSL证书验证目录相关设置  
    location ~ \.well-known{  
        allow all;  
    }  

    location ~ .*\.(gif|jpg|jpeg|png|bmp|swf)$  
    {  
        expires      30d;  
        error_log /dev/null;  
        access_log off;  
    }  

    location ~ .*\.(js|css)?$  
    {  
        expires      12h;  
        error_log /dev/null;  
        access_log off;   
    }  
    access_log  /www/wwwlogs/wbtask_pic.len168.com.log;  
    error_log  /www/wwwlogs/wbtask_pic.len168.com.error.log;  
}

nuve_image_bug.zip


更多关于uni-app 安卓 nvue页面下APP里无法显示https图片的实战教程也可以访问 https://www.itying.com/category-93-b0.html

3 回复

我也遇到这个问题了，官网也找不到答案，唉，uniapp问题真的多

更多关于uni-app 安卓 nvue页面下APP里无法显示https图片的实战教程也可以访问 https://www.itying.com/category-93-b0.html


域名中不能带下划线_ 如：task_api.your.com 不行 要用task-api.your.com

这个问题通常与安卓平台的网络安全配置有关。在Android 9及以上版本中，默认禁止非加密的HTTP请求，但有时也会影响HTTPS图片的加载。

解决方案：

  1. 在manifest.json中配置networkSecurity：
"app-plus" : {
    "networkSecurity" : {
        "secureNetworkEnable" : false
    }
}

  1. 检查图片URL是否包含特殊字符或编码问题，确保URL完全正确。

  2. 在nvue页面中，尝试添加[@error](/user/error)事件监听加载失败情况：

<image :src="imageUrl" [@error](/user/error)="onImageError"></image>
回到顶部