图片ip

shop-app/.env.production

@@ -7,5 +7,9 @@ ENV=production
 # 若依后端 API（与 ruoyi-ui 一致，由 Nginx 反代到真实后端）
 VITE_APP_BASE_API=/shop-api
 
+# H5 生产图片会自动用浏览器当前访问的 IP/域名，一般无需配置
+# 仅微信小程序/App 打包时取消注释并填写 https 域名：
+# VITE_APP_API_HOST=https://shop.xxx.com
+
 # H5 部署子路径（须与 manifest.json h5.router.base 一致，如 /bqH5/）
 VITE_APP_PUBLIC_PATH=bqShop

shop-app/config/index.js

@@ -7,8 +7,12 @@
  * 打包 H5：uni build -p h5
  */
 
+/** 开发兜底 / 小程序未配域名时的默认值（生产 H5 不应依赖此项） */
 const apiHost = String(import.meta.env.VITE_APP_API_HOST || 'http://192.168.1.6:8020').replace(/\/$/, '')
 
+/** .env 显式配置的后端域名（小程序/App 生产环境必填 https） */
+const hostFromEnv = String(import.meta.env.VITE_APP_API_HOST || '').trim().replace(/\/$/, '')
+
 /** 与 ruoyi-ui 的 VUE_APP_BASE_API 同源配置（dev/prod 由 .env 注入） */
 const envBaseApi = String(import.meta.env.VITE_APP_BASE_API || '').trim()
 
@@ -34,13 +38,13 @@ function resolveBaseApi() {
 
 export const BASE_API = resolveBaseApi()
 
-/** 后端完整地址（含 IP/域名），来自 .env 的 VITE_APP_API_HOST */
-export const API_HOST = apiHost
-
 /**
- * 图片/文件访问根地址（始终用完整 IP/域名）
- * 说明：<image> 标签不会走 Vite 的 /dev-api 代理，必须用 API_HOST 直连后端
+ * 后端完整地址（开发 / 小程序打包用 .env 的 VITE_APP_API_HOST）
+ * H5 生产图片在运行时由 getFileBase() 自动取 window.location.origin
  */
+export const API_HOST = hostFromEnv || apiHost
+
+/** 图片根地址（构建时）；H5 生产以运行时 getFileBase() 为准 */
 export const FILE_BASE = API_HOST
 
 /**

shop-app/utils/image.js

@@ -1,6 +1,7 @@
-import { joinFileUrl, API_HOST } from '@/config'
+import { FILE_BASE, API_HOST } from '@/config'
 
 const PLACEHOLDER_PATHS = ['/static/logo.png']
+const API_PROXY_PREFIX = /^\/(dev-api|prod-api|shop-api)\//i
 
 /** 是否外链或 data URL */
 export function isExternalUrl(url) {
@@ -8,7 +9,7 @@ export function isExternalUrl(url) {
   return /^(https?:|data:|\/\/)/i.test(String(url).trim())
 }
 
-/** 去掉 /dev-api 等代理前缀，得到后端真实路径 */
+/** 去掉 /dev-api、/shop-api 等代理前缀，得到后端真实路径 */
 function stripApiProxyPrefix(path) {
   return String(path).replace(/^\/(dev-api|prod-api|shop-api)/, '') || '/'
 }
@@ -18,6 +19,32 @@ function isPlaceholderPath(path) {
   return PLACEHOLDER_PATHS.includes(raw)
 }
 
+/**
+ * 图片根地址
+ * - H5 生产：自动取浏览器当前访问的 IP/域名（window.location.origin）
+ * - H5 开发 / 小程序：用 .env 里的 VITE_APP_API_HOST
+ */
+export function getFileBase() {
+  // #ifdef H5
+  if (import.meta.env.PROD && typeof window !== 'undefined') {
+    const origin = window.location?.origin
+    if (origin && origin !== 'null') {
+      return origin.replace(/\/$/, '')
+    }
+  }
+  // #endif
+  return String(FILE_BASE).replace(/\/$/, '')
+}
+
+/** 拼接图片完整 URL */
+function joinFileUrlRuntime(path) {
+  const base = getFileBase()
+  if (!path) return base
+  if (/^https?:\/\//i.test(path)) return path
+  const p = path.startsWith('/') ? path : `/${path}`
+  return base + p
+}
+
 /**
  * 是否已是可直接使用的图片地址（避免重复拼接）
  */
@@ -26,14 +53,17 @@ export function isResolvedFileUrl(url) {
   const raw = String(url).trim()
   if (isExternalUrl(raw)) return true
   if (raw.startsWith('/static/')) return true
+  const fileBase = getFileBase()
+  if (fileBase && (raw === fileBase || raw.startsWith(`${fileBase}/`))) return true
+  if (API_PROXY_PREFIX.test(raw)) return true
   const apiHost = String(API_HOST).replace(/\/$/, '')
-  return !!(apiHost && (raw === apiHost || raw.startsWith(`${apiHost}/`)))
+  return !!(apiHost && apiHost.startsWith('http') && (raw === apiHost || raw.startsWith(`${apiHost}/`)))
 }
 
 /**
- * 将后端返回的图片路径转为可展示的完整 URL（可重复调用）
- * 结果形如：http://192.168.1.6:8020/profile/upload/xxx.jpg
- * @param {string} path bannerImage / categoryPic / mainPic 等
+ * 将后端返回的图片路径转为可展示的 URL（可重复调用）
+ * - H5 生产：http://当前访问IP/profile/upload/xxx.jpg（自动）
+ * - 开发：http://VITE_APP_API_HOST/profile/upload/xxx.jpg
  */
 export function resolveFileUrl(path) {
   if (path == null || path === '') {
@@ -43,26 +73,32 @@ export function resolveFileUrl(path) {
   if (!raw || isPlaceholderPath(raw)) {
     return ''
   }
-  if (isExternalUrl(raw)) {
+  if (isExternalUrl(raw) || raw.startsWith('/static/')) {
+    return raw
+  }
+
+  const fileBase = getFileBase()
+  if (fileBase && (raw === fileBase || raw.startsWith(`${fileBase}/`))) {
     return raw
   }
-  if (raw.startsWith('/static/')) {
+  if (API_PROXY_PREFIX.test(raw)) {
     return raw
   }
+
   const apiHost = String(API_HOST).replace(/\/$/, '')
-  if (apiHost && (raw === apiHost || raw.startsWith(`${apiHost}/`))) {
+  if (apiHost && apiHost.startsWith('http') && (raw === apiHost || raw.startsWith(`${apiHost}/`))) {
     return raw
   }
-  if (/^\/(dev-api|prod-api|shop-api)\//i.test(raw)) {
+
+  if (API_PROXY_PREFIX.test(raw)) {
     raw = stripApiProxyPrefix(raw)
   }
   const normalized = raw.startsWith('/') ? raw : `/${raw}`
-  return joinFileUrl(normalized)
+  return joinFileUrlRuntime(normalized)
 }
 
 /**
- * 将逗号分隔或数组形式的图片路径转为完整 URL 列表
- * @param {string|string[]|null|undefined} pathOrList
+ * 将逗号分隔或数组形式的图片路径转为 URL 列表
  */
 export function resolveFileUrlList(pathOrList) {
   if (pathOrList == null || pathOrList === '') return []