diff --git a/src/middlewares/install.js b/src/middlewares/install.js index a7cafa9..cc3210e 100644 --- a/src/middlewares/install.js +++ b/src/middlewares/install.js @@ -67,7 +67,15 @@ export default async app => { helmet({ contentSecurityPolicy: { directives: { - "script-src": ["'self'", "'unsafe-inline'", "https://unpkg.com"], + "script-src": [ + "'self'", + "'unsafe-inline'", + "https://unpkg.com", + "https://*.amap.com", + "'unsafe-eval'", + "https://cdnjs.cloudflare.com", + "https://cdn.jsdelivr.net", + ], "img-src": ["'self'", "data:", "https://bpic.588ku.com", "https://user-images.githubusercontent.com"], }, }, diff --git a/src/modules/Index/controller/index.js b/src/modules/Index/controller/index.js index 9f2689b..d5c80e4 100644 --- a/src/modules/Index/controller/index.js +++ b/src/modules/Index/controller/index.js @@ -8,32 +8,43 @@ export default class CommonController extends BaseController { } pageGet(...args) { - return (ctx) => { + return ctx => { return ctx.render(...args) } } + async bindLocGet(ctx){ + // ctx.session.loc = 1 + // 记录地点 + return await ctx.render("page/bind-loc", {}) + } + // 首页 async indexGet(ctx) { // 可以在这里添加一些需要用户信息的逻辑 // 例如获取用户相关的统计数据等 - const user = ctx.state.user || null; - + const user = ctx.state.user || null + + // 获取请求的IP地址 + const ip = ctx.request.ip || ctx.ip || (ctx.req && ctx.req.connection && ctx.req.connection.remoteAddress) || null + + const res = await fetch("https://restapi.amap.com/v3/ip?key=5bd92438c102ddf15083a46cf705decf&ip=" + ip) + const data = await res.json() + console.log(ip) + console.log(data) + // 示例数据,实际项目中可以从数据库获取 const stats = { articles: 1234, users: 567, categories: 89, - responseTime: "24h" - }; - - return await ctx.render( - "page/index/index", - { - stats, - // 其他需要传递给模板的数据 - } - ) + responseTime: "24h", + } + + return await ctx.render("page/index/index", { + stats, + // 其他需要传递给模板的数据 + }) } /** @@ -47,6 +58,9 @@ export default class CommonController extends BaseController { // 首页 router.get("", controller.handleRequest(controller.indexGet), { auth: "try" }) router.get("/", controller.handleRequest(controller.indexGet), { auth: "try" }) + + router.get("/bind-loc", controller.handleRequest(controller.bindLocGet), { auth: "try" }) + // router.get("/about", controller.handleRequest(controller.pageGet("page/about/index"))) router.get("/contact", controller.handleRequest(controller.pageGet("page/extra/contact"))) router.get("/faq", controller.handleRequest(controller.pageGet("page/extra/faq"))) @@ -59,4 +73,4 @@ export default class CommonController extends BaseController { return router } -} \ No newline at end of file +} diff --git a/src/views/htmx/footer/index.pug b/src/views/htmx/footer/index.pug index 1e84ef8..a1ad3bd 100644 --- a/src/views/htmx/footer/index.pug +++ b/src/views/htmx/footer/index.pug @@ -1,7 +1,7 @@ style include ./style.css footer.footer.shadow - .footer-panel(class="bg-white border-t border-gray-200") + .footer-panel .footer-content.container(class="pt-12 pb-6") .footer-main(class="grid grid-cols-1 md:grid-cols-4 gap-8 mb-8") .footer-section diff --git a/src/views/htmx/footer/style.css b/src/views/htmx/footer/style.css index 35b177f..9dca6f7 100644 --- a/src/views/htmx/footer/style.css +++ b/src/views/htmx/footer/style.css @@ -2,7 +2,7 @@ padding: 0; font-size: 14px; margin-top: auto; - background-color: #ffffff; + /* background-color: #ffffff; */ } .footer-main { diff --git a/src/views/layouts/root.pug b/src/views/layouts/root.pug index 6b84d50..bf90b11 100644 --- a/src/views/layouts/root.pug +++ b/src/views/layouts/root.pug @@ -22,8 +22,6 @@ html(lang="zh-CN") margin: 0; padding: 0; height: 100%; - font-family: Arial, sans-serif; - color: #333; scroll-behavior: smooth; } @@ -31,6 +29,19 @@ html(lang="zh-CN") min-height: 100vh; display: flex; flex-direction: column; + + -moz-font-feature-settings: "kern"; + -webkit-font-smoothing: antialiased; + -moz-osx-font-smoothing: grayscale; + font-synthesis: none; + color: #333; /* 设置文本颜色 */ + + font-size: 17px; + font-style: normal; + font-weight: 400; + letter-spacing: -.022em; + line-height: 1.4705882353; + font-family: "Helvetica Neue", Helvetica, Arial, "PingFang SC", "Hiragino Sans GB", "Heiti SC", "Microsoft YaHei", "WenQuanYi Micro Hei", sans-serif; } block $$head body diff --git a/src/views/page/bind-loc.pug b/src/views/page/bind-loc.pug new file mode 100644 index 0000000..d0d0f28 --- /dev/null +++ b/src/views/page/bind-loc.pug @@ -0,0 +1,106 @@ +extends /layouts/root.pug + +block $$head + script. + window._AMapSecurityConfig = { + securityJsCode: "3cdaa3ebcf936fb3d7f4feff592b4daf" + } + +js("https://webapi.amap.com/maps?v=2.0&key=28fdbb4bfc3894850769251331f54569&plugin=AMap.Geolocation&plugin=AMap.CitySearch") +block $$content + div sadsa + +block $$scripts + script. + //- console.log("342") + // 确保在 API 加载完成后执行 + //- window.onLoad = function() { + + AMap.plugin('AMap.CitySearch', function () { + var citySearch = new AMap.CitySearch() + citySearch.getLocalCity(function (status, result) { + console.log(status, result) + if (status === 'complete' && result.info === 'OK') { + // 查询成功,result即为当前所在城市信息 + } + }) + }) + console.log("onLoad") + // 1. 创建 Geolocation 实例 + var geolocation = new AMap.Geolocation({ + enableHighAccuracy: true, // 开启高精度定位 + timeout: 10000, // 超时时间10秒 + maximumAge: 0, // 不缓存定位结果 + convert: true, // 强制开启坐标转换(关键!确保WGS-84转GCJ-02) + needAddress: true, // 强制返回转换后的地址信息(辅助验证转换结果) + showButton: false, // 隐藏定位按钮 + showMarker: false, // 不显示定位点 + showCircle: false, // 不显示精度圈 + panToLocation: false, // 不移动地图视野 + zoomToAccuracy: false // 不调整地图缩放 + }); + + console.log(geolocation) + // 2. 调用定位方法 + geolocation.getCurrentPosition(function(status,result){ + if(status=='complete'){ + onComplete(result) + }else{ + onError(result) + } + }); + //- function onComplete (data) { + //- console.log(data) + //- } + + //- function onError (data) { + //- console.log(data) + //- } + // 3. 监听定位成功事件 + //- AMap.event.addListener(geolocation, 'complete', onComplete); + + // 4. 监听定位失败事件 + //- AMap.event.addListener(geolocation, 'error', onError); + //- }; + + /** + * 定位成功回调函数 + * @param {Object} data - 定位结果对象 + */ + function onComplete(data) { + console.log("定位成功:", data); + const result = { + 经度: data.position.lng, + 纬度: data.position.lat, + 精度: data.accuracy + ' 米', + 地址: data.formattedAddress || '无', + //- 城市: data.addressComponent.city || '无', + 状态: '成功' + }; + console.log("解析后的定位信息:", result); + // 在这里处理你的定位结果 + } + + /** + * 定位失败回调函数 + * @param {Object} data - 失败信息对象 + */ + function onError(data) { + console.error("定位失败:", data); + let errorMsg = '未知错误'; + switch(data.info) { + case 'PERMISSION_DENIED': + errorMsg = '用户拒绝了定位请求。'; + break; + case 'POSITION_UNAVAILABLE': + errorMsg = '无法获取当前位置。'; + break; + case 'TIMEOUT': + errorMsg = '定位请求超时。'; + break; + case 'UNKNOW_ERROR': + errorMsg = '发生未知错误。'; + break; + } + console.error("错误详情:", errorMsg); + // 在这里处理定位失败的情况 + } \ No newline at end of file diff --git a/src/views/page/index/index.pug b/src/views/page/index/index.pug index 9a1924b..cd75fb3 100644 --- a/src/views/page/index/index.pug +++ b/src/views/page/index/index.pug @@ -6,10 +6,38 @@ block $$head block $$content .page-layout.bg-gray-50 - .container - div(style="height:2000px") sad - div dsad + navbar + //- .placeholder(class="h-[75px] w-full opacity-0") + .fixed.top-0.left-0.right-0.z-10(class="h-[75px]") + .container.h-full + a.h-full.flex.items-center.float-left.text-2xl.font-bold(href="/") 烟霞渡 + //- .float-left.h-full.flex(class="ml-[100px]") + //- a.flex.items-center.px-5(href="/") 关于 + .float-right.h-full.flex + a.flex.items-center.px-5(href="/login") 登录 + canvas#background.absolute.block.top-0.left-0.z-0 + .min-h-screen.relative + .container + div(class="mt-[75px] p-[40px] h-[350px] flex justify-center items-center text-xl" style="line-height: 2.1;") + .typed(style="letter-spacing: 0.2em;") include /htmx/footer/index.pug block $$scripts - block pageScripts + +js("https://cdn.jsdelivr.net/npm/typed.js@2.0.12") + +js("https://cdnjs.cloudflare.com/ajax/libs/particlesjs/2.2.2/particles.min.js") + script. + window.onload= function() { + Particles.init({ + selector: '#background', + maxParticles: 350, + }); + + var options = { + strings: [`烟锁长堤柳色新,
霞映归舟渡水滨。
过客停桡寻旧梦,
一川风月正宜人。`], + typeSpeed: 60, + shuffle: true, + showCursor: false, + }; + + var typed = new Typed('.typed', options); + };