Question

我正在尝试构建Shopify应用。我在服务器端使用NodeJS，在Shopify中使用Angular 6作为仪表板应用程序以获取配置和内容。

Shopify在iframe中调用我的应用程序，并在链接中包含一些查询参数，以便我可以确定哪个商店请求了该应用程序。

https://myapp.com?shop=galaxy.myshopify.com

我遇到的问题是我的服务器收到此请求并使用Angular index.html文件响应，但我不知道如何在响应时将shop参数赋予Angular应用程序我可以在客户端使用该shop参数来进行Ajax调用。

到目前为止，我尝试了2件事，但是它们不是很优雅。首先是仅在应用加载时读取查询字符串。

<script>
  window.GLOBALS = {
    query: window.location.search
  }
</script>

另一种方法是在服务器端读取参数，并将index.html转换为index.hbs并在发送索引文件之前对参数进行插值。

app.get('/', (req, res) => {
  res.render('index.hbs', { shop: req.query.shop });
});

并在hbs文件中添加商店参数

<script>
  window.GLOBALS = {
    shop: {{shop}}
  }
</script>

还有其他更优雅的方式吗？原因在第一个上，如果我使用任何路由，都会丢失查询参数，而在第二个上，每次构建客户端时，我都必须转换索引文件。

丹尼尔，谢谢你！