远程服务器图片不存在时替换为本地内部图片的实现方案咨询

可行方案（两种可选，均满足要求） #

方案1：修复后端.htaccess规则（推荐，对SEO更友好）

原规则失效核心有两个原因：

1. sshfs默认仅允许挂载用户访问目录，Apache运行用户无权限读取挂载目录的文件，导致!-F的文件存在性判断失效
2. 原规则存在语法空格错误

修复步骤：

1. 先调整sshfs挂载参数，放开权限：
   • 编辑/etc/fuse.conf，取消user_allow_other行的注释
   • 重新执行挂载命令，添加权限参数：sshfs 远程账号@远程地址:远程图片存储目录 站点本地图片挂载目录 -o allow_other,default_permissions
2. 替换.htaccess规则为以下正确写法：

RewriteEngine On
RewriteCond %{REQUEST_FILENAME} !-f
RewriteCond %{REQUEST_URI} \.(gif|jpg|jpeg|png)$ [NC]
RewriteRule ^.*$ /image.png [L]

注意将/image.png替换为你默认图的站点绝对路径。

方案2：前端全量适配方案（无需调整服务器配置，无框架依赖）

原jQuery方案失效是因为仅绑定了页面初始加载时已存在的img元素，且error事件默认不冒泡，动态插入的图片无法触发。替换为以下原生JS即可：

document.addEventListener('error', function(e) {
    const target = e.target;
    if (target.tagName.toLowerCase() === 'img') {
        target.src = '/image.png';
        // 避免默认图加载失败触发死循环
        target.onerror = null;
    }
}, true);

这段代码会捕获全站所有img元素的加载错误，不管是静态写入还是动态生成的图片，无需给图片设置任何ID或自定义属性，自动生效。

如果站点用Nginx做服务端，也可以用以下配置实现相同效果，同样需要先完成sshfs挂载的权限调整：

location ~* \.(gif|jpg|jpeg|png)$ {
    try_files $uri /image.png;
}

内容的提问来源于stack exchange，提问作者Yves89000