jqueryajaxcustom-protocol

Why is my custom protocol interfering with ajax calls?

I am writing a web app that contains a link that uses a custom protocol to invoke an executable on the users machine. Something like this:

<a href="myprotocol:abc">click this</a>

The intended action is that after the user clicks the link and the executable starts running, it begins sending progress information to a web service. I would like for the user's browser to query the same service and to display the progress to the user in the web browser.

The plan was to kick off the executable then begin making ajax calls to the service and updating some text on the web page. However, there seems to be some problem related to the custom protocol link preventing the ajax calls from executing. I get the following error:

{"readyState":0,"responseText":"","status":0,"statusText":"error"}

This is normally reserved for cross domain issues but that's not what's going on here.

Here is my code (I changed the protocol to be the "mailto" protocol so it will work on anyones machine):

<html>
    <head>
        <script src="http://code.jquery.com/jquery-1.10.2.min.js"></script>
    </head>
    <body>
        <a id="go" href="mailto:abc@def.com">gopher it</a>
        <div id="percent"></div>
    </body>

    <script>
        $(document).ready(function() {
            $("#go").click(function() {
                pollStatus("abc");
            });
        });

        function pollStatus(id) {
            $.ajax({
             url: "service/" + id + "/status",
                 type: "GET",
                 dataType: "json",

                 success: function(data) {
                     $("#percent").html(data.percent);

                     //keep polling until status is 100%
                     if(data.percent < 100)
                         setTimeout(function() { pollStatus(id) }, 500);
                 },

                 error: function(e) {
                     console.log(JSON.stringify(e));
                 }
            });
        }
    </script>
 </html>

The ajax calls succeed if I change $("#go").click() to return false like this:

 $(document).ready(function() {
     $("#go").click(function() {
         pollStatus("abc");
         return false;
     });
 });

But now the custom protocol doesn't execute so the executable is never run.

Any ideas about how I can get this to work?

Solution

  • This:

    <a id="go" href="{url}">gopher it</a>

    literally means: replace current document by the one of {url}. So stop all script executions, change base URL, etc.

    As a solution you can try this:

    <a id="go" href="{url}" target="_blank">gopher it</a>

    to open the doc in new window.

    But I would do it slightly differently - through invisible iframe and by assigning its src attribute to your "myprotocol:abc" in button click handler. Not that pretty but will work.