已经有一份资料了？从它开始
这个页面没法去把你的资料取回来——它压根没有联系任何人的办法，而这正是它的用意。所以换个方向，把资料带过来：在 Google 上打开你的商家，选中，复制，粘贴到下面。凡是认出来的都会填进去，并且一项一项回报给你，好让猜错的地方看得见，而不是悄悄就算数了。
名称、评分、类别、地址、电话号码、网站，以及一整周的营业时间，都能认出来。照片不行：一张图没法以文字的形式穿过剪贴板，所以照片请在第 1 步里加。
存下来的资料，就是这个页面在第 4 步写出来的那份 JSON。它也能直接从 Google Business Profile API 的导出文件里读出一个地点——就是 title、storefrontAddress、regularHours 那种结构——而那正是你自己那份资料导出来的样子。
1 说说这家商家
这里的每一个框，都是 Google 会在某处显示的字段，而页脚那张预览图会随着你打字重画。最值得花心思的是名称和类别：名称是三个版面上唯一都会被截断的字段，而类别是搜索结果在放不下别的东西时唯一还容得下的那一行。
主要类别 一行，用 Google 自己的说法——这是大多数搜索真正会去匹配的那个词。你打字时，这个框会给出大约两百个日常行当作为建议，但它什么都收：Google 自己的清单大约有四千条，而你能挑哪一条，只有它说了算。
把评分和评价数都留空，卡片显示的就是一份新资料该显示的东西：一行「还没有评价」，而不是五颗空星。这是刻意的——五颗空星一眼看过去跟一颗星没什么两样，而这个页面存在的意义，就是让你自己那份资料不会有任何地方让你意外。
属性 用逗号隔开——堂食, 外带, 无障碍通道。一张卡片最多显示六个。
属性 在这里、在这个页面里读取，并重画到小得能放进图里的尺寸。它从来不会离开你的机器，而文件里记录的拍摄地点和时间，在被重画的那一刻就没了。
2 它在哪儿，怎么联系
这三项决定了这份资料能拿到哪几个按钮。没有地址，就没有路线；没有网站，就没有网站；没有电话号码，就没有拨打电话。这是预览上最快能查的一件事，也是真实资料里最常缺的一件事。
地址 写成一行，就像一份资料印出来的那样。
这家商家是上门服务的 管道工、上门宠物美容、只做外送的厨房。Google 显示的会是服务范围而不是街道地址，上面那个框也就变成那个范围。
网站 显示时不带 https://，也不带 www.，一份资料就是这么印的。
3 什么时候开门
状态跟随设备的本地时钟，或下方指定的日期和时间。填写一周营业时间，即可查看何时显示营业中或已打烊，也支持跨越午夜的时段。
使用此设备的时区。关闭此选项后会跟随设备时钟，每分钟更新状态。此选择不会保存在商家资料的 JSON 中。
4 看看它，然后把它带走
同一份资料，裁成三种长度。在它们之间切换看看：放得进知识面板的，未必放得进搜索结果，而搜索结果正是那些原本不知道你名字的人找到一家商家的地方。
真东西上用的字体是 Google Sans，那不是你机器上会有的字体，而版式会随着每一次改版而变——所以间距当个近似看就好。真正精确的，是值得预览的那一部分：每个字段在它被给到的宽度里，还能剩下多少。
这是一幅画，不是截图。并非由 Google 制作、认可，也与 Google 无关。
# 商家资料预览 把内容打进去，它就变成 Google 会画的那张卡片。为了画它，不会往外送任何东西。 > 在上线之前就看到你的 Google 商家资料长什么样：知识面板、手机上的地点卡片和本地搜索结果，全部由你打进去的名称、类别、营业时间、评分和照片画出来。已有的商家资料可以粘贴进来导入。做好的图能下载成 PNG 或 SVG。整个过程都发生在你的浏览器里。 This is an interactive browser tool at https://httcup.github.io/tools/business-profile-preview/. Files are processed on the device running that browser. Any deliberate sharing or optional network feature is described on the page. What follows is its written explanation; open the address to use it. ## Your 商家资料和它们的图 are **processed in your browser**. No processing upload. 你打进去的每一个字段，都是被这个页面里大约一千行你能读的 JavaScript 画成一张图的，而这中间没有哪一步会去联系谁。不会去查你的商家，不会去核对地址，也不会去取一颗星星。这个工具压根就没有任何网络功能——这一点在这里格外要紧，因为一份商家资料往往既是店面，也是某个人的家庭住址，而那个电话号码，多半就响在他自己兜里。 - ✗ 不上传 - ✗ 不注册 - ✗ 无水印 - ✓ 断网可用 - ✓ 开源 ## 怎样在 Google 商家资料上线之前先预览它 1. **如果你已经有一份资料，就从它开始。** 在 Google 上打开你的商家，把整张卡片选中——名称、星星，以及底下那几行——复制，粘贴到这个页面顶上那个折叠框里。名称、类别、评分、评价数、地址、电话号码、网站，以及一整周的营业时间，都会被认出来，而且页面会回过头来告诉你它究竟填上了哪几项，好让猜错的地方看得见，而不是悄悄就算数了。如果你手里有 Business Profile API 导出的文件，那个也能打开。 2. **先把名称和类别弄对。** 它们两个加起来，比其余所有东西都重。名称是三个版面上唯一都会被截断的字段，而搜索结果里截得最狠——所以一个把城市和行当都缀在末尾的名字，在最可能来找你的人那里，读出来就是一个省略号。类别则是本地结果在放不下别的东西时唯一还容得下的那一行，也是一次搜索真正会去匹配的那个词。 3. **把一周填满，然后看看它说了什么。** 状态那一行是一份资料里唯一会自己变的部分：*营业中 · 21:00 关门* 会自己变成*已关门 · 周二 09:00 开门*，谁都不用去动它。这个页面是从营业时间和你自己的钟推出来的，所以把某一天改成休息，你立刻就能看到那天晚上来查你的人会被告知什么。一个结束早于开始的时段——22:00 到 02:00——会被读成跨过午夜，而这正是一家酒吧的意思。 打开*预览指定的日期和时间*，可按此设备的时区查看某个晚上或次日早晨。关闭后会再次跟随设备时钟。此选择不会保存在商家资料的 JSON 中。 4. **看看你挣到了哪几个按钮。** 没有地址，就没有*路线*。没有网站，就没有*网站*。没有电话号码，就没有*拨打电话*。这三个字段会变成名称底下那一排按钮，而缺了其中一个的资料，就是一份读者没法直接采取行动、得先去别处的资料。这是预览上最快能查的一件事，也是真实资料里最常缺的一件事。 5. **三个版面都要看，别只看第一个。** 同一份资料会被裁成三种长度。知识面板最宽裕，是别人已经知道你名字时看到的那个；手机卡片才是你大多数访客真正拿到的那个；本地结果那一条最窄，而正是在那里，一个从没听说过你的人要在你和另外两家之间做选择。一段在第一个版面里读着顺的介绍，到第三个版面里可能根本看不见。 6. **把图带走。** PNG 会按版面自身的尺寸导出，或者两倍、三倍，而这是唯一一种不会让换行位置移动的放大。如果要放进文档里，那就把 SVG 也拿上——它是一个自成一体的文件，照片就在里面，所以打印出来是清晰的，而且不带指向任何地方的链接。存下来的资料是第三个下载，如果你打算过些时候再回来，该留的就是它。 ## The longer version [如何在上线前预览 Google 商家资料](https://httcup.github.io/tools/guides/preview-a-google-business-profile/): 桌面、手机和本地结果里资料长什么样：名称保留多少、类别作用、哪些字段成为按钮，以及无人看时营业状态怎样。 ## Also in the box - [图片压缩](https://httcup.github.io/tools/compress-image/): 说个大小，剩下的它来算。 - [图片缩放](https://httcup.github.io/tools/resize-image/): 说个尺寸，拉个框，挑个格式。 - [Image Layout](https://httcup.github.io/tools/image-layout/): Put your pictures together. Keep them on your machine. - [HEIC 转 JPG](https://httcup.github.io/tools/heic-to-jpg/): iPhone 拍的照片，换成什么都打得开的格式。 ## Questions ### 这个是 Google 做的吗？ 不是。本站与 Google 没有任何关联，未获其认可，也不存在任何联系；Google Business Profile 是 Google 的商标，这里提到它，只是为了说清楚这个页面预览的是什么。你看到的是在你自己的浏览器里、用你打进去的内容画出来的一幅图——不是截图，不是你那份资料的实时视图，也没有连着你的 Google 账号。你在这里做的任何事都不会改变你真正的资料；要改那个，你得去 Google。 ### 它能自动导入我现有的资料吗？ 不能，而且值得把原因说清楚：把你的资料取回来，就意味着这个页面能够联系服务器，而一个能联系服务器的页面，就是一个能把你的字段送出去的页面。那个本事，正是整个网站刻意不去拥有的东西。所以导入是反过来做的——你把资料复制下来粘贴进去，页面从文字里尽量读出它能读的部分，再告诉你它填上了哪些字段。Business Profile API 导出的 JSON 可以直接打开。 ### 我打进去的东西会被送到哪里吗？ 不会。这个工具的代码里没有 `fetch`,没有 `XMLHttpRequest`，也没有 `sendBeacon`,而页面的 `Content-Security-Policy` 列出了它可以联系的每一个地址，其中没有一个属于本站。这件事在这里比在大多数页面上更要紧：一份商家资料，常常就是某个人的家庭住址，和一个响在他兜里的电话号码。 ### 这张预览图有多准？ 在“放得下什么”这件事上准，在“看起来什么样”这件事上是近似。真东西上用的字体是 Google Sans，那不是你机器上会有的字体，而间距会随着搜索和地图的每一次改版而变——所以像素上的精确程度，当个印象看就好。真正精确的，是值得预览的那一部分：你的名称在每一种宽度下还剩下多少，类别在最窄的版面上还读不读得出来，以及你的字段挣到了哪几个按钮。 ### 为什么我刚建的资料一颗星都不显示？ 因为 Google 就是这么显示的，也因为五颗空星一眼看过去，跟一颗星没什么两样。把评分和评价数都留空，卡片就会说还没有评价，而这正是一份还没人评价过的资料该有的诚实预览。两个都填上数字，星星就出来了，并且按这个数字实际所占的比例填充——4.6 是四颗星再加五分之三颗，不是五颗。 ### 那行“营业中”或“已关门”，到底取决于什么？ 取决于填写的一周营业时间，默认使用此设备的本地时钟，每分钟更新状态。也可指定本地日期和时间来查看一周中的某个时段。预览使用此设备的时区，不会转换为商家时区，也不支持节假日特别营业时间。如果商家位于其他地区，请输入要查看的当地时间。此选择不包含在保存的商家资料 JSON 中。 ### 这张图能用在方案、路演材料或者给客户的报告里吗？ 可以。没有水印，没有账号，做多少张都不限，文件里也没有任何指回这里的东西。那就是你自己的字段，在你自己的机器上画成的一张图。唯一值得跟收到它的人说一句的，是它到底是什么——一份“资料会长成什么样”的模拟图——因为一幅像到这个程度的画，很容易被当成某个已经存在的东西的截图。 ### 那三种预览之间差在哪里？ 差在宽度，因而也差在还能留下多少。**知识面板**是你在桌面端搜自己名字时右边那张高卡片：最宽裕，也是你自己去查自己时看到的那个。**手机**卡片才是你大多数访客真正拿到的那个。**搜索结果**是本地三连里的一条，就是上面顶着一张地图的那个三家一组的区块，它最窄，而正是在那里，一个从没听说过你的人要在你和另外两家之间做选择。 ### 我加的照片会被上传吗？ 不会。它是在这个页面里解码的，按卡片用得上的尺寸重画到一张 canvas 上，再作为数据嵌进图里。由此有两件事：文件从来没有离开过你的机器，而它记录的拍摄地点和时间也全都没了，因为一张 canvas 是没有元数据的。如果原件对你有价值，那就把原件留着——进到预览图里的是一份副本。 ### 我能把打好的内容存下来，过些时候再回来吗？ 可以，以文件的形式。*保存资料*会把 JSON 写到你的磁盘上，里面有每一个字段和那张照片，再在这里打开那个文件，一切都会回来。两次访问之间这个浏览器里什么都不存，也没有账号可登——这是刻意的：一家店的地址、电话和营业时间，不是我们该替人保管的东西。 ### 它离线能用吗？ 能。页面加载一次之后，断开网络它照样能用——字段、绘图、PNG,全都还在。这也是证明“什么都没被上传”最简单的办法：一个要把你的资料送出去才能画出卡片的工具，在你拔线的那一刻就会停下来。 ## How the privacy claim is verifiable - **处理在这个浏览器里完成。** 本工具在浏览器里处理输入和结果，处理代码不把它们上传去处理。Content-Security-Policy 限制可用资源和连接目的地，但已允许的主机仍可接收请求。策略不检查载荷，不能单独证明什么都没有发出。请把具体操作的请求与源码核对，或断网完成该本地操作。 - **这里没有任何东西会去取什么。** `src/` 里没有 `fetch`,没有 `XMLHttpRequest`，也没有 `sendBeacon`。这同时也是它没法替你把资料查回来的原因，以及为什么“导入”意味着粘贴：能去取回来的本事，恰恰就是能把东西送出去的本事。 - **照片是在这里读的，进来的路上就被剥干净了。** 封面照片是在这个页面里解码的，在进入成品图之前会被重画到一张 canvas 上，这既限定了它的尺寸，也丢掉了文件里记录的拍摄地点和时间。最后留在预览图里的是那幅画面，不是你选的那个文件。 - **下载下来的，就是屏幕上的那个。** PNG 不是另做一次、可能跟预览对不上的渲染：交给浏览器画到 canvas 上的，是同一份标记。这也是为什么拔了网线也能下载——里面没有要去取的字体，也没有外链的图片，整张图就是一个自成一体的文件。 - **存下来的资料是一个文件，不是一个账号。** 这个页面写出来的 JSON 会存到你的磁盘上，不去别处，而再把它打开，是这个工具记得任何事情的唯一方式。两次访问之间浏览器里什么都不留，因为一家店的地址和营业时间，不是我们该替人保管的东西。 - **Google 会加载什么，以及它拿不到什么。** 广告和统计脚本来自 Google,捐赠按钮来自 Buy Me a Coffee。它们谁也拿不到你打进去的任何东西——这里头的讽刺我们看得见，而这道界限是真的：把你的字段变成一张图的每一行代码，都由这个源提供，也都列在代码库里。 - **它离线也能用。** 断开网络，这个工具一点都不会变，因为它里面从来就没有过一个网络步骤。这是最简单的一条证明。 **Check it yourself.** None of the above has to be taken on trust. This page is generated from the templates and config in the repository by a build script you can read and run yourself, and the result is committed to the `dist` branch — so you can diff what is served against what a build of the sources produces: https://github.com/httcup/tools The files worth reading first are `config/site.toml` for the Content-Security-Policy，`src/surfaces.js` 是那三张卡片本身——里面每一个坐标都是写死在那儿的——`src/profile.js` 是这个页面上唯一一处算术，也就是此刻这家店开着还是关着，而 `src/parse-listing.js` 管的是你粘贴进来的那份资料会经历什么。
怎样在 Google 商家资料上线之前先预览它
- 如果你已经有一份资料，就从它开始。在 Google 上打开你的商家，把整张卡片选中——名称、星星，以及底下那几行——复制，粘贴到这个页面顶上那个折叠框里。名称、类别、评分、评价数、地址、电话号码、网站，以及一整周的营业时间，都会被认出来，而且页面会回过头来告诉你它究竟填上了哪几项，好让猜错的地方看得见，而不是悄悄就算数了。如果你手里有 Business Profile API 导出的文件，那个也能打开。
- 先把名称和类别弄对。它们两个加起来，比其余所有东西都重。名称是三个版面上唯一都会被截断的字段，而搜索结果里截得最狠——所以一个把城市和行当都缀在末尾的名字，在最可能来找你的人那里，读出来就是一个省略号。类别则是本地结果在放不下别的东西时唯一还容得下的那一行，也是一次搜索真正会去匹配的那个词。
- 把一周填满，然后看看它说了什么。状态那一行是一份资料里唯一会自己变的部分：营业中 · 21:00 关门 会自己变成已关门 · 周二 09:00 开门，谁都不用去动它。这个页面是从营业时间和你自己的钟推出来的，所以把某一天改成休息，你立刻就能看到那天晚上来查你的人会被告知什么。一个结束早于开始的时段——22:00 到 02:00——会被读成跨过午夜，而这正是一家酒吧的意思。 打开预览指定的日期和时间，可按此设备的时区查看某个晚上或次日早晨。关闭后会再次跟随设备时钟。此选择不会保存在商家资料的 JSON 中。
- 看看你挣到了哪几个按钮。没有地址，就没有路线。没有网站，就没有网站。没有电话号码，就没有拨打电话。这三个字段会变成名称底下那一排按钮，而缺了其中一个的资料，就是一份读者没法直接采取行动、得先去别处的资料。这是预览上最快能查的一件事，也是真实资料里最常缺的一件事。
- 三个版面都要看，别只看第一个。同一份资料会被裁成三种长度。知识面板最宽裕，是别人已经知道你名字时看到的那个；手机卡片才是你大多数访客真正拿到的那个；本地结果那一条最窄，而正是在那里，一个从没听说过你的人要在你和另外两家之间做选择。一段在第一个版面里读着顺的介绍，到第三个版面里可能根本看不见。
- 把图带走。PNG 会按版面自身的尺寸导出，或者两倍、三倍，而这是唯一一种不会让换行位置移动的放大。如果要放进文档里，那就把 SVG 也拿上——它是一个自成一体的文件，照片就在里面，所以打印出来是清晰的，而且不带指向任何地方的链接。存下来的资料是第三个下载，如果你打算过些时候再回来，该留的就是它。
更完整的说明
如何在上线前预览 Google 商家资料 桌面、手机和本地结果里资料长什么样：名称保留多少、类别作用、哪些字段成为按钮，以及无人看时营业状态怎样。
盒子里还有什么
有疑问？
这个是 Google 做的吗？
不是。本站与 Google 没有任何关联，未获其认可，也不存在任何联系；Google Business Profile 是 Google 的商标，这里提到它，只是为了说清楚这个页面预览的是什么。你看到的是在你自己的浏览器里、用你打进去的内容画出来的一幅图——不是截图，不是你那份资料的实时视图，也没有连着你的 Google 账号。你在这里做的任何事都不会改变你真正的资料；要改那个，你得去 Google。
它能自动导入我现有的资料吗？
不能，而且值得把原因说清楚：把你的资料取回来，就意味着这个页面能够联系服务器，而一个能联系服务器的页面，就是一个能把你的字段送出去的页面。那个本事，正是整个网站刻意不去拥有的东西。所以导入是反过来做的——你把资料复制下来粘贴进去，页面从文字里尽量读出它能读的部分，再告诉你它填上了哪些字段。Business Profile API 导出的 JSON 可以直接打开。
我打进去的东西会被送到哪里吗？
不会。这个工具的代码里没有 fetch,没有 XMLHttpRequest，也没有 sendBeacon,而页面的 Content-Security-Policy 列出了它可以联系的每一个地址，其中没有一个属于本站。这件事在这里比在大多数页面上更要紧：一份商家资料，常常就是某个人的家庭住址，和一个响在他兜里的电话号码。
这张预览图有多准？
在“放得下什么”这件事上准，在“看起来什么样”这件事上是近似。真东西上用的字体是 Google Sans，那不是你机器上会有的字体，而间距会随着搜索和地图的每一次改版而变——所以像素上的精确程度，当个印象看就好。真正精确的，是值得预览的那一部分：你的名称在每一种宽度下还剩下多少，类别在最窄的版面上还读不读得出来，以及你的字段挣到了哪几个按钮。
为什么我刚建的资料一颗星都不显示？
因为 Google 就是这么显示的，也因为五颗空星一眼看过去，跟一颗星没什么两样。把评分和评价数都留空，卡片就会说还没有评价，而这正是一份还没人评价过的资料该有的诚实预览。两个都填上数字，星星就出来了，并且按这个数字实际所占的比例填充——4.6 是四颗星再加五分之三颗，不是五颗。
那行“营业中”或“已关门”，到底取决于什么？
取决于填写的一周营业时间，默认使用此设备的本地时钟，每分钟更新状态。也可指定本地日期和时间来查看一周中的某个时段。预览使用此设备的时区，不会转换为商家时区，也不支持节假日特别营业时间。如果商家位于其他地区，请输入要查看的当地时间。此选择不包含在保存的商家资料 JSON 中。
这张图能用在方案、路演材料或者给客户的报告里吗？
可以。没有水印，没有账号，做多少张都不限，文件里也没有任何指回这里的东西。那就是你自己的字段，在你自己的机器上画成的一张图。唯一值得跟收到它的人说一句的，是它到底是什么——一份“资料会长成什么样”的模拟图——因为一幅像到这个程度的画，很容易被当成某个已经存在的东西的截图。
那三种预览之间差在哪里？
差在宽度，因而也差在还能留下多少。知识面板是你在桌面端搜自己名字时右边那张高卡片：最宽裕，也是你自己去查自己时看到的那个。手机卡片才是你大多数访客真正拿到的那个。搜索结果是本地三连里的一条，就是上面顶着一张地图的那个三家一组的区块，它最窄，而正是在那里，一个从没听说过你的人要在你和另外两家之间做选择。
我加的照片会被上传吗？
不会。它是在这个页面里解码的，按卡片用得上的尺寸重画到一张 canvas 上，再作为数据嵌进图里。由此有两件事：文件从来没有离开过你的机器，而它记录的拍摄地点和时间也全都没了，因为一张 canvas 是没有元数据的。如果原件对你有价值，那就把原件留着——进到预览图里的是一份副本。
我能把打好的内容存下来，过些时候再回来吗？
可以，以文件的形式。保存资料会把 JSON 写到你的磁盘上，里面有每一个字段和那张照片，再在这里打开那个文件，一切都会回来。两次访问之间这个浏览器里什么都不存，也没有账号可登——这是刻意的：一家店的地址、电话和营业时间，不是我们该替人保管的东西。
它离线能用吗？
能。页面加载一次之后，断开网络它照样能用——字段、绘图、PNG,全都还在。这也是证明“什么都没被上传”最简单的办法：一个要把你的资料送出去才能画出卡片的工具，在你拔线的那一刻就会停下来。