vue3 SPA+SSR组合


这是caddy反向代理配置:

ini
www.abc.cn {
	file_server
	root * /home/btcmai/jingtai/
	
	#设置一个匹配gin的路由
	@gin {
		path / /login /register /item/* /class/* /changepassword /search /api/* /muxiaoliang123/* /muxiaoliang/*
	}
	
	handle @gin {
		reverse_proxy localhost:5280
	}
	
	#设置一个前端处理的路由,这里的路由写router.js中使用的路由,但是排除SEO未登陆可访问的路由,只使用必须登陆可访问的路由
	@vue {
		path /cart /order/* /lists/*
	}
	handle @vue {
		#因为指定了root路径,这个路径实际是位于/jingtai目录下
		rewrite * /vueindex.html
	}
	#管理员前端因为要混淆404,必须判断登陆所有都由gin处理,所以管理员后台已经不需要要再额外处理,muxiaoliang/*全部转发给gin
}

将生vue生成的dist>index.html改名为vueindex.html放到服务器的gin模板文件下,再复制一份到/jingtai/vueindex.html(这是要在caddy配置文件下转发的静态路径必须是静态根目录),同时将dist>static下的文件放到caddy静态同等目录

将vueadmin生成的dist>index.htmlindex.html改名为admin.html放到服务器的gin模板文件下,同时将static下的文件放到caddy静态同等目录

同时让可以公共暴露的路由使用gin来识别是否登陆,如果未登陆则服务器渲染,已登陆则使用模板vueindex.html来处理这个路由

读书不要贪多,而是要多加思索。一一卢梭