iron-ajax отправляет закодированный запрос

Question

После отправки формы, я пытаюсь отправить запрос API Mandrill. Работа отправки работает нормально, но запрос содержит нежелательные символы.

Ниже мой код:

Polymer({ 
 
\t \t is: 'landing-page', 
 
\t \t buttonClick: function() { 
 
\t \t \t this.$.landingPageForm.generateRequest(); 
 
\t \t } 
 
/* 
 

 
Upon click i get below request generated by iron-ajax 
 

 
Request URL:https://mandrillapp.com/api/1.0/messages/send.json?0=%7B&1=%22&2=k&3=e&4=y&5=%22&6=%3A&7=%22&8=B&9=h&10=-&11=f&12=6&13=p&14=n&15=X&16=Z&17=P&18=w&19=p&20=Z&21=6&22=4&23=6&24=T&25=_&26=F&27=L&28=m&29=A&30=%22&31=%2C&32=%22&33=m&34=e&35=s&36=s&37=a&38=g&39=e&40=%22&41=%3A&42=%22&43=%22&44=f&45=r&46=o&47=m&48=_&49=e&50=m&51=a&52=i&53=l&54=%22&55=%3A&56=%22&57=e&58=x&59=a&60=m&61=p&62=l&63=e&64=%40&65=d&66=o&67=m&68=a&69=i&70=n&71=.&72=c&73=o&74=m&75=%22&76=%2C&77=%0A&78=%09&79=%09&80=%09&81=%09&82=%09&83=%22&84=t&85=o&86=%22&87=%3A&88=%5B&89=%7B&90=%22&91=e&92=m&93=a&94=i&95=l&96=%22&97=%3A&98=%22&99=r&100=e&101=c&102=i&103=p&104=i&105=e&106=n&107=t&108=%40&109=d&110=o&111=m&112=a&113=i&114=n&115=.&116=c&117=o&118=m&119=%22&120=%7D&121=%5D&122=%2C&123=%0A&124=%09&125=%09&126=%09&127=%09&128=%09&129=%22&130=s&131=u&132=b&133=j&134=e&135=c&136=t&137=%22&138=%3A&139=%20&140=%22&141=S&142=u&143=b&144=j&145=e&146=c&147=t&148=%20&149=l&150=i&151=n&152=e&153=%22&154=%2C&155=%0A&156=%09&157=%09&158=%09&159=%09&160=%09&161=%22&162=t&163=e&164=x&165=t&166=%22&167=%3A&168=%20&169=%22&170=t&171=e&172=x&173=t&174=%20&175=i&176=n&177=%20&178=t&179=h&180=e&181=%20&182=m&183=e&184=s&185=s&186=a&187=g&188=e&189=%22&190=%22&191=%7D 
 

 
Response from server: 
 

 
code: -2 
 
message: "Validation error: {"message":"Please enter an array"}" 
 
name: "ValidationError" 
 
status: "error" 
 

 
*/

THis is in my template: 
 

 
<form is="iron-form" id="formPost" method="post" action="/"> 
 
\t \t \t \t <paper-input name="email" id="email" label="Email Address" value="{{email}}"required></paper-input> 
 
\t \t \t \t \t </br> \t 
 
\t \t \t \t <paper-button type="submit" name="submit" raised on-click="buttonClick">Notify Me!</paper-button> 
 
\t \t \t \t 
 
</form> 
 
<iron-ajax 
 
\t \t \t \t contentType: "application/json" 
 
\t \t \t \t headers='{"Content-Type": "application/json;charset=utf-8"}' \t \t \t \t 
 
\t \t \t \t id="landingPageForm" 
 
\t \t \t \t url="https://mandrillapp.com/api/1.0/messages/send.json" 
 
\t \t \t \t method="POST" 
 
\t \t \t \t params='{"key":"2342sdfsdf","message":""from_email":"example@domain.com", 
 
\t \t \t \t \t "to":[{"email":"recipient@domain.com"}], 
 
\t \t \t \t \t "subject": "Subject line", 
 
\t \t \t \t \t "text": "text in the message""}' 
 
\t \t \t \t handle-as="json" 
 
\t \t \t > \t 
 
\t \t </iron-ajax>

Я использую следующий образец для отправки электронной почты с помощью JavaScript с помощью API Mandrill https://medium.com/@mariusc23/send-an-email-using-only-javascript-b53319616782

Это действительно работает хорошо, когда я использую JQuery Ajax.

Answer 1

Когда я бегу, что params JSON через JSON валидатора это указывает на несколько вопросов:

Parse error on line 3: 
...", "message": ""from_email":"example 
----------------------^ 
Expecting '}', ':', ',', ']' 

Parse error on line 3: 
...ssage": "from_email": "example@domain.co 
-----------------------^ 
Expecting '}', ',', ']' 

Кроме того, это выглядит как Mandrill API ожидает POST JSON в body, а не строку запроса. Измените params на body, чтобы исправить это.

<iron-ajax 
    headers='{"Content-Type": "application/json;charset=utf-8"}'    
    id="landingPageForm" 
    url="https://mandrillapp.com/api/1.0/messages/send.json" 
    method="POST" 
    handle-as="json" 
    body='{ 
    "key": "YOUR API KEY HERE", 
    "message": { 
     "from_email": "YOUR@EMAIL.HERE", 
     "to": [ 
      { 
      "email": "RECIPIENT_NO_1@EMAIL.HERE", 
      "name": "RECIPIENT NAME (OPTIONAL)", 
      "type": "to" 
      }, 
      { 
      "email": "RECIPIENT_NO_2@EMAIL.HERE", 
      "name": "ANOTHER RECIPIENT NAME (OPTIONAL)", 
      "type": "to" 
      } 
     ], 
     "autotext": "true", 
     "subject": "YOUR SUBJECT HERE!", 
     "html": "YOUR EMAIL CONTENT HERE! YOU CAN USE HTML!" 
    } 
    }'></iron-ajax> 

выше должен работать как капли в замене, просто проверить любые изменения в теле JSON с чем-то вроде http://jsonlint.com/

Answer 2

Как Zikes писал выше, вы должны убедиться, что вы отправляете его " POST "и поместил весь внутренний код JSON.

Там может быть одна вещь, которую еще нужно здесь: JSON.stringify(), вот мой код, который решает проблему + позволяет для динамических полей:

 <iron-ajax 
     url="https://mandrillapp.com/api/1.0/messages/send.json" 
     headers='{"Content-Type": "application/json;charset=utf-8"}' 
     handle-as="json" 
     method="POST" 
     body='{{ajaxParams}}';></iron-ajax> 

<script> 
    Polymer({ 
     is: 'contact-form', 
     properties: { 
      name: { type:String, notify: true },//bind it to <iron-input> fields 
      email: { type:String, notify: true }, 
      msg: { type:String, notify: true }, 
      ajaxParams: { 
       type: String, 
       computed: 'processParams(name,email,msg)' 
      } 
     }, 
     processParams: function(name,email,msg) { 
        var resp = { 
          "key": "mandrill-api-key", 
          "message": { 
           "from_email": email, 
           "from_name": name, 
           "headers": { 
            "Reply-To": email 
           }, 
           "subject": "subject", 
           "text": msg, 
           "to": [ 
            { 
             "email": "a@b.c", 
             "name": "email name", 
             "type": "to" 
            } 
           ] 
          } 
         }; 
        return JSON.stringify(resp); 

     } 
    }); 
</script> 

То есть это. Надеюсь, это поможет кому-то.