具有基本身份验证的 Iron-ajax 不起作用

Question

我正在尝试使用 Iron-ajax 从我的聚合物前端向我的 java-jersey 后端发出请求，但如果不将其硬编码为属性，似乎无法找到一种方法来进行基本身份验证。我不知道在哪里编写标头制作方法以便它被 Iron-ajax 使用。我尝试将它放在 Polymer({}) 内部和外部，但它仍然没有被调用。这是我的代码。请帮忙。谢谢。

    <link rel="import" href="../bower_components/polymer/polymer.html">
    <link rel="import" href="../bower_components/iron-ajax/iron-ajax.html">

    <dom-module id="activity-feed">
        <style is="custom-style" include="iron-flex iron-flex-alignment">
            .cont{ height:90vh; overflow: auto;}
    core-list .row{height: 80px;padding: 16px}
        </style>
        <template>
        <div class="cont">
            <iron-ajax
            auto
            url="http://localhost:8080/tip/webapi/home"
            handle-as="json"
            method="GET"
            headers='{"Authorization": {{makeheaders(gi,tanu)}}}'
            last-response="{{gogo}}"
            ></iron-ajax>
            <div>{{gogo.id}}</div>              
            </div>
        </template>
    </dom-module>
    <script>
        Polymer({
            is : "activity-feed",
            makeheaders: function(user,pass){
                console.log('ceva tot se intampla');
            },
        });
        function makeheaders(user, pass) {
            console.log('merge functia');
            return "Basic " + btoa(user + ":" + pass);
        }
    </script>

Answer 1

您的 iron-ajax 元素设置为“auto”，这会在启动时启动 api 请求。您可以删除 auto 属性，并为用户定义一个组合观察者并传递以计算标头，然后手动发送请求：

<link rel="import" href="../bower_components/polymer/polymer.html">
<link rel="import" href="../bower_components/iron-ajax/iron-ajax.html">

<dom-module id="activity-feed">
    <style is="custom-style" include="iron-flex iron-flex-alignment">
        .cont{ height:90vh; overflow: auto;}
core-list .row{height: 80px;padding: 16px}
    </style>
    <template>
    <div class="cont" >
        <iron-ajax
        id="xhr"
        url="http://localhost:8080/tip/webapi/home"
        handle-as="json"
        method="GET"
        headers='[[headers]]'
        last-response="{{gogo}}"
        ></iron-ajax>
        <div>{{gogo.id}}</div>
        </div>
    </template>
</dom-module>
<script>
    Polymer({
        is : "activity-feed",

        properties: {
            headers: {
                type: Object,
                value: function() { return {}; }
            },
            user: String,
            pass: String
        },

        makeHeaders: function(user,pass){
            return "Basic " + window.btoa(user + ":" + pass);
        },

        observers: ['_setBasicAuth(user, pass)'],

        _setBasicAuth(user, pass){
            // might be needed
            this.headers['X-Requested-With'] = "XMLHttpRequest";
            // this sets your Auth header
            this.headers['Authorization'] = this.makeHeaders(user, pass);
            this.$.xhr.generateRequest();
        }

    });

</script>