Results 1 to 10 of 10

Thread: Get source code from Tab

  1. #1
    Join Date
    Oct 2011
    Posts
    7
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Question Get source code from Tab

    Is there any way how to get tab source code using plugin without the url knowledge? I can not use XmlHttpRequest, because the page do not change the URL (it is dynamicaly generated page without URL change).

    Excuse my bad english. It's better to say something wrong, than say nothing.


  2. #2
    Join Date
    Sep 2011
    Posts
    13
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Default

    Do you mean extension when you say plugin? If so - then content script can get HTML in tab. document.documentElement.outerHTML contains this. Any dynamic changes done in tab are reflected in document.documentElement.outerHTML. More information about content scripts is available here: http://code.google.com/chrome/extens...t_scripts.html

  3. #3
    Join Date
    Oct 2011
    Posts
    7
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Default

    Thanks for your reply.

    If I understood well: Everything I need to do is create content script (for example script.js) and get the source by using
    Code:
    document.documentElement.outerHTML
    ?

    I do not need to specify what window or tab I want to use?

    L.

  4. #4
    Join Date
    Sep 2011
    Posts
    13
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Default

    Yes, you can get source from content script that way. There is no need to specify window or tab because there will be separate instance of content script in every tab.

  5. #5
    Join Date
    Oct 2011
    Posts
    7
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Default

    Its possible to hook from content script to popup window? Or it is necessary to use listeners and sending requests?

    L.

  6. #6
    Join Date
    Sep 2011
    Posts
    13
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Default

    Content script can not be accessed directly from other parts of extension. So, you'll need listeners and requests for this.

  7. #7
    Join Date
    Oct 2011
    Posts
    7
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Default

    So I have popup page index.html:
    Code:
    <html>
        <head>
            <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
            <script type="text/javascript">
                function zadost() {
                    chrome.tabs.getSelected(null, function(tab) {
                        chrome.tabs.sendRequest(tab.id, {action: "getHtml"}, function(response) {
                            console.log(response.html);
                            if (response.html) {
                                document.getElementById('output').innerHTML =  response.html;
                            } else {
                                document.getElementById('output').innerHTML = 'I did not get the source code.';
                            }
                        });
                    });
                }
            </script>
        </head>
        <body onLoad="zadost()">
            <h1>KatastrBuster</h1>
            <div id="output"></div>
        </body>
    </html>
    Content script script.js:
    Code:
    chrome.extension.onRequest.addListener(function(request, sender, sendResponse) {
        if (request.action == "getHTML") {
            console.log("Got getHTML request.").
            var htmlCode = document.documentElement.outerHTML;
            sendResponse({html: htmlCode});
        } else {
            sendResponse({});
        }
    });
    and manifest.json:
    Code:
    {
      "name": "KatastrBuster",
      "version": "0.1",
      "description": "Some kiddings about the extension.",
      "browser_action": {
        "default_icon": "ikonka.png",
        "default_title": "KatastrBuster",
        "default_popup": "index.html"
      },
      "content_scripts": [
        {
            "matches": ["http://*/*"],
            "js": ["script.js"]
        }
      ],
      "permissions": [ "tabs", "http://*/*" ]
    }
    That should send a request from Popup to content script for HTML code. After, content script should get the source code and resend it to the popup to show the code, but nothing hapend.

    Console is empty all the time and no code is visible. Could you tell me, where is the problem?

  8. #8
    Join Date
    Sep 2011
    Posts
    13
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Default

    You should look not only at console log of extension popup, but also at console log of page where your content script is injected. If you will do this - you will see that your content script has syntax error on line 4. This is because on line 3 you has "." instead of ";".

    Next error is that from popup script you send "getHtml", but in content script you expect "getHTML".

  9. #9
    Join Date
    Oct 2011
    Posts
    7
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Default

    Really thanks for your help. I was nearly to lose my hope in this.

  10. #10
    Join Date
    Oct 2011
    Posts
    7
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Default

    The final code
    Popup index.html
    Code:
    <html>
        <head>
            <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
            <script type="text/javascript">
                function zadost() {
                    chrome.tabs.getSelected(null, function(tab) {
                        chrome.tabs.sendRequest(tab.id, {action: "getHtml"}, function(response) {
                            console.log(response.html);
                            if (response.html) {
                                document.getElementById('output').innerHTML =  response.html;
                            } else {
                                document.getElementById('output').innerHTML = 'I did not get the source code.';
                            }
                        });
                    });
                }
            </script>
        </head>
        <body onLoad="zadost()">
            <h1>KatastrBuster</h1>
            <div id="output"></div>
        </body>
    </html>
    Content script script.js:
    Code:
    chrome.extension.onRequest.addListener(function(request, sender, sendResponse) {
        if (request.action == "getHtml") {
            console.log("Got getHTML request.");
            var htmlCode = document.documentElement.outerHTML;
            sendResponse({html: htmlCode});
        } else {
            sendResponse({});
        }
    });
    and manifest.json:
    Code:
    {
      "name": "KatastrBuster",
      "version": "0.1",
      "description": "Some kiddings about the extension.",
      "browser_action": {
        "default_icon": "ikonka.png",
        "default_title": "KatastrBuster",
        "default_popup": "index.html"
      },
      "content_scripts": [
        {
            "matches": ["http://*/*"],
            "js": ["script.js"]
        }
      ],
      "permissions": [ "tabs", "http://*/*" ]
    }

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •  

Search Engine Optimization by vBSEO 3.6.0