Zeynel
Zeynel

Reputation: 13515

How to pass a saved Javascript variable in a Chrome extension to a Google App Engine App?

I have a simple bookmarking app that I am developing to learn Google App Engine. At this point I copy and paste the url into http://ting-1.appspot.com/submit which has a form that has a url field. Since this is cumbersome I thought of adding a chrome extension. I just changed the hello world example so that now I get the url of the tab with this code (as explained here):

  <script>
    window.addEventListener("load", windowLoaded, false);
    function windowLoaded() {
      chrome.tabs.getSelected(null, function(tab) {
        document.getElementById('currentLink').innerHTML = tab.url;
        tabUrl = tab.url;
      });
    }
document.write(tabUrl)
  </script>

How do I pass tabUrl to http://ting-1.appspot.com/submit?

Thanks!

Update

background.html that I used as adapted from Mohamed Mansour's answer:

<script>
    //React when a browser action's icon is clicked.
    chrome.browserAction.onClicked.addListener(function(tab) {
        //this gets the url and the title
        chrome.tabs.getSelected(null, function(tab) {
            tabUrl = tab.url
            tabTitle = tab.title

        //this posts the data to the bookmarking app 
        var formData = new FormData();
        formData.append("url", tabUrl);
        formData.append("title", tabTitle);
        formData.append("pitch", "this is a note");
        formData.append("user_tag_list", "tag1, tag2");
        var xhr = new XMLHttpRequest();
        xhr.open("POST", "http://ting-1.appspot.com/submithandlertest");
        xhr.send(formData);
        });
    });
</script>

Upvotes: 2

Views: 611

Answers (1)

Mohamed Mansour
Mohamed Mansour

Reputation: 40169

You use normal XHR (XMLHttpRequest) request. I would place that in your background page. Follow the example here, https://developer.mozilla.org/en-US/docs/Web/API/XMLHttpRequest/Using_XMLHttpRequest. I believe you want to submit data as well, so don't forget that. I think you wanted a POST request too. From the example on MDC, you can relate it this way:

var formData = new FormData();
formData.append("username", "Groucho");
formData.append("accountnum", 123456);
var xhr = new XMLHttpRequest();
xhr.open("POST", "http://ting-1.appspot.com/submit");
xhr.send(formData);

Make sure you have the URL in your manifest for getting permissions to do that request.

"permissions": [
  "tabs",
  " http://ting-1.appspot.com/submit"
],

Upvotes: 4

Related Questions