Copied to clipboard

Flag this post as spam?

This post will be reported to the moderators as potential spam to be looked at


  • David Scott 16 posts 107 karma points
    Nov 18, 2020 @ 15:06
    David Scott
    0

    Form Cannot Submit on a Mobile Browser

    Good day,

    I created my first form and I am getting an error submitting the form only when I attempt to submit the form via a mobile device (in this case, I've used an iPhone 11 and iPhone 12, using the Google App, Safari, and the Edge App).

    I receive the general error of "Unknown error. Please Try again." twice upon submission, followed by the submit button unable to be touchable.

    I will add that this is a form where I used plain Javascript and upon submission it uses a send data handler to send data to Salesforce. The form works without fail on a browser on a PC (Edge, IE, Firefox, Chrome). Plus, the when in developer mode on a browser and switched to any of the mobile devices, the form also functions.

    I'd also like to add that I am using Umbraco 8.5.5 and Formulate 3.2.1. I've also tested the URL on a mobile device independently of the form and its POST was successful and the data was sent successfully.

    Can you provide any insight as to what could be happening?

    Thank you, David

  • Nicholas Westby 2054 posts 7100 karma points c-trib
    Nov 18, 2020 @ 16:21
    Nicholas Westby
    0

    That's a tough one, but I have an idea.

    The error message you are seeing is from here: https://www.formulate.rocks/plain-javascript/render-form

    That implies Formulate is catching the error and emitting an event for it. That happens here: https://github.com/rhythmagency/formulate/blob/v3/master/src/formulate.frontend/responsive.plain-javascript/steps/render-forms.js#L246-L270

    What you can do is create a custom build of the Formulate JavaScript that shows a message with error details. Since it seems you can't debug it by attaching a debugger, you could instead debug it by showing an alert dialog.

    BTW, if it's a server error, you might see something in the Umbraco error logs. If not, you'll probably have to try the above technique.

  • David Scott 16 posts 107 karma points
    Nov 18, 2020 @ 17:47
    David Scott
    0

    Hi Nicholas,

    Thank you for your prompt reply. I attempted to submit the form in Safari and Firefox on a MacBook Air and I was actually able to replicate the error. Upon searching the Web Inspector, I found the following error:

    Failed to load resource: the server responded with a status of 403 (Forbidden). https://www.nipponlifebenefits.com/umbraco/formulate/submissions/submit

    Can you provide any insight into this error? I find it strange that it's technology on an Apple-based product in where this is caused. I'll keep researching if it's anything I need to adjust on the server.

  • Nicholas Westby 2054 posts 7100 karma points c-trib
    Nov 18, 2020 @ 18:08
    Nicholas Westby
    0

    It does seem strange, as I would expect it to fail on all environments if it were going to fail (for example, that might happen if you have Umbraco hosted in a virtual directory or something a little less common).

    If you open ~/Views/Partials/Formulate/Responsive.Plain JavaScript.cshtml, you'll see that URL listed in there. You could try changing /umbraco/formulate/submissions/submit to something else (e.g., /umbraco/formulate/submissions/definitely-fail) to see if you get the same or a different error. That might provide some extra insight.

    You may also be able to look at the network traffic (either using the browser inspector or Fiddler) to see if it looks different between different browsers (e.g., Chrome on a PC vs Firefox on a MacBook).

    Also, just to confirm, I assume you are submitting the form request to that domain from a webpage also hosted on that domain, correct? I ask because it could be problematic to post between two different domains.

  • David Scott 16 posts 107 karma points
    Nov 18, 2020 @ 20:05
    David Scott
    0

    Hi Nicholas,

    Thank you for the insight Nicholas. I attempted to change that URL as you suggested and the form submission fails on every browser whether it be Apple device or PC.

    I attempted to see the network traffic in Safari and it seems to point to responsive.plain-javascript.min.js - line 917 as the initiator. The network traffic in a functioning browser on a PC (Firefox) and The Network traffic on Firefox installed on a Macbook Air has identical information except for the status - where the PC's browser says 200 (OK) and the MacBook's browser says 403 (Forbidden). Neither makes mention of the javascript file as the initiator.

    Considering it's attempting to post information thru umbraco directory (umbraco/formulate/submissions/submit), do you think there's something that could prevent the user from accessing the formulate resource within Umbraco?

    FYI - The data submitted from our domain is being transmitted to a service hosted on a different domain.

  • Nicholas Westby 2054 posts 7100 karma points c-trib
    Nov 18, 2020 @ 20:19
    Nicholas Westby
    0

    I attempted to change that URL as you suggested and the form submission fails on every browser whether it be Apple device or PC.

    That is as I'd expect, though I was more curious if it fails in exactly the same way (i.e., a 403 error).

    I attempted to see the network traffic in Safari and it seems to point to responsive.plain-javascript.min.js - line 917 as the initiator.

    That's probably just the line that makes the AJAX call. This seems like the server is rejecting the request for some reason. For that, having the request/response info would be of use (e.g., the headers and body).

    where the PC's browser says 200 (OK) and the MacBook's browser says 403 (Forbidden)

    Unfortunately, the status doesn't tell me much. My hope is that the response might have more info (either in the header or in the body) or that the server might log an error.

    Considering it's attempting to post information thru umbraco directory (umbraco/formulate/submissions/submit), do you think there's something that could prevent the user from accessing the formulate resource within Umbraco?

    I don't exactly follow what you mean, but here are the things that are sent with each request that could have some impact depending on environment setup:

    • Form data (e.g., first name, last name, etc.).
    • Contextual information (e.g., the node ID the form was submitted on).
    • Request verification token in the body or header (can't remember which), which is a security mechanism.
    • Request verification token in a cookie (used in combination with the other token to validate requests).

    These are the things you'd want to keep an eye on when looking at the network traffic.

    If you want me to take a look (I have a MacBook I can test with), shoot me a link via this contact form: http://www.nicholaswestby.com/contact

    Also, would be good to know which particular OS version you're on (I know Apple recently released a new OS that has been causing people all sorts of problems, but I'm not on that newest version yet).

  • Nicholas Westby 2054 posts 7100 karma points c-trib
    Nov 18, 2020 @ 20:37
    Nicholas Westby
    0

    Thanks for the link. I haven't been able to do a successful test submission on a Mac or a PC. I tried Chrome on both.

    Here's a screenshot of the failed response on Chrome on a Windows PC:

    Failed Formulate Request

    Can you try on Chrome on a PC and see what happens?

    So far, this feels like it could be some sort of permission issue, but hard to say.

    I also note that when I go to the /umbraco/ URL of the website, I get the same 403 error. Maybe you have IP restrictions for the Umbraco back office so that only certain machines (say, one within your corporate network or home network) will work.

  • David Scott 16 posts 107 karma points
    Nov 18, 2020 @ 21:17
    David Scott
    0

    Hi Nicholas,

    Yes - I found that when disconnected from my corporate network VPN I encounter the same issue on the PC. My apologies for not considering that factor. My supervisor and I will see what we can do but we have another question. Since the URL /umbraco/formulate/submissions/submit doesn't really exist in the Umbraco directory, is it really necessary to use this URL for the request? I found that if I attempt to connect to use this URL from within my corporate network I encounter a 404 error.

    Thank you, David

  • Nicholas Westby 2054 posts 7100 karma points c-trib
    Nov 18, 2020 @ 21:35
    Nicholas Westby
    100

    The way I see it, you have at least these options:

    • Poke a hole in your rule so that particular URL isn't blocked. Unclear if this is straightforward for you or not.
    • Implement a custom controller with a different URL. This could prove to be challenging as the Umbraco context may be difficult to maintain in a non-Umbraco controller.
    • Use a server side URL rewrite (not a redirect, a rewrite) that will change the URL you submit to. Unclear if Umbraco will like this or not.
    • Hack Umbraco's API routing and try to customize it to allow URL's that don't start with /umbraco/. I could see this being challenging.

    I found that if I attempt to connect to use this URL from within my corporate network I encounter a 404 error.

    My guess is you are doing a GET request, and the controller/action only respond to POST requests.

  • David Scott 16 posts 107 karma points
    Nov 19, 2020 @ 15:55
    David Scott
    0

    Hi Nicholas,

    Thank you for the suggestions. I do agree that your 2nd and 4th suggestions will be challenging nad likely time consuming as the form was looking to go live this week. We've attempted adding the URL rewrite but I believe there is some kind of a firewall setting that is not allowing users to get into the /umbraco side of the website that takes precedence over the IIS URL rewrite, as the rewrite works only if connected to the corporate network. Therefore, my supervisor will attempt the 1st suggestion for now since he is more familiar with how to unblock the /umbraco/ subdirectory.

    I don't believe you've answered my previous question - is there another URL that I could possibly use outside of the umbraco directory as that URL parameter? I attempted to use the contact form's link as the parameter in the .cshtml file but that did not work at all. It makes me think that there is something in one of the code files (js or anything else) that I need to adjust that expects the URL parameter to be "umbraco/formulate/submissions/submit". If you could point me in the right direction, perhaps I can experiment and see if I can get around it.

    Thank you, David

  • Nicholas Westby 2054 posts 7100 karma points c-trib
    Nov 19, 2020 @ 18:31
    Nicholas Westby
    0

    I don't believe you've answered my previous question - is there another URL that I could possibly use outside of the umbraco directory as that URL parameter?

    I may not understand your question then. The 4 options I mentioned were an attempt at answering your question.

    If I understand your question correctly, here is how I would phrase it using terms that are the most familiar to me:

    Is there a way for me to submit the form via AJAX to a different URL in order to avoid submitting it to the current URL, which resides under /umbraco/, which is blocked by a firewall?

    If that is your question, I thought I answered it. If it is not, perhaps you can clarify what you mean.

    I attempted to use the contact form's link as the parameter in the .cshtml file but that did not work at all.

    I have no idea what this means. In particular, I don't know what you mean by "the contact form's link". Formulate forms don't really have "links". They can have buttons, but those don't link anywhere (they are for submitting the form).

    It makes me think that there is something in one of the code files (js or anything else) that I need to adjust that expects the URL parameter to be "umbraco/formulate/submissions/submit".

    Hmm, I maybe have an idea of what you are talking about after reading this. The /umbraco/formulate/submissions/submit that is specified in the Razor file I mentioned that you can modify merely tells the frontend code where to submit to. You can change this URL if you like, but then you'll have to be sure that what you change it to will route to a controller/action method.

    The default URL routes to this controller action (i.e., SubmissionsController.Submit): https://github.com/rhythmagency/formulate/blob/v3/master/src/formulate.api/Controllers/SubmissionsController.cs#L52

    The 4 options I gave you above present you with ways of receiving an AJAX submission at a different URL (well, one of them was a hole in the firewall, so in that case the URL wouldn't have to change). You'd have to do one of those if you want to change that URL in the Razor file. Hopefully that makes sense.

  • David Scott 16 posts 107 karma points
    Nov 19, 2020 @ 18:53
    David Scott
    0

    Hi Nicholas,

    Thank you for giving more specification regarding my question. While I didn't misunderstand your suggestions, your clarification here enables me to understand much clearer how the controller works behind the scenes. Your explanations makes perfect sense now. I will keep you posted as to how we progress before this question is marked as answered.

    Thank you! David

  • Nicholas Westby 2054 posts 7100 karma points c-trib
    Nov 25, 2020 @ 23:26
    Nicholas Westby
    0

    Good luck; hopefully one of the solutions works out for you.

  • David Scott 16 posts 107 karma points
    Nov 30, 2020 @ 15:02
    David Scott
    0

    Hi Nicholas,

    Thanks for following up; I was able to get a form working without using Formulate. I realized that our firewall does not allow public access to the Umbraco folders and therefore those 403 permission denied errors kept coming up. There was no way around that which would have satisfied all business and corporate IT requirements so I went ahead and created a new form. Thank you for your help and patience in this matter.

    Have a good day, David

Please Sign in or register to post replies

Write your reply to:

Draft