{"id":16466936,"url":"https://github.com/itbdw/server-render-javascript-chrome","last_synced_at":"2025-02-27T19:44:16.982Z","repository":{"id":146115825,"uuid":"99438442","full_name":"itbdw/server-render-javascript-chrome","owner":"itbdw","description":"Prerender your javascript web page for better seo with Google Chrome. 💣⚠️ [eat too much memory] ","archived":false,"fork":false,"pushed_at":"2020-10-14T16:16:09.000Z","size":27,"stargazers_count":1,"open_issues_count":0,"forks_count":0,"subscribers_count":3,"default_branch":"master","last_synced_at":"2025-01-10T17:25:26.988Z","etag":null,"topics":["chrome","prerender","server-side-rendering"],"latest_commit_sha":null,"homepage":"","language":"JavaScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":null,"status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/itbdw.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":null,"code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null,"governance":null,"roadmap":null,"authors":null,"dei":null,"publiccode":null,"codemeta":null}},"created_at":"2017-08-05T17:42:21.000Z","updated_at":"2020-10-14T16:16:11.000Z","dependencies_parsed_at":"2023-05-06T16:17:53.463Z","dependency_job_id":null,"html_url":"https://github.com/itbdw/server-render-javascript-chrome","commit_stats":null,"previous_names":[],"tags_count":0,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/itbdw%2Fserver-render-javascript-chrome","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/itbdw%2Fserver-render-javascript-chrome/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/itbdw%2Fserver-render-javascript-chrome/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/itbdw%2Fserver-render-javascript-chrome/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/itbdw","download_url":"https://codeload.github.com/itbdw/server-render-javascript-chrome/tar.gz/refs/heads/master","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":241052098,"owners_count":19900956,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":["chrome","prerender","server-side-rendering"],"created_at":"2024-10-11T11:45:17.959Z","updated_at":"2025-02-27T19:44:16.947Z","avatar_url":"https://github.com/itbdw.png","language":"JavaScript","readme":"\n:warning::warning::warning::warning::warning::warning::warning::warning::warning::warning:\n:warning::warning::warning::warning::warning::warning::warning::warning::warning::warning:\n:warning::warning::warning::warning::warning::warning::warning::warning::warning::warning:\n:warning::warning::warning::warning::warning::warning::warning::warning::warning::warning:\n\nDo not try this!\n\n不要尝试！\n\n:warning::warning::warning::warning::warning::warning::warning::warning::warning::warning:\n:warning::warning::warning::warning::warning::warning::warning::warning::warning::warning:\n:warning::warning::warning::warning::warning::warning::warning::warning::warning::warning:\n:warning::warning::warning::warning::warning::warning::warning::warning::warning::warning:\n\n\n# server-render-javascript-chrome\nPrerender your javascript web page for better seo with Google Chrome.\n\n## Dependency\n\n Must \n\n`Chrome`\n\n`NodeJS`\n\nSuggested\n\n`pm2`, start the server and much more.\n\n## Install\n\n\u003e Suppose you are using a Ubuntu Server and nginx as web server.\n\n1. NodeJS\n\n```\ncurl -sL https://deb.nodesource.com/setup_6.x | sudo -E bash -\n\nsudo apt-get install -y nodejs\n\n```\n\n2. Chrome (need the latest stable version for better performance)\n\n```\nwget https://dl.google.com/linux/direct/google-chrome-stable_current_amd64.deb\ndpkg -i google-chrome-stable_current_amd64.deb\napt-get install -f\n\napt install libosmesa6\nln -s /usr/lib/x86_64-linux-gnu/libOSMesa.so.6 /opt/google/chrome/libosmesa.so\n```\n\n3. Install and Run\n\nDownload this code to your server, say `/var/server/spider`, the directory\nstructure looks like below\n\n```\n/var/server/spider/\n                    craw.js\n                    package.json\n                    spider.js\n\n```\n\n```\ncd /var/server/spider\nnpm install\n\nnpm install pm2 -g \nPORT=3000 pm2 -f start spider.js\n```\n\nafter started, you can use `pm2 logs` to monitor logs, `pm2 list` to display services and much more.\n\n\n4. Proxy Request\n\nI suppose you use nginx as web server and run the nodejs and nginx at same server.\n\n```\nupstream spider {\n    server localhost:3000;\n}\n\nserver {\n    ...\n    \n    \n    set $is_spider 0;\n    set $is_server_render 0;\n\n    if ($http_user_agent ~ Baiduspider) {\n       set $is_spider 1;\n    }\n\n    if ($http_user_agent ~ Googlebot) {\n       set $is_spider 1;\n    }\n\n    if ($http_user_agent ~ ServerRender) {\n       set $is_server_render 1;\n    }\n\n    set $is_spider_is_render $is_spider$is_server_render;\n\n    location / {\n        ...        \n    \n        proxy_set_header Host $host;\n        proxy_set_header X-Real-IP $remote_addr;\n        proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;\n        proxy_set_header X-Forwarded-Proto $scheme;\n\n        if ($is_spider_is_render = 10) {\n             proxy_pass http://spider;\n        }\n\n        ...\n    }\n    ...\n}\n```\n\nAfter changing nginx config, don't forget reload the nginx.\n\nYou can make a request and check your nginx access log if anything works great.\n\n`curl -A 'fake Googlebot by server-render-javascript' http://yourwebsite.com/abc`\n\nYou should get two line in nginx access log, one is your request with user-agent `fake Googlebot by server-render-javascript` and one made by\nyour upstream server with user-agent `ServerRenderJavascript`, if you have not change the default user-agent at craw.js.\n\n\n## What and how it works\n\nYour website is rendered with javascript. But search engine (like Baidu, Sogou, 360) does not like the page, and `even` can not understand javascript content totally.\n\n\nSo, why don't we run a browser on the server side. When spider like Googlebot comes to your website,\nproxy the request to a upstream server, why not `nodejs server`, and the upstream server deal the request\nwith a headless browser and make a new request just like the we human visit website by Safari or Chrome and return the\nrendered content back.\n\nThe workflow looks like this\n\n```\nGoogleBot =\u003e Web Server =\u003e NodeJS Server =\u003e Make A Request Again With Server Browser =\u003e Get Web Content And Return\n```\n\n","funding_links":[],"categories":[],"sub_categories":[],"project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fitbdw%2Fserver-render-javascript-chrome","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fitbdw%2Fserver-render-javascript-chrome","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fitbdw%2Fserver-render-javascript-chrome/lists"}