Polymer：如何在配置文件中存储 REST API base URL

Question

我正在使用 polymer starter kit.I 必须在不同的 HTML 页面中进行多次 API 调用，并且对于每个 API 调用，我正在使用 "iron-ajax" 因为 'url' 属性我正在分配 REST API URL.

URL 会像“https://XXXXX.in/YY/YY/YY”，这里基础 URL XXXXX 对于所有 API 调用都是相同的，YY 将 change.So 我怎么能将 Base URL XXX 存储在一个配置文件中，并在所有 "iron-ajax" 的所有页面中访问该值？我应该在哪里访问 Base URL，它是否在 polymer 的所有页面的 'ready' 函数中？

Answer 1

选项 1

在 Polymer 中，您会将值存储为属性。如果你有基础 URL 作为节点树顶部的属性（在第一个 parent 元素中），你可以将它传递给任何 child 元素（并且然后他们可以把它传下去）。

您的顶级元素：

<link rel="import" href="./child-el.html">
<dom-module id="main-el">
    <template>
        <child-el base-url="[[baseUrl]]"></child-el>
    </template>
</dom-module>
<script>
    Polymer({
        is: 'main-el',
        properties: {
            baseUrl: {
                type: String,
                value: 'https://XXXXX.in'
            }
        }
    });
</script>

child:

<dom-module id="child-el">
    <template>
        <iron-ajax url="[[baseUrl]]/YY/YY/YY"></iron-ajax>
    </template>
</dom-module>
<script>
    Polymer({
        is: 'child-el',
        properties: {
            baseUrl: {
                type: String
            }
        }
     });
 </script>

选项 2

您可以将所有 ajax 调用放在一个不在屏幕上呈现任何内容的元素中，然后在您需要的任何位置包含该元素。

<link rel="import" href="./api-handler.html">
<dom-module id="main-el">
    <template>
        <api-handler id="api-handler"></api-handler>
    </template>
</dom-module>
<script>
    Polymer({
        is: 'main-el',
        attached () {
            this.$['api-handler'].makeRequest();
        }
    });
</script>

选项 3

将 baseUrl 属性存储在 Polymer behavior 中并将其包含在您的元素中。

选项 4

您可以将值附加到全局可访问的 window object。您的 config.html 看起来像：

<script>
    (function (Config) {
        Config.BASE_URL = 'https://XXXXX.in';
    })(window.Config = window.Config || {});
</script>

然后将其导入 index.html:

<link rel="import" href="./config.html">

..和 Config.BASE_URL 将在您的所有元素中可用。

Polymer：如何在配置文件中存储 REST API base URL

Polymer: How to store REST API base URL in configuration file

rest

polymer

polymer-1.0

iron-ajax