Vee-validate: email validation through mailgun api

[ctf0]

is there any chance to incorporate the mailgun api email validation into the core email rule ?

https://documentation.mailgun.com/api-email-validation.html , something like http://formvalidation.io/examples/using-mailgun-api-validate-email-address/

[logaretm]

You can't override the core rules at the moment, but you can add a custom rule which should validate the email against the Mailgun API. And I don't think its very common to make it a 'built-in' rule as other developers may want to use some other API or not need it at all.

If you need help implementing the custom rule I would be happy to help.

[ctf0]

okay i understand but the issue is i dont know how to convert the curl call to js instead 😢 , however for now am thinking of using the jquery code https://documentation.mailgun.com/api-email-validation.html#jquery-plugin in the custom validator

[logaretm]

Seems like you need to send a GET request to this URL https://api.mailgun.net/v3/address/validate and you should provide your public key and the address to validate.

const validate = (value) => {
  return Vue.http.get('https://api.mailgun.net/v3/address/validate', { params: { address: ADDRESS, api_key: YOUR_KEY } }).then(response => {
    return {
      valid: response.data.is_valid // according to the mailgun docs.
    };
  });
};

Something like that should work, I can't seem to get it to work tho, keeps returning 401's for my account, here is a small jsfiddle that uses one of their public keys that works fine. Note that I'm using vue-resource plugin, but you are free to use whatever promise API.

https://jsfiddle.net/6b0umy5o/1/

I hope that helps you

[ctf0]

soooweet, and we can use if & else for the different msgs that come back from mailgun and bind to the getMessage , correct ?

and yeah, dont worry about the api key, the public keys they offer works just fine, am actually using the same one i got for like 3 years already

[logaretm]

Different messages for the same rule can be tricky, I didn't implement 'reasoning' behind error messages since all of them are very basic, but I plan to soon.

A workaround to to cache the response, and the message should load it from the cache and remove it when it fetches it. I'm aware that is not very clean but I'm working on it.

You might also need to throttle the api requests to avoid conflicts.

[ctf0]

i didn't know it was that hard, however as i understand that the v-resource have 2 response type (success & error) and i believe if the address wasn't valid mailgun send back a non 200 status which we can then catch in the error response and in this case we can keep the getMessage as an empty string and bind it with whatever come from the responses, is that even possible or am i missing the point ?

[logaretm]

yes of course you can handle it that way, you can store the message in the instance data and have it bound to the error display element instead of the errors object.

[ctf0]

but this is not possible from withing the Validator.extend correct ?

[logaretm]

I'm not sure what do you mean, but the plugin does not support it directly so you must find a way around it for the time being, Like I said I'm exploring alternatives and different approaches.

I updated the fiddle to show one way (messy): https://jsfiddle.net/6b0umy5o/2/

here another but it requires you to extend it inside the component to gain a reference of this

https://jsfiddle.net/6b0umy5o/4/

[ctf0]

many thanx for this

[logaretm]

No Problem, I will post an update here once I tag the next release with the new behavior.

[ctf0]

appreciated :100: