免费的网站定位组件

这个组件是什么——30 秒演示

What Is My Location 定位组件是一个小巧、自成一体的页面，你用 iframe 把它放进自己的网站。访客点按显示我的位置后，浏览器会请求权限，位置在他们的设备上算出，组件随即显示多种格式的坐标、一个逆地理编码得到的地址，以及 OpenStreetMap 上的图钉。我们不保存访客的任何信息——没有 cookie，没有统计信标，也没有指纹识别。你可以在实时组件页面上看到访客将会看到的完全相同的东西，并在嵌入代码生成器里把它配置成你想要的样子。

一行代码就能嵌入

把下面这段代码粘贴到你希望组件出现的位置：

<iframe src="https://whatismylocation.ai/widget"
        width="100%" height="420" style="border:0;border-radius:12px"
        allow="geolocation" title="What is my location"></iframe>

allow="geolocation" 属性是必需的——没有它，浏览器会拦截 iframe 内的定位请求。高度取 380–460 px 适合大多数版式；组件是响应式的，最窄可到 280 px。

可以配置的选项

嵌入代码生成器会替你生成这个网址，不过参数简单到可以手写：?theme=dark 或 light 用来匹配你的网站配色（省略它就跟随访客的系统设置），&units=imperial 表示英尺和英里，&lang=es（或我们 35 种语言中的任意一种）用于本地化界面文字。例如：/widget?theme=dark&lang=hi 会以印地语渲染深色组件。参数可以随意组合，除此之外什么都不需要——不用密钥，不用账号，也没有配额。

WordPress、Shopify、Wix、React

• WordPress：用我们那个很小的 WP 插件（会添加一个 [whatismylocation] 短代码），或者把 iframe 粘贴到自定义 HTML 区块里。
• Shopify / Wix / Squarespace：每个建站平台都有“嵌入 / 自定义 HTML”元素——粘贴同一行 iframe 代码即可。
• React / Vue / Svelte：直接渲染这个 iframe；它是无状态的，所以不需要处理任何生命周期。
• AMP 或电子邮件：带地理定位的 iframe 在那里跑不起来——改成链接到完整页面。

谁在用定位组件——真实场景

• 配送与物流页面：让顾客在结账前，为难找的地址取到精确坐标。
• 旅行与户外博客：读者可以对照你介绍的步道起点和路线地图，看看自己在什么位置。
• 活动与场馆网站：不用强迫访客安装应用，就能回答“我离得有多远？”。
• 外业与测量团队：一个可以加书签的页面，在任何手机上都能读出 GPS 坐标。
• IT 服务台：在支持通话中快速确认远程用户的大致位置和时区。

为什么嵌入它是安全的——隐私设计

地理定位完全发生在访客的浏览器里，而且只有访客自己点按才会触发，所以嵌入这个组件不会给你带来 GDPR 上的数据处理麻烦：组件本身不需要同意横幅，因为它不设置 cookie，也不加载第三方跟踪器。逆地理编码查询经由我们的服务器代理转发，过程中不保存坐标；我们的隐私指南记录了完整的数据流向；而且这个组件是本站唯一允许在框架里显示的页面——你的用户不会被点击劫持到别的工具上去。如果你之后需要的是程序化访问而不是现成界面，同样的保证也适用于免费的开发者 API。

组件还是 API——你需要哪一个？

先从组件用起；等你需要在自己的代码里拿到原始数值时，再升级到 API。