I don't usually comment in tutorial videos, but I am more than happy that I have found your channel. It is the first channel that I see tutorials about concrete and real life features that we see in all of our everyday apps. As a junior dev, seeing a thousand versions of to-do apps is not gonna help me get to the next step. You don't know how much that is valuable to probably more viewers than you think. Thank you so much!
Good question. I'm not an expert in security but some good basics are ensuring CORS is set up properly to prevent unauthorized cross origin requests which nextjs and Vercel ship by default without so you're good there unless changed. Also ensuring the request odds authenticated from within the function such as using an auth header and validating it
First of all, thanks for this great video that helped me on building my portfolio, Colby. You're a true treasure for some of us. Secondly, I address this to anyone else here: I get a strange behavior on production (I host my portfolio on Vercel) where the form works great on Brave Browser mobile and desktop, Chrome, Safari, Samsung Browser all on mobile, but I get no data when testing it on Chrome and Edge on desktop (the response object I get back as a response is empty on the data object). This happens in production only. In development the desktop browsers all work fine. Thank you again Colby for doing all these great stuff !
thanks for the kind words Johnny! do you see any errors in the Network tab in the browser or web console? additionally, have you checked the vercel function logs when sending test submissions? if there are no logs you may want to consider adding a try/catch and additional logs to try to get more context
@@colbyfayock Just came back home now and tried to test it again. I was looking at the vercel function logs and they were ok and the network tab also was fine. Then the email popped up.. So it solved by itself. Also something that I didn't mention is that I grab my data from the form with the react-hook-form and not by your method. Can't figure out what the problem was but I'm glad it worked (I assume I still win lol). Ty again and keep up the good work !
This tutorial is so amazing. The best I found on UA-cam about sending emails with nextjs and SendGrid. Congratulations! Just one problem with my form: all fields of type select on my form are not captured and I can't store them in the formdata object. How can I fix this?
hey thanks so much! i just tried it out with a select element and it worked for me. what does your input html look like? using this: One Two Three it "just worked" and appeared in form data
Guys, if the email is not being sen while deployed to vercel: Make sure you convert the serverless function to an async function and make sure you added the correct dns records for the email provider you're using.
Hice eso y todavía no puedo entender lo que está sucediendo, localmente funciona bien y cuando se implementa no envía los correos electrónicos, sin embargo, la api continúa funcionando correctamente ya que no envía ningún error, por lo que no tengo idea de lo que podría estar sucediendo, ¿alguna ayuda? Por favor.
So the cname records has to be added on an email host? So if i own a domain for my website i should also own a different domain for email? Thats the thing i have not yet understand!
Hi amazing tutorial. Best tutorial for this subject out there. I have a question of i may ask. The custom domain you configure is the domain you hosting your website or the email domain? Ty in advance.
if im understanding correctly, the same domain. you use DNS records to achieve this, one for email one for the web. i dont know this well enough to explain though, but i believe SendGrid has tutorials and docs
Hope this message finds you well. I have a question about form validation and displaying a message once the form has been submitted so the user doesn't resubmit. How is that accomplished using this method in the video.
Thanks so much for this Colby! I was wondering how you go a step further than this. For example, if you have a list of users who have an item in their cart but still haven't bought anything. You want to send them an automated email maybe once a week to remind them that "Hey, you left something in your cart!". Would I need a queuing service for this?
hey Charlotte, sorry to hear you're having issues, i just tried redeploying to vercel with no issues. did you remember to set an environment variable with your API key? you can do that by going to Settings > Environment Variables (d.fay.io/Cj8hHR) and setting your SENDGRID_API_KEY if you followed along with the same name if you're able to see any errors id be curious what they are. here's what im seeing on mine d.fay.io/hiPkH1
@@colbyfayock Thanks for replying! I'm getting status code: 200 so all seems fine but the emails don't actually come through. I've checked all over my inbox and they're definitely not there. When I send from local the emails come through almost instantly.
I moved the mail.send function into a try... catch, this is now giving me the error '401 The requestor's IP Address is not whitelisted'. I should be able to fix it now that I know what's causing it. **EDIT I fixed this by disabling the IP allow list so now all IP Addresses can make contact. I have to do it this way because Vercel use dynamic IP Addresses.
@@charlottehughes616 glad you've figured out the issue. i tend to only show the happy path in my tutorials but it might be worth at least doing things like try... catch as i would imagine others run into situations like yours. thanks for sharing
haha i think ive just spent too much time on the computer growing up :) so i got fast at typing and remembering things just comes from experience working with these things for a while. glad you enjoyed!
Hi, first of all thank you very much for this video. I think this is the most helpful video on the subject. My question is, this code works fine for my gmail account but for my info@domain accounts I get error. What is the reason of this ?
Everything seems to be working fine even in NextJS 13. But everytime I change something in the route.ts (route.js => the API file). I get an error 405. Has anyone encountered the same problem?
if you have access to a PHP server you can certainly do that. if you're using jsx (specifically React) your PHP server would need an endpoint that you can POST to in order to accept that request and process it. i'm not a PHP dev though so i don't have any resources for that
Thank you for this! Really helped me with my project! May I ask, Do you also have an example wherein the form gives a confirmation message after you have submitted?
hey i dont have an example available unfortunately, but you can use the useState hook and set a "sent" state after the request finishes, which you can then use to control what's displayed on the page
Thanks for the vid ! Helpful and easy to understand ! I want to do the same thing but with Vercel. Does anyone knows how to make it work with Vercel for the deployment ?
This video has been so helpful to me, really clear and easy to follow. I really appreciate you answering my question too, thank you. Looking forward to watching more of your videos
Unfortunately I am not able to make this work when it is on production at vercel. The env variable is correct at vercel but it doesn’t works I don’t know how to check what is happening or if it is just a delay problem :(
hey i would recommend to start off by looking at the function logs inside of Vercel. If you're not seeing anything, try to add additional logs and wrap the request with a try/catch, along with a log of the error. anything that can help give additional context of the issue.
Hi i started a domain on google with CNAME DNS records, i got past a few errors but now I'm getting a green message in console. However i don't see the emails in my email account its associated with on google. Should i wait 24 hours fro the emails to propagate? there is no email in sendgrid either.
@@colbyfayock Any chance you could do a part 2 on this one showing how to add an attachment to the email? I can't seem to figure out how to get the file from the client to the server...
@@camerontaylor209 hey! i'll add it to my list but not sure id get to that one. in the meantime here's how im doing it: github.com/colbyfayock/space-jelly-cron/blob/main/src/lib/mail.js#L25
Hey it should! Try adding some error logging and even a try/catch around the request to see what's happening. You can then see those in the vercel logs or wherever you're testing
Thank you for the great video! I do have this working so far in localhost but it goes to my spam in gmail. I have not yet authenticated my domain (don't have one yet...), could this be why it is going to spam?
Great video Colby.. just one question, when i run it in localhost, it works perfect, but when i deployed it to Vercel, it doesn't work... it shows in the console: Failed to load resource: the server responded with a status of 504 () any idea? thank you
hard to tell without having access, i would recommend trying to add some console logs so that you can debug within the Function logs to see what's up, including a try/catch around the request
the UI is a bit different since posting this. in domains.google.com, select your domain and click DNS in the left sidebar. there you should see Custom Records where you can Manage Custom Records
@@colbyfayock Thank you for responding, my domain show me No domais yet, can I create a domain for free or should I pay for it? I followed your instructions in tutorial and you created domain in sendgrid, correct? How can I bring domain from sendgrid to google domail ? thank you
great contents thanks for sharing the knowledge. message is blocked because i don't know how to authenticate my domain. don't know dns provider email address is yahoo domain. how to set this up ?
Works great locally, but I never get any emails when its deployed to vercel. Not sure how to fix. The only thing showing in the network is the status: "Ok". How do I fix this?
@@colbyfayock I had the logs running and tried submitting my form again and all that shows in the logs is [POST] /api/mail. In the details of that it says status: 200, duration: 146.36ms, Init Duration: 510.69ms, Memory Used: 89mb
@@JMiller686able i would recommend trying to add additional logs and wrapping the any requests with a try/catch to try to find out where and why it's failing
@@colbyfayock I tried that and still don't get any errors. I think it must be something about the IP range in sendgrid, but I can't change without an upgraded account.
@@JMiller686able I'm getting the same issue, with 'net::ERR_ABORTED 500' in the console, and the following shown in the Vercel realtime logs... 2021-06-25T20:45:28.226Z a0a600d7-ea44-4c51-9f57-4ccac41dd391 ERROR Unhandled Promise Rejection {"errorType":"Runtime.UnhandledPromiseRejection","errorMessage":"Error: Client network socket disconnected before secure TLS connection was established","reason":{"message":"Client network socket disconnected before secure TLS connection was established","name":"Error","stack":"Error: Client network socket disconnected before secure TLS connection was established at connResetException (internal/errors.js:607:14) at TLSSocket.onConnectEnd (_tls_wrap.js:1554:19) at TLSSocket.emit (events.js:388:22) at endReadableNT (internal/streams/readable.js:1336:12) at processTicksAndRejections (internal/process/task_queues.js:82:21)","config":{"url":"/v3/mail/send","method":"post","data":"{\"from\":{\"email\":\"info@wearespotlight.co.uk\"},\"subject\":\"New web form message!\",\"personalizations\":[{\"to\":[{\"email\":\"info@wearespotlight.co.uk\"}]}],\"content\":[{\"value\":\"\ Name: Dan\ \ \ Email: myemail@gmail.com\ \ \ Message: TEST \ 21.42\ \ Second test\ \",\"type\":\"text/plain\"},{\"value\":\"\ Name: Dan\ Email: myemail@gmail.com\ Message: TEST \ 21.42\ \ Second test\ \",\"type\":\"text/html\"}]}","headers":{"Accept":"application/json","Content-Type":"application/json","User-Agent":"sendgrid/7.4.3;nodejs","Authorization":"Bearer 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","Content-Length":439},"baseURL":"api.sendgrid.com/","transformRequest":[null],"transformResponse":[null],"timeout":0,"xsrfCookieName":"XSRF-TOKEN","xsrfHeaderName":"X-XSRF-TOKEN","maxContentLength":null,"maxBodyLength":null},"code":"ECONNRESET"},"promise":{},"stack":["Runtime.UnhandledPromiseRejection: Error: Client network socket disconnected before secure TLS connection was established"," at process. (/var/runtime/index.js:35:15)"," at process.emit (events.js:388:22)"," at processPromiseRejections (internal/process/promises.js:245:33)"," at processTicksAndRejections (internal/process/task_queues.js:96:32)"]} [ERROR] [1624653928227] LAMBDA_RUNTIME Failed to post handler success response. Http response code: 400. RequestId: 77f02ec5-f091-4cb6-819a-927e7c0466fc Error: Runtime exited with error: exit status 128 Runtime.ExitError
Why does every step of your video is like a mine field ? Sendgrid is painful, they'll lock your account, and tell you that you aren't authorized and contact the support. While you've done nothing wrong.
really awesome content, thank you about that. i just find 1 problem, the replace by a is not working, i test message.replace(/ /g, '') and works, but not how i wanted
hey! I've seen others have issues where they didn't have their environment variables set, coudl it be that? id also recommend adding a try/catch around the sendgrid logic with a console.log with the resulting error, then you can see what the main problem is inside of Vercel's logs! here's also my code for reference: github.com/colbyfayock/my-email-app
Learn how to build a full stack Next.js app in my upcoming course: colbyfayock.com/course
I don't usually comment in tutorial videos, but I am more than happy that I have found your channel. It is the first channel that I see tutorials about concrete and real life features that we see in all of our everyday apps. As a junior dev, seeing a thousand versions of to-do apps is not gonna help me get to the next step. You don't know how much that is valuable to probably more viewers than you think. Thank you so much!
thank you :) really appreciate those kind words. so glad you're finding it all helpful!
I really appreciate that you take the time to also show things like the CNAME DNS records.
Great video, thanks a lot!
Glad it helped! 🙌
Good stuff Colby!
thanks James! 💪
Hey Colby. Thank you for the impact and compact sandgrid tut. You are the best please keep up.
thanks, you got it!
EXACTLY what my current project needs!!! thanks man!
No problem 💪
Thanks for this, Colby! Super helpful stuff.
no problem! 🙌
Colby you were born to teach brother
thank you 🙏
What kind of spam prevention and security measures do you recommend? Security for open endpoints like this are a mystery to me! Thanks for the vid!
Good question. I'm not an expert in security but some good basics are ensuring CORS is set up properly to prevent unauthorized cross origin requests which nextjs and Vercel ship by default without so you're good there unless changed. Also ensuring the request odds authenticated from within the function such as using an auth header and validating it
First of all, thanks for this great video that helped me on building my portfolio, Colby. You're a true treasure for some of us.
Secondly, I address this to anyone else here: I get a strange behavior on production (I host my portfolio on Vercel) where the form works great on Brave Browser mobile and desktop, Chrome, Safari, Samsung Browser all on mobile, but I get no data when testing it on Chrome and Edge on desktop (the response object I get back as a response is empty on the data object).
This happens in production only. In development the desktop browsers all work fine.
Thank you again Colby for doing all these great stuff !
thanks for the kind words Johnny! do you see any errors in the Network tab in the browser or web console? additionally, have you checked the vercel function logs when sending test submissions? if there are no logs you may want to consider adding a try/catch and additional logs to try to get more context
@@colbyfayock Just came back home now and tried to test it again. I was looking at the vercel function logs and they were ok and the network tab also was fine.
Then the email popped up..
So it solved by itself.
Also something that I didn't mention is that I grab my data from the form with the react-hook-form and not by your method.
Can't figure out what the problem was but I'm glad it worked (I assume I still win lol).
Ty again and keep up the good work !
@@fangg194 ah interesting, well glad it worked out! :)
you are my new idol for next js and storybook! HAHA glad to know you my man, hello from indonesia!
thanks Rendy :)
Another awesome video Colby!
thank you!!
Amazing.... Idea for a video: please make tutorial on sending SMS using Twilio API... Thank you
Thanks! I'll add that to my list
Great video! Helped me a lot! Thanks Colby!
No problem 🙌
As always fantastic mate. 👏
thank you!!
This tutorial is so amazing. The best I found on UA-cam about sending emails with nextjs and SendGrid. Congratulations!
Just one problem with my form: all fields of type select on my form are not captured and I can't store them in the formdata object.
How can I fix this?
hey thanks so much!
i just tried it out with a select element and it worked for me. what does your input html look like?
using this:
One
Two
Three
it "just worked" and appeared in form data
Great tutorial. Everything worked perfectly. Thanks.
thanks Andrew, glad to hear that!
THANKS, i has been over 4 hours trying to solve and get this right with multiple errors and configuration.
np! glad you got it solved
Your videos are really cozy and informative. Really like em, you have good talking skills
thank you!
Thank you for this tutorial, Colby.
Really helped.
No problem!
Guys, if the email is not being sen while deployed to vercel: Make sure you convert the serverless function to an async function and make sure you added the correct dns records for the email provider you're using.
and make sure .env variables are set in Vercel :)
Hice eso y todavía no puedo entender lo que está sucediendo, localmente funciona bien y cuando se implementa no envía los correos electrónicos, sin embargo, la api continúa funcionando correctamente ya que no envía ningún error, por lo que no tengo idea de lo que podría estar sucediendo, ¿alguna ayuda? Por favor.
So the cname records has to be added on an email host? So if i own a domain for my website i should also own a different domain for email? Thats the thing i have not yet understand!
@@diegobejardelaguila8614 what was your experience? you could repair this error?
this video really helped me, THANX
no problem!
Thank you!! Great video
Thanks 😁
Thanks a lot for this man do you have any vids on how to go about validating these inputs before the message is sent?
unfortunately dont have any validation videos
@@colbyfayock thanks for the reply man, would love it if you could do one, you're style is so easy to understand
Thank you so much for making this video!
No probelm!
thanks a lot! worked perfectly!!
awesome! no problem
Is there an updated version for NextJS 13 with the app directory?
Thanks a bunch. Got it working cause of this video!
awesome glad ot hear
Hi amazing tutorial. Best tutorial for this subject out there. I have a question of i may ask. The custom domain you configure is the domain you hosting your website or the email domain? Ty in advance.
if im understanding correctly, the same domain. you use DNS records to achieve this, one for email one for the web. i dont know this well enough to explain though, but i believe SendGrid has tutorials and docs
Hope this message finds you well. I have a question about form validation and displaying a message once the form has been submitted so the user doesn't resubmit. How is that accomplished using this method in the video.
hey Seth, all the code is here: github.com/colbyfayock/my-email-app/blob/main/pages/index.js
great content as always
thank you!!
Hello, How can integrate this function on vercel, because when I trying deploy the app not working , thank you!
double posted, answerd the other one :)
Damn just so little likes for this quality content. Hope you will grow soon and thanks for this video really helpful.
thanks marcus!
thanks bro! this video really helped me!
no problem, glad to hear that!
Thanks so much for this Colby! I was wondering how you go a step further than this. For example, if you have a list of users who have an item in their cart but still haven't bought anything. You want to send them an automated email maybe once a week to remind them that "Hey, you left something in your cart!". Would I need a queuing service for this?
yeah pretty much, you'd need somewhere to store that information so that when the action runs, it can work through that list
Does your website have to be completely finished and up and ready before you set-up you sendgrid account?
nope not at all! though you need to have a domain available in order to configure DNS settings, but thats not related to the website itself
Thanks for the guide Colby, I've followed step by step but I'm getting this error "SyntaxError: Unexpected end of JSON input"
export default async (req, res) => {
> 6 | const body = JSON.parse(req.body);
| ^
7 |
8 | const message = `
9 | Name: ${body.name}
error - ResponseError: Forbidden
Do you know what am I doing wrong?
hey want to check out my source code and see if anything pops up there? github.com/colbyfayock/my-email-app
amazing free stuff!
Yeahhhh
Great content bro!
thank you!!
Great video thank you.
It works for me locally but not when I deploy to vercel, have you experienced this?
hey Charlotte, sorry to hear you're having issues, i just tried redeploying to vercel with no issues. did you remember to set an environment variable with your API key?
you can do that by going to Settings > Environment Variables (d.fay.io/Cj8hHR) and setting your SENDGRID_API_KEY if you followed along with the same name
if you're able to see any errors id be curious what they are. here's what im seeing on mine d.fay.io/hiPkH1
@@colbyfayock Thanks for replying! I'm getting status code: 200 so all seems fine but the emails don't actually come through. I've checked all over my inbox and they're definitely not there. When I send from local the emails come through almost instantly.
I moved the mail.send function into a try... catch, this is now giving me the error '401 The requestor's IP Address is not whitelisted'.
I should be able to fix it now that I know what's causing it.
**EDIT
I fixed this by disabling the IP allow list so now all IP Addresses can make contact. I have to do it this way because Vercel use dynamic IP Addresses.
@@charlottehughes616 glad you've figured out the issue. i tend to only show the happy path in my tutorials but it might be worth at least doing things like try... catch as i would imagine others run into situations like yours. thanks for sharing
@@charlottehughes616 Hi, how do you make this, it doesnt allow me to send email from vercel but locally runs flawless
Brother, can I know two things. One how you can type so fast ? Second how remembered CSS+ .js properties and code. Thanks for amazing content.
haha i think ive just spent too much time on the computer growing up :) so i got fast at typing and remembering things just comes from experience working with these things for a while. glad you enjoyed!
Thnx.
Hi, first of all thank you very much for this video. I think this is the most helpful video on the subject. My question is, this code works fine for my gmail account but for my info@domain accounts I get error. What is the reason of this ?
im not too sure, maybe try adding a try/catch around the lines of code trying to send the email to see if it gives you a hint with console logs?
Everything seems to be working fine even in NextJS 13. But everytime I change something in the route.ts (route.js => the API file). I get an error 405. Has anyone encountered the same problem?
i haven't used Next 13 app directory yet tbh, but can you elaborate? what kind of change? is it a hot reloading issue or even on refresh?
Brilliant video. Is it possible to send an email the "old school way", without Nodemailer, SendGrid etc, just jsx and PHP? Thanks
if you have access to a PHP server you can certainly do that. if you're using jsx (specifically React) your PHP server would need an endpoint that you can POST to in order to accept that request and process it. i'm not a PHP dev though so i don't have any resources for that
Thank you for this! Really helped me with my project! May I ask, Do you also have an example wherein the form gives a confirmation message after you have submitted?
hey i dont have an example available unfortunately, but you can use the useState hook and set a "sent" state after the request finishes, which you can then use to control what's displayed on the page
@@colbyfayock thanks! Will try that out! 👍🏼
I use ovh domain and still not verify. Still failed why? I added 3 cname record on ovh domain panel
im not familiar with ovh, i would try to use a DNS lookup tool to make sure you can verify you see them yourelf
Thanks for the vid ! Helpful and easy to understand ! I want to do the same thing but with Vercel. Does anyone knows how to make it work with Vercel for the deployment ?
hey no problem. i would think it should "just work" when deployed to Vercel as long as you set the environment variables appropriately
This video has been so helpful to me, really clear and easy to follow. I really appreciate you answering my question too, thank you. Looking forward to watching more of your videos
thanks Charlotte :)
Thanks for this
no problem!
Thank you very much!
no problem :)
Unfortunately I am not able to make this work when it is on production at vercel. The env variable is correct at vercel but it doesn’t works I don’t know how to check what is happening or if it is just a delay problem :(
hey i would recommend to start off by looking at the function logs inside of Vercel. If you're not seeing anything, try to add additional logs and wrap the request with a try/catch, along with a log of the error. anything that can help give additional context of the issue.
Hi i started a domain on google with CNAME DNS records, i got past a few errors but now I'm getting a green message in console. However i don't see the emails in my email account its associated with on google. Should i wait 24 hours fro the emails to propagate? there is no email in sendgrid either.
Do i need a google workspace ?
@@nicholasbazzoni7084 hey honestly im not too sure about this one, i would recommend reaching out to SendGrid
Great tutorial!
Thank you!
@@colbyfayock Any chance you could do a part 2 on this one showing how to add an attachment to the email? I can't seem to figure out how to get the file from the client to the server...
@@camerontaylor209 hey! i'll add it to my list but not sure id get to that one. in the meantime here's how im doing it: github.com/colbyfayock/space-jelly-cron/blob/main/src/lib/mail.js#L25
thank you sir
No problem
This works with next js 13 ? I followed all the steps like you but I do not receive any email. :(
Hey it should! Try adding some error logging and even a try/catch around the request to see what's happening. You can then see those in the vercel logs or wherever you're testing
Thanks a lot
no problem!
thanks ❤❤
no problem! 🙌
Thank you for the great video! I do have this working so far in localhost but it goes to my spam in gmail. I have not yet authenticated my domain (don't have one yet...), could this be why it is going to spam?
good question, it definitely could be, especially if you're trying to send it as if it's coming from that domain that isn't authenticated
Great video Colby.. just one question, when i run it in localhost, it works perfect, but when i deployed it to Vercel, it doesn't work... it shows in the console: Failed to load resource: the server responded with a status of 504 ()
any idea?
thank you
hard to tell without having access, i would recommend trying to add some console logs so that you can debug within the Function logs to see what's up, including a try/catch around the request
@@colbyfayock sorry Colby, i forgot to upload the env variables to Vercel... it was my mistake.. Now it's running perfect!
Thank you Colby!!
@@leandromoro5848 awesome to hear!
10:41 where can I found this page with DNS? I cannot find it.. thanks
the UI is a bit different since posting this. in domains.google.com, select your domain and click DNS in the left sidebar. there you should see Custom Records where you can Manage Custom Records
@@colbyfayock Thank you for responding, my domain show me No domais yet, can I create a domain for free or should I pay for it? I followed your instructions in tutorial and you created domain in sendgrid, correct? How can I bring domain from sendgrid to google domail ? thank you
great contents thanks for sharing the knowledge. message is blocked because i don't know how to authenticate my domain. don't know dns provider email address is yahoo domain. how to set this up ?
hey the goal here is to use a custom domain to send emails, i dont know that you can use a yahoo email address with sendgrid
Thanks
Np!
Hi Colby! How can I redirect to thank you page after submit??
you should be able to use the Next.js Router for this with useRouter, and the `push` method: nextjs.org/docs/api-reference/next/router#routerpush
@@colbyfayock Tank you for your answer! I deploy on Vercel, but can't receive the data, is woring only on localhost...
@@startrunningmontpellier2148 do you mean you can't receive the data about the email being sent? what does the error say?
Works great locally, but I never get any emails when its deployed to vercel. Not sure how to fix. The only thing showing in the network is the status: "Ok". How do I fix this?
hey josh did you try checking the Vercel function logs? vercel.com/docs/logs
@@colbyfayock I had the logs running and tried submitting my form again and all that shows in the logs is [POST] /api/mail. In the details of that it says status: 200, duration: 146.36ms, Init Duration: 510.69ms, Memory Used: 89mb
@@JMiller686able i would recommend trying to add additional logs and wrapping the any requests with a try/catch to try to find out where and why it's failing
@@colbyfayock I tried that and still don't get any errors. I think it must be something about the IP range in sendgrid, but I can't change without an upgraded account.
@@JMiller686able I'm getting the same issue, with 'net::ERR_ABORTED 500' in the console, and the following shown in the Vercel realtime logs...
2021-06-25T20:45:28.226Z a0a600d7-ea44-4c51-9f57-4ccac41dd391 ERROR Unhandled Promise Rejection {"errorType":"Runtime.UnhandledPromiseRejection","errorMessage":"Error: Client network socket disconnected before secure TLS connection was established","reason":{"message":"Client network socket disconnected before secure TLS connection was established","name":"Error","stack":"Error: Client network socket disconnected before secure TLS connection was established
at connResetException (internal/errors.js:607:14)
at TLSSocket.onConnectEnd (_tls_wrap.js:1554:19)
at TLSSocket.emit (events.js:388:22)
at endReadableNT (internal/streams/readable.js:1336:12)
at processTicksAndRejections (internal/process/task_queues.js:82:21)","config":{"url":"/v3/mail/send","method":"post","data":"{\"from\":{\"email\":\"info@wearespotlight.co.uk\"},\"subject\":\"New web form message!\",\"personalizations\":[{\"to\":[{\"email\":\"info@wearespotlight.co.uk\"}]}],\"content\":[{\"value\":\"\
Name: Dan\
\
\
Email: myemail@gmail.com\
\
\
Message: TEST \
21.42\
\
Second test\
\",\"type\":\"text/plain\"},{\"value\":\"\
Name: Dan\
Email: myemail@gmail.com\
Message: TEST \
21.42\
\
Second test\
\",\"type\":\"text/html\"}]}","headers":{"Accept":"application/json","Content-Type":"application/json","User-Agent":"sendgrid/7.4.3;nodejs","Authorization":"Bearer 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","Content-Length":439},"baseURL":"api.sendgrid.com/","transformRequest":[null],"transformResponse":[null],"timeout":0,"xsrfCookieName":"XSRF-TOKEN","xsrfHeaderName":"X-XSRF-TOKEN","maxContentLength":null,"maxBodyLength":null},"code":"ECONNRESET"},"promise":{},"stack":["Runtime.UnhandledPromiseRejection: Error: Client network socket disconnected before secure TLS connection was established"," at process. (/var/runtime/index.js:35:15)"," at process.emit (events.js:388:22)"," at processPromiseRejections (internal/process/promises.js:245:33)"," at processTicksAndRejections (internal/process/task_queues.js:96:32)"]}
[ERROR] [1624653928227] LAMBDA_RUNTIME Failed to post handler success response. Http response code: 400.
RequestId: 77f02ec5-f091-4cb6-819a-927e7c0466fc Error: Runtime exited with error: exit status 128
Runtime.ExitError
Hi, do you have a tutorial about google maps and next js ..? I have been searching for one.
Greetings...!!!
hey, no I don't currently have a tutorial like that, but i'll add it to my list!
@@colbyfayock If you do it, please let me know.
Perfect!
thanks :D
awesome !!
thanks 🙌
You’re awesome
thank you!! 🙌
999 views, nice
thanks for helping to make it 1k :)
can you do an aws ses one
I'll add it to my list but not making any promises. Have worked much directly in aws lately in light of other easier services
+1
🙌
Why does every step of your video is like a mine field ?
Sendgrid is painful, they'll lock your account, and tell you that you aren't authorized and contact the support.
While you've done nothing wrong.
Sorry to hear you've had a bad experience, haven't heard of others hitting that. Did you contact support?
@@colbyfayock I've finally used emailjs...
I don't think it was your code, rather the sendgrid bad experience.
anyway, it's working well now.
Get fresh tutorials and other free content straight to your inbox! colbyfayock.com/news
really awesome content, thank you about that. i just find 1 problem, the replace
by a is not working, i test message.replace(/
/g, '') and works, but not how i wanted
hm strange, did you compare my code? github.com/colbyfayock/my-email-app/blob/main/pages/api/mail.js
Hello, How can integrate this function on vercel, because when I trying deploy the app not working , thank you!
hey! I've seen others have issues where they didn't have their environment variables set, coudl it be that?
id also recommend adding a try/catch around the sendgrid logic with a console.log with the resulting error, then you can see what the main problem is inside of Vercel's logs!
here's also my code for reference: github.com/colbyfayock/my-email-app