Fix PR #3 review round 3: SITE_URL fallback, XSS escape, TechArticle, actual wordCount

Address all 9 Gemini review comments:

1-5. (MEDIUM) Consistent SITE_URL fallback: Added SITE_URL to consts.ts
   import in BaseHead.astro. All Astro.site usages now use a site
   fallback variable. Reordered canonicalUrl construction in BlogPost
   and DocPage to use the fallback. Listing page pageUrl also fixed.

6. (MEDIUM) JSON-LD XSS protection: escape < as \u003c in
   JSON.stringify output to prevent </script> injection.

7. (MEDIUM) Actual wordCount: reading-time utility now returns both
   minutes and wordCount via getReadingStats(). BlogPost passes the
   real count instead of a readingTime * N heuristic.

8. (MEDIUM) DocPage uses TechArticle schema instead of BlogPosting
   for better semantic accuracy on documentation pages.

9. (MEDIUM) JsonLd component now supports TechArticle as a schema type
   via the refactored buildArticle() function.

Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>

Author: linfangw

src/components/BaseHead.astro

@@ -2,7 +2,7 @@
 import '../styles/global.css';
 import type { ImageMetadata } from 'astro';
 import FallbackImage from '../assets/qveris-brand.png';
-import { SITE_TITLE } from '../consts';
+import { SITE_TITLE, SITE_URL } from '../consts';
 import { locales, defaultLocale } from '../i18n/config';
 import type { Locale } from '../i18n/config';
 import { switchLocaleInPath, getHtmlLang } from '../i18n/utils';
@@ -20,8 +20,6 @@ interface Props {
 	tags?: string[];
 }
 
-const canonicalURL = new URL(Astro.url.pathname, Astro.site);
-
 const {
 	title,
 	description,
@@ -34,24 +32,27 @@ const {
 	tags,
 } = Astro.props;
 
+// Use Astro.site with SITE_URL fallback for all URL construction
+const site = Astro.site ?? new URL(SITE_URL);
+const canonicalURL = new URL(Astro.url.pathname, site);
 const ogLocale = lang === 'cn' ? 'zh_CN' : 'en_US';
 const imageUrl = new URL(image.src, Astro.url);
 
 // hreflang: dynamically generate alternate links for all supported locales
 const pathname = Astro.url.pathname;
 const hreflangLinks = locales.map((loc) => ({
 	hreflang: getHtmlLang(loc),
-	href: new URL(switchLocaleInPath(pathname, loc), Astro.site),
+	href: new URL(switchLocaleInPath(pathname, loc), site),
 }));
-const defaultUrl = new URL(switchLocaleInPath(pathname, defaultLocale), Astro.site);
+const defaultUrl = new URL(switchLocaleInPath(pathname, defaultLocale), site);
 ---
 
 <meta charset="utf-8" />
 <meta name="viewport" content="width=device-width,initial-scale=1" />
 <link rel="icon" type="image/svg+xml" href="/favicon.svg" />
 <link rel="icon" href="/favicon.ico" />
 <link rel="sitemap" href="/sitemap-index.xml" />
-<link rel="alternate" type="application/rss+xml" title={SITE_TITLE} href={new URL('rss.xml', Astro.site)} />
+<link rel="alternate" type="application/rss+xml" title={SITE_TITLE} href={new URL('rss.xml', site)} />
 <meta name="generator" content={Astro.generator} />
 
 <link rel="preconnect" href="https://fonts.googleapis.com" />

src/components/JsonLd.astro

@@ -45,6 +45,7 @@ interface CollectionPageData {
 
 type Props =
 	| { type: 'BlogPosting'; data: BlogPostingData }
+	| { type: 'TechArticle'; data: BlogPostingData }
 	| { type: 'BreadcrumbList'; data: BreadcrumbData }
 	| { type: 'CollectionPage'; data: CollectionPageData };
 
@@ -53,10 +54,10 @@ import { SITE_URL } from '../consts';
 const { type, data } = Astro.props;
 const site = Astro.site?.toString().replace(/\/$/, '') ?? SITE_URL;
 
-function buildBlogPosting(d: BlogPostingData) {
+function buildArticle(d: BlogPostingData, schemaType: string = 'BlogPosting') {
 	return {
 		'@context': 'https://schema.org',
-		'@type': 'BlogPosting',
+		'@type': schemaType,
 		headline: d.title,
 		description: d.description,
 		url: d.url,
@@ -128,7 +129,10 @@ let jsonLd: Record<string, unknown>;
 
 switch (type) {
 	case 'BlogPosting':
-		jsonLd = buildBlogPosting(data as BlogPostingData);
+		jsonLd = buildArticle(data as BlogPostingData, 'BlogPosting');
+		break;
+	case 'TechArticle':
+		jsonLd = buildArticle(data as BlogPostingData, 'TechArticle');
 		break;
 	case 'BreadcrumbList':
 		jsonLd = buildBreadcrumbList(data as BreadcrumbData);
@@ -139,4 +143,4 @@ switch (type) {
 }
 ---
 
-<script type="application/ld+json" set:html={JSON.stringify(jsonLd)} />
+<script type="application/ld+json" set:html={JSON.stringify(jsonLd).replace(/</g, '\\u003c')} />

src/layouts/BlogPost.astro

@@ -26,6 +26,7 @@ type Props = CollectionEntry<'blog'>['data'] & {
 	blogIndexHref: string;
 	headings: MarkdownHeading[];
 	readingTime: number;
+	wordCount: number;
 };
 
 const {
@@ -45,6 +46,7 @@ const {
 	blogIndexHref,
 	headings,
 	readingTime,
+	wordCount,
 } = Astro.props;
 
 const L = t(lang);
@@ -53,8 +55,8 @@ const breadcrumbItems = [
 	...(category ? [{ label: category, href: blogIndexHref }] : []),
 	{ label: title },
 ];
-const canonicalUrl = new URL(Astro.url.pathname, Astro.site).toString();
 const site = Astro.site?.toString().replace(/\/$/, '') ?? SITE_URL;
+const canonicalUrl = new URL(Astro.url.pathname, site).toString();
 const breadcrumbLd = breadcrumbItems.map((item) => ({
 	name: item.label,
 	...(item.href && { url: `${site}${item.href}` }),
@@ -87,7 +89,7 @@ const breadcrumbLd = breadcrumbItems.map((item) => ({
 		tags,
 		category,
 		lang,
-		wordCount: lang === 'cn' ? readingTime * 300 : readingTime * 200,
+		wordCount,
 	}} />
 	<JsonLd type="BreadcrumbList" data={{ items: breadcrumbLd }} />
 

src/layouts/DocPage.astro

@@ -38,8 +38,8 @@ const breadcrumbItems = [
 	{ label: L.doc, href: docIndexHref },
 	{ label: title },
 ];
-const canonicalUrl = new URL(Astro.url.pathname, Astro.site).toString();
 const site = Astro.site?.toString().replace(/\/$/, '') ?? SITE_URL;
+const canonicalUrl = new URL(Astro.url.pathname, site).toString();
 const breadcrumbLd = breadcrumbItems.map((item) => ({
 	name: item.label,
 	...(item.href && { url: `${site}${item.href}` }),
@@ -58,7 +58,7 @@ const breadcrumbLd = breadcrumbItems.map((item) => ({
 	pubDate={pubDate}
 	updatedDate={updatedDate}
 >
-	<JsonLd type="BlogPosting" data={{
+	<JsonLd type="TechArticle" data={{
 		title,
 		description,
 		url: canonicalUrl,

src/pages/blog/[lang]/[...slug].astro

@@ -3,7 +3,7 @@ import { type CollectionEntry, getCollection, render } from 'astro:content';
 import BlogPost from '../../../layouts/BlogPost.astro';
 import { type Locale, isLocale } from '../../../i18n/config';
 import { localizedPath } from '../../../i18n/utils';
-import { getReadingTime } from '../../../utils/reading-time';
+import { getReadingStats } from '../../../utils/reading-time';
 
 export async function getStaticPaths() {
 	const posts = await getCollection('blog');
@@ -57,7 +57,9 @@ const nextPost =
 
 const blogIndexHref = localizedPath(lang, '/blog');
 const { Content, headings } = await render(post);
-const readingTime = getReadingTime(post.body ?? '');
+const stats = getReadingStats(post.body ?? '');
+const readingTime = stats.minutes;
+const wordCount = stats.wordCount;
 ---
 
 <BlogPost
@@ -68,6 +70,7 @@ const readingTime = getReadingTime(post.body ?? '');
 	blogIndexHref={blogIndexHref}
 	headings={headings}
 	readingTime={readingTime}
+	wordCount={wordCount}
 >
 	<Content />
 </BlogPost>

src/pages/blog/[lang]/index.astro

@@ -37,7 +37,7 @@ function postHref(post: (typeof allPosts)[0]) {
 }
 
 const site = Astro.site?.toString().replace(/\/$/, '') ?? SITE_URL;
-const pageUrl = new URL(Astro.url.pathname, Astro.site).toString();
+const pageUrl = new URL(Astro.url.pathname, site).toString();
 const allPostRefs = allPosts.map((p) => ({
 	title: p.data.title,
 	url: `${site}${postHref(p)}`,

src/utils/reading-time.ts

@@ -1,8 +1,16 @@
 /**
- * Estimate reading time from markdown/text content.
+ * Estimate reading time and word count from markdown/text content.
  * ~200 words per minute for English, ~300 characters per minute for Chinese.
  */
-export function getReadingTime(text: string): number {
+
+export interface ReadingStats {
+	/** Estimated reading time in minutes */
+	minutes: number;
+	/** Approximate word/character count (English words + Chinese characters) */
+	wordCount: number;
+}
+
+export function getReadingStats(text: string): ReadingStats {
 	// Strip markdown syntax
 	const stripped = text
 		.replace(/```[\s\S]*?```/g, '') // code blocks
@@ -21,5 +29,14 @@ export function getReadingTime(text: string): number {
 	const englishWords = withoutChinese.split(/\s+/).filter((w) => w.length > 0).length;
 
 	const minutes = englishWords / 200 + chineseChars / 300;
-	return Math.max(1, Math.ceil(minutes));
+
+	return {
+		minutes: Math.max(1, Math.ceil(minutes)),
+		wordCount: englishWords + chineseChars,
+	};
+}
+
+/** Convenience wrapper returning only minutes (backward compatible) */
+export function getReadingTime(text: string): number {
+	return getReadingStats(text).minutes;
 }