Khôi phục 100% về commit 818a5ed6

404.html

@@ -0,0 +1,160 @@
+<!DOCTYPE html>
+<html lang="vi">
+<head>
+<meta charset="UTF-8">
+<meta name="viewport" content="width=device-width,initial-scale=1">
+<title>V.AI STUDIO</title>
+<meta property="og:type" content="website">
+<meta property="og:site_name" content="V.AI STUDIO">
+<meta property="og:image" content="https://huggingface.co/spaces/bep40/V.AISTUDIO/resolve/main/logo/logo_main.png">
+<meta name="twitter:card" content="summary_large_image">
+<script>
+/**
+ * V.AI STUDIO — 404 Fix v2
+ * ========================
+ * FIX:
+ * - Bot/crawler visits /san-pham/SLUG/index.html → render full OG tags INSTANTLY
+ * - Real user → immediate redirect to SPA
+ * - Uses lightweight product_seo_min.json (3.8MB) for rich OG data if available
+ */
+(function(){
+  'use strict';
+  var path = location.pathname;
+  var slug = '';
+  var m = path.match(/\/san-pham\/([^\/]+)/i);
+  if (m) slug = decodeURIComponent(m[1]);
+
+  var ua = (navigator.userAgent||'').toLowerCase();
+  var isBot = /bot|crawl|spider|facebook|twitter|zalo|whatsapp|telegram|slack|discord|pinterest|linkedin|embedly|iframely|google|bing|yandex|duckduck|baidu|semrush|ahrefs|majestic|facebookexternalhit|adsbot/i.test(ua);
+
+  var SITE = 'https://bep40-v-aistudio.static.hf.space';
+  var IMG_DEFAULT = 'https://huggingface.co/spaces/bep40/V.AISTUDIO/resolve/main/logo/logo_main.png';
+
+  function setMeta(attr, name, content) {
+    var sel = attr === 'property' ? 'meta[property="' + name + '"]' : 'meta[name="' + name + '"]';
+    var el = document.querySelector(sel);
+    if (!el) {
+      el = document.createElement('meta');
+      el.setAttribute(attr, name);
+      document.head.appendChild(el);
+    }
+    el.setAttribute('content', content || '');
+  }
+
+  function setCanonical(url) {
+    var el = document.querySelector('link[rel="canonical"]');
+    if (!el) {
+      el = document.createElement('link');
+      el.setAttribute('rel', 'canonical');
+      document.head.appendChild(el);
+    }
+    el.setAttribute('href', url || SITE + '/');
+  }
+
+  // ── Render full static page for bot ──
+  function renderBotPage(name, price, image, desc, sku, brand) {
+    name = name || slug || 'Sản phẩm';
+    price = price || 0;
+    image = image || IMG_DEFAULT;
+    desc = desc || name + ' tại V.AI STUDIO';
+    sku = sku || '';
+    brand = brand || '';
+
+    var title = name;
+    if (brand) title = name + ' | ' + brand + ' | V.AI STUDIO';
+    else title = name + ' | V.AI STUDIO';
+
+    var priceStr = price ? Number(price).toLocaleString('vi-VN') + 'đ' : '';
+    var ogDesc = priceStr ? 'Giá: ' + priceStr + ' - ' + desc : desc;
+    var ogUrl = SITE + '/san-pham/' + encodeURIComponent(slug) + '/index.html';
+
+    setMeta('property', 'og:title', title);
+    setMeta('property', 'og:description', ogDesc);
+    setMeta('property', 'og:image', image);
+    setMeta('property', 'og:url', ogUrl);
+    if (price > 0) {
+      setMeta('property', 'product:price:amount', String(price));
+      setMeta('property', 'product:price:currency', 'VND');
+    }
+    setMeta('name', 'twitter:title', title);
+    setMeta('name', 'twitter:description', ogDesc);
+    setMeta('name', 'twitter:image', image);
+    setCanonical(ogUrl);
+    document.title = title;
+
+    if (isBot) {
+      var html = '<!DOCTYPE html><html lang="vi"><head><meta charset="UTF-8"><meta name="viewport" content="width=device-width,initial-scale=1">'
+        + '<title>' + title.replace(/"/g,'&quot;') + '</title>'
+        + '<meta property="og:title" content="' + title.replace(/"/g,'&quot;') + '">'
+        + '<meta property="og:description" content="' + ogDesc.replace(/"/g,'&quot;') + '">'
+        + '<meta property="og:image" content="' + image.replace(/"/g,'&quot;') + '">'
+        + '<meta property="og:url" content="' + ogUrl.replace(/"/g,'&quot;') + '">'
+        + (price > 0 ? '<meta property="product:price:amount" content="' + price + '"><meta property="product:price:currency" content="VND">' : '')
+        + '<meta name="twitter:card" content="summary_large_image">'
+        + '<meta name="twitter:title" content="' + title.replace(/"/g,'&quot;') + '">'
+        + '<meta name="twitter:description" content="' + ogDesc.replace(/"/g,'&quot;') + '">'
+        + '<meta name="twitter:image" content="' + image.replace(/"/g,'&quot;') + '">'
+        + '<link rel="canonical" href="' + ogUrl.replace(/"/g,'&quot;') + '">'
+        + '<style>body{font-family:sans-serif;max-width:700px;margin:40px auto;padding:20px;color:#333}h1{font-size:1.5em;color:#003f62}.price{font-size:1.3em;color:#003f62;font-weight:bold}img{max-width:100%;max-height:400px;margin:16px 0}.btn{display:inline-block;background:#003f62;color:#fff;padding:12px 24px;border-radius:8px;text-decoration:none;font-weight:bold;margin-top:8px}.meta{color:#666;font-size:.85em}</style>'
+        + '</head><body>'
+        + '<h1>' + name.replace(/"/g,'&quot;') + '</h1>'
+        + (sku ? '<p class="meta">Mã: ' + sku.replace(/"/g,'&quot;') + '</p>' : '')
+        + (priceStr ? '<p class="price">' + priceStr + '</p>' : '')
+        + '<img src="' + image.replace(/"/g,'&quot;') + '" alt="' + name.replace(/"/g,'&quot;') + '">'
+        + '<p>' + desc.replace(/"/g,'&quot;') + '</p>'
+        + '<a class="btn" href="' + SITE + '/?product=' + encodeURIComponent(slug) + '">Xem chi tiết tại V.AI STUDIO</a>'
+        + '</body></html>';
+      document.open();
+      document.write(html);
+      document.close();
+    }
+  }
+
+  function tryLoadSEOIndex() {
+    var xhr = new XMLHttpRequest();
+    xhr.open('GET', '/product_seo_min.json', true);
+    xhr.timeout = 5000;
+    xhr.onload = function() {
+      if (xhr.status >= 200 && xhr.status < 300) {
+        try {
+          var data = JSON.parse(xhr.responseText);
+          var target = slug ? slug.toLowerCase() : '';
+          for (var i = 0; i < data.length; i++) {
+            var p = data[i];
+            if (p[0] && p[0].toLowerCase() === target) {
+              renderBotPage(p[1], p[2], p[3], p[4], p[5], p[6]);
+              return;
+            }
+          }
+        } catch(e) {}
+      }
+    };
+    xhr.send();
+  }
+
+  // ══════════ MAIN ══════════
+  if (!slug) {
+    if (!isBot) location.replace('/');
+    return;
+  }
+
+  // Step 1: Always render minimal OG instantly from slug
+  var guessName = slug.replace(/-/g, ' ').replace(/\b\w/g, function(c){ return c.toUpperCase(); });
+  renderBotPage(guessName, 0, IMG_DEFAULT, 'Sản phẩm tại V.AI STUDIO', '', '');
+
+  // Step 2: Try async loading of SEO index for accurate data
+  tryLoadSEOIndex();
+
+  // Step 3: Real users redirect
+  if (!isBot) {
+    setTimeout(function() {
+      location.replace('/?product=' + encodeURIComponent(slug));
+    }, 100);
+  }
+})();
+</script>
+</head>
+<body>
+<p style="font-family:sans-serif;text-align:center;padding:40px;color:#666">Vui lòng chờ trong giây lát...</p>
+</body>
+</html>