Polymer: как сохранить базовый URL REST API в файле конфигурации

Question

Я использую полимерный стартовый набор. Мне нужно сделать много вызовов API на разных страницах HTML, и для каждого вызова API я использую "iron-ajax", в котором для свойства url я назначаю URL-адрес REST API.

URL будет выглядеть как " https://xxxxx.in/YY/YY/YY", здесь базовый URL XXXXX одинаков для всех вызовов API, и YY изменится. Так как я могу сохранить базовый URL XXX в одном файле конфигурации и получить доступ к этому значение на всех страницах для всех "железо-аякс"? где я должен получить доступ к базовому URL, находится ли он внутри функции "Готово" полимера для всех страниц?

Answer 1

ОПЦИЯ 1

В Polymer вы сохраняете значения как свойства. Если у вас есть базовый URL-адрес как свойство над деревом узлов (в первом родительском элементе), вы можете передать его любому дочернему элементу (а затем они могут передать его дальше).

Ваш главный элемент:

<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>

Ребенок:

<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 и включите его в свои элементы.

ВАРИАНТ 4

Вы можете прикрепить значение к глобально доступному объекту окна. Ваш 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 будут доступны во всех ваших элементах.