关键词：
【中文标题】如何使用 Firebase 为单页应用程序实现 sitemap.xml 文件？【英文标题】：How to implement a sitemap.xml file for a single page app using Firebase? 【发布时间】：2020-01-12 04:04:57 【问题描述】：我在阅读谷歌关于 SEO 的指南时发现了这一点。
帮助 Google 找到您的内容
让您的网站出现在 Google 上的第一步是确保 Google 可以找到它。最好的方法是提交站点地图。站点地图是您网站上的一个文件，它告诉搜索引擎您网站上的新页面或更改页面。详细了解如何构建和提交站点地图。
Obs.：我的网络应用是一个电子商务/博客，我在其中有一个商店，我有产品要出售，我有一个博客部分，我可以在其中创建和发布有关这些产品的内容。
因此，每个产品都有一个产品页面，每个博客文章都有一个blogPost页面。
然后我从像我这样具有良好 SEO 排名的网站中寻找一些 站点地图 示例。
我发现了这个很好的例子：
robots.txt
User-Agent: *
Disallow: ... // SOME ROUTES
Sitemap: https://www.website.com/sitemap.xml
IE：显然爬虫机器人从 robots.txt 文件中找到了站点地图位置。
我还发现他们为 blogPost 和产品页面保留了单独的站点地图文件。
sitemap.xml
<sitemapindex xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xmlns="http://www.sitemaps.org/schemas/sitemap/0.9" xsi:schemaLocation="http://www.sitemaps.org/schemas/sitemap/0.9 http://www.sitemaps.org/schemas/sitemap/0.9/siteindex.xsd">
<sitemap>
<loc>https://www.website.com/blogPosts-sitemap.xml</loc> // FOR POSTS
<lastmod>2019-09-10T05:00:14+00:00</lastmod>
</sitemap>
<sitemap>
<loc>https://www.website.com/products-sitemap.xml</loc> // FOR PRODUCTS
<lastmod>2019-09-10T05:00:14+00:00</lastmod>
</sitemap>
</sitemapindex>
blogPosts-sitemap.xml
// HUGE LIST WITH AN <url> FOR EACH BLOGPOST URL
<url>
<loc>
https://www.website.com/blog/some-blog-post-slug
</loc>
<lastmod>2019-09-03T18:11:56.873+00:00</lastmod>
<changefreq>weekly</changefreq>
<priority>0.8</priority>
</url>
products-sitemap.xml
// HUGE LIST WITH AN <url> FOR EACH PRODUCT URL
<url>
<loc>
https://www.website.com/gp/some-product-slug
</loc>
<lastmod>2019-09-08T07:00:16+00:00</lastmod>
<changefreq>yearly</changefreq>
<priority>0.3</priority>
</url>
问题
如果我的网络应用是带有客户端站点路由的单页应用，我如何保持Sitemap 文件的更新？
因为我使用 Firebase 作为我的主机，所以我想做的是：
选项 #1 - 将 sitemap.xml 保留在 Firebase 托管中
来自这个问题Upload single file to firebase hosting via CLI or other without deleting existing ones?
Frank van Puffelen 说：
更新（2018 年 12 月）：Firebase 托管现在具有 REST API。虽然这仍然不允许您部署单个文件，但您可以创造性地使用它来获得您想要的东西。在这里查看我的要点：https://gist.github.com/puf/e00c34dd82b35c56e91adbc3a9b1c412
我可以使用他的 Gist 更新 sitemap.xml 文件并每天运行一次此脚本，或者在我想要的任何时候运行。这适用于我当前的项目，但不适用于动态页面更改频率较高的项目，例如新闻门户或市场。
选项 #2 - 将 sitemap.xml 保存在 Firebase 存储中
将站点地图文件保存在我的存储桶中，并根据需要通过管理脚本或云计划函数频繁更新。
在我的firebase.json 中设置重写，并指定一个函数来响应并在请求时从存储桶中提供站点地图文件。
firebase.json
"hosting":
// ...
// Add the "rewrites" attribute within "hosting"
"rewrites": [
"source": "/sitemap.xml",
"function": "serveSitemapFromStorageBucket"
]
最后的问题
我倾向于选项 #2，我想知道它是否适用于这个特定目的，或者我是否遗漏了什么。
【问题讨论】：
您好，我也遇到了和您一样的问题，想知道您的解决方案是否适用于 google 搜索控制台？ @JimmyLin 我有一个云函数可以即时生成sitemap.xml。例如：https://www.mywebsite.com/sitemap.xml 将被重定向到 http 云函数，该函数将构建文件并做出响应。这样，站点地图“文件”就不存在了。它是按需生成的，并且始终使用最新数据进行更新。
@JimmyLin 我已经发布了答案。
当如此简单的事情最终变得如此复杂时，我们走错了方向。
【参考方案1】：
我最终创建了一个云函数来按需构建站点地图文件。
firebase.json
"rewrites": [
"source": "/sitemap.xml",
"function": "buildSitemap"
,
]
buildSitemap.js（这是一个云功能）
import * as admin from 'firebase-admin';
async function buildSitemap(req,res)
// Use firebase-admin to gather necessary data
// Build the sitemap file string
// and send it back
res.set('Content-Type', 'text/xml');
res.status(200).send(SITEMAP_STRING);
return;
export default buildSitemap;
【讨论】：
你还在用这个方法吗？但是，因为我有类似的方法，所以我觉得这样做有一些缺点。每个站点地图最多只能存储 50.000 个网址，可能会进行大量不必要的读取（我从 Firestore 获取所有帖子 ID），最后，每次从头开始创建站点地图都需要几秒钟。 我还在用它。到目前为止，它工作正常。不过，我得到了大约 100 个网址。我知道您可以创建一个站点地图索引并将其分解为多个站点地图文件，因此每个文件都有 50k。也可以缓存一天，避免读取过多。 感谢您的快速回复。是的，我目前正在尝试使用站点地图索引方法并将网址拆分为多个文件。如果我能够实现它，我可以让你知道。最后一件事，您是否有关于如何将站点地图结果缓存一天的参考或 sn-p？ @LukyFoggy 这取决于您的实现细节。如果您的托管服务提供商有 CDN，您可以通过设置Cache-Control: s-maxage=SOME_VALUE_IN_SECONDS 标头将其缓存在 CDN 上。或者，如果您不在 CDN 后面，则可以直接在您的服务器上缓存。
就是这样。您可以在firebase.json 配置文件中设置它，也可以在您的服务器/云功能上设置它。请注意firebase.json 将覆盖您在服务器上设置的内容。见this question。至少，这些是我测试此行为后得到的结果。为单页富 web 应用程序使用会话是否有点矫枉过正？ [关闭]
】为单页富web应用程序使用会话是否有点矫枉过正？[关闭]【英文标题】：Isusingsessionsforsinglepagerichwebappanoverkill?[closed]为单页富web应用程序使用会话是不是有点矫枉过正？[关闭]【发布时间】：2013-03-1107:08:17【问题描述】：有一... 查看详情
如何从 facebook/google/... oauth2 身份验证在 Spring (Boot) 中为单页应用程序派生自定义登录令牌？
...如何从facebook/google/...oauth2身份验证在Spring(Boot)中为单页应用程序派生自定义登录令牌？【英文标题】：Howtoderiveacustomlogin-tokenfromafacebook/google/...oauth2authenticationinSpring(Boot)forasinglepageapplication?【发布时间】：2021-08-2920:21:42【问题描... 查看详情
将 PDF 对转换为单页的最佳方法是啥？
...】：2018-04-2605:22:06【问题描述】：我需要获取现有的PDF（使用Prawn创建），并将第1页（封面）之后的对组合成单页。我还想在连接页面的中心添加一条垂直线。这些页面将打印在书籍中，目标是制作类似于Acrobat中并排视图的 查看详情
如何在 firebase 托管中托管单页 webapp 的静态文件，并将 web API 部署在不同的服务器中
...布时间】：2021-08-1104:50:37【问题描述】：我有一个单页web应用程序，它使用通过同一域公开的RESTAPI。目前，静态文 查看详情
Firebase 托管单页应用程序上的深度路由问题
】Firebase托管单页应用程序上的深度路由问题【英文标题】：Troublewithdeeproutesonasingle-pageapponFirebasehosting【发布时间】：2016-05-2920:57:00【问题描述】：（在下面更新了更多信息）我们有一个基于React的单页网络应用，它存在于Firebas... 查看详情
如何使用 PKCE 为 React 单页应用程序实现 OAuth2 授权代码授予？
】如何使用PKCE为React单页应用程序实现OAuth2授权代码授予？【英文标题】：HowtoimplementtheOAuth2AuthorizationcodegrantwithPKCEforaReactsinglepageapplication?【发布时间】：2020-03-1205:44:11【问题描述】：在我们的组织中，我们使用自己的自定义Oau... 查看详情
如何使用 Firebase 实现忘记密码功能？
...天和通知功能实现了firebase云消息传递。每次我登录我的应用程序时，我都会登录firebase以进行聊天和消息传递。现在忘记密码了，我必须通过我的应用程序发送密码 查看详情
如何从单页应用程序实现 OAuth 2.0 授权码授予？
】如何从单页应用程序实现OAuth2.0授权码授予？【英文标题】：HowtoimplementOAuth2.0AuthorizationCodeGrantfromSingle-PageApplication?【发布时间】：2019-02-0101:24:11【问题描述】：我们有一个由ASP.NETWebAPI支持的AngularSPA，它使用带有承载令牌的OAu... 查看详情
如何使用 Firebase 托管为 React SPA 提供 404 页面？
...2016-12-1313:59:19【问题描述】：我目前正在为我的单页React应用程序使用firebase托管。我还在我的公共目录中添加了一个404.html页面。我的假设是，如果用户输入的url不在我的路由中（使用react-router） 查看详情
如何使用vue2构建简单的单页应用程序
参考技术Aapp很简单，使用vuejs自不必说，组件开发模块管理使用vue-loader、webpack，页面切换以及过场动画使用vue-router，在app开发过程只需关注app的数据走向即可，另外可以搭配各类UI库让你的应用更加美观，正如楼上答过的，使... 查看详情
如何使用 Flutter 和 Firebase 实时数据库实现邀请系统 [关闭]
...题描述】：我正在开发一个使用firebase实时数据库的Flutter应用程序。该应用程序应由用户协作使用以收集和分析数据。用户是团队的一 查看详情
如何在flutter上使用firebase正确实现注销
...描述】：这听起来很愚蠢，但我不能真正正确地注销我的应用程序，那是因为我在MaterialApp上使用了多个FirebaseAnimatedList和路由routes:<String,WidgetBuilder& 查看详情
如何使用 Authy+Amazon lambda+Firebase 实现 SMS/2FA 验证？
...一个使用Firebase作为后端来存储数据的Android应用。在我的应用程序开发过程中，为了简单起见，我一直使用Firebase的电 查看详情
如何使用 MVVM 架构实现 Firebase Google SignIn？
...布时间】：2019-10-2018:46:13【问题描述】：我正在构建一个应用程序，但我目前面临一个问题：我按照googleguide在LoginActivity中编写了我的Google/Facebook登录按钮的所有事件。但是，我不想将业务代 查看详情
在 react s-s-r 应用程序中调用 firebase 消息传递方法时，如何修复 self 未定义？
】在reacts-s-r应用程序中调用firebase消息传递方法时，如何修复self未定义？【英文标题】：Howtofixselfisnotdefinedwhenfirebasemessagingmethodcalledinreacts-s-rapp?【发布时间】：2020-01-1000:47:22【问题描述】：我正在尝试在使用https://github.com/jaredp... 查看详情
使用 Firebase 实现推送通知的最佳方式
...发布时间】：2016-04-1204:21:15【问题描述】：我是一名iPhone应用程序编码员，我使用Firebase作为我的后端服务器。Firebase不支持推送通知，所以我一直试图弄清楚如何将它们包含在我的应用程序中。我读过这个问题：Howtosendanalertmess... 查看详情
使用 Google 登录通过 Firebase 签名后如何访问课堂 API
...时间】：2020-09-1818:30:25【问题描述】：我创建了一个统一应用程序来使用google登录并访问google-clas-s-roomapi。登录成功，范围也允许访问课程。问题：使用firebase登录 查看详情
如何使用 Ionic 4 实现 Firebase 电话身份验证？
】如何使用Ionic4实现Firebase电话身份验证？【英文标题】：HowtoimplementFirebasephoneauthenticationwithIonic4?【发布时间】：2019-10-0807:47:49【问题描述】：是否可以在移动应用中通过Firebase和Ionic4使用电话身份验证？我看过一些使用Ionic3实... 查看详情