Is it possible to fully download a website or view all of its code? Like for example I know you can view page source in a browser but is there a way to download all of a websites code like HTML, CSS and JavaScript then run it on my own server or change it up and run that?
user3678528
1,7312 gold badges20 silver badges23 bronze badges
asked Sep 1, 2016 at 2:10
4
Hit Ctrl+S and save it as an HTML file [not MHTML]. Then, in the tag, add a
tag. For this webpage, for example, it would be
.
This makes sure that all relative links point back to where they're supposed to instead of to the folder you saved the HTML file in,
so all of the resources [CSS, images, JavaScript, etc.] load correctly instead of leaving you with just HTML. See MDN for more details on the tag.
answered Sep 1, 2016 at 2:28
Michael KolberMichael Kolber
1,2191 gold badge14 silver badges21 bronze badges
The HTML, CSS and JavaScript are sent to your computer when you ask for them on a HTTP protocol [for instance, when you enter a url on your browser], therefore, you have these parts and could replicate on your own pc or server. But if the website has a server-side code [databases, some type of authentication, etc], you will not have access to it, and therefore, won't be able to replicate on your own pc/server.
answered Sep 1, 2016 at 2:16
In Chrome, go to File -> Save Page as.
That will download the entire contents of the page.
answered Sep 1, 2016 at 2:19
nixkuroinixkuroi
2,2061 gold badge19 silver badges24 bronze badges
2
Sure. There are tools/scrapers for this, such as SurfOffline and A1 Website Download. I've used both. They'll allow you to scrape a URL for all its files, including html/css, etc. Tools like this were invented to view websites while offline, hence the names.
However, just keep in mind that these can only download front-end/display facing files, so they can't download back-end scrips, like PHP files, etc.
answered Sep 1, 2016 at 2:20
You can use HTTrack tools to grab all website content and all the entire image, css, html, javascript.
You can download HTTrack here
answered Sep 1, 2016 at 3:08
1
Tìm hiểu cách tải xuống tất cả các tài nguyên của một trang web để tạo một bản sao cục bộ đầy đủ chức năng của một trang web trong node.js
Đã bao nhiêu lần, với tư cách là Frontend Developers, chúng tôi đã quyết định triển khai một bản sao của một số tính năng mà trang web của bên thứ ba có trong trang web của chúng tôi? Tôi thường làm điều này rất nhiều, đặc biệt khi không có sự thay thế nguồn mở cho tính năng này và tôi không muốn viết nó từ đầu vì sẽ mất rất nhiều thời gian để kết thúc với một cái gì đó tốt đẹp. Cách dễ nhất để làm điều này là bằng cách đọc mã nguồn của một trang web, sử dụng CTRL + U trong chrome chẳng hạn, đọc các tệp JavaScript cũng như miễn là chúng không được thu nhỏ [ví dụ như trong các trang web bán các mẫu].
Điều này chỉ khó chịu khi chúng tôi nói về việc làm nổi bật mã, vì bạn không thể so sánh cú pháp làm nổi bật do trình duyệt cung cấp với bản được cung cấp bởi IDE yêu thích của bạn như Visual Studio Code, NetBeans, v.v. Một bản sao của mã và tài nguyên của trang web để thao túng nó tại địa phương phải không? Nhờ một kịch bản khá hữu ích sử dụng Puppeteer, điều này có thể dễ dàng thực hiện trong vòng vài phút [và vài giây sau khi thực hiện]. Trong bài viết này, chúng tôi sẽ giải thích cho bạn cách dễ dàng thực hiện Cloner trang web của riêng bạn với Node.js.
1. Cài đặt trang web Scrapper Puppeteer
Một trong những lợi thế có giá trị nhất của việc sử dụng tập lệnh dựa trên Puppeteer, phiên bản không đầu của crom, là bạn sẽ không chỉ có thể sao chép các tính năng trang web tĩnh thực hiện JavaScript hoặc thậm chí là JavaScript, mà còn có thể Tải xuống nội dung và tài nguyên được tạo bởi các trang động sử dụng React hoặc Angular. Cài đặt thư viện trang web-scraper-puppeteer bằng NPM trong thiết bị đầu cuối của bạn:
npm install website-scraper website-scraper-puppeteer
Để biết thêm thông tin về dự án này, vui lòng truy cập kho lưu trữ chính thức tại GitHub tại đây. Plugin này, về cơ bản & nbsp; bắt đầu crom ở chế độ không đầu, chỉ mở trang và chờ cho đến khi toàn bộ trang được tải. Nó không phải là lý tưởng vì có lẽ bạn cần phải đợi cho đến khi một số tài nguyên được tải hoặc nhấp vào một số nút hoặc đăng nhập.
2. Tạo tập lệnh tải xuống
Sau khi cài đặt plugin trên thư mục làm việc của bạn với NPM, bạn sẽ chỉ cần tạo tệp JavaScript với mã sẽ tải xuống một số trang web. Tạo tệp index.js
và đặt mã sau bên trong:
// index.js
const scrape = require['website-scraper'];
const PuppeteerPlugin = require['website-scraper-puppeteer'];
const path = require['path'];
scrape[{
// Provide the URL[s] of the website[s] that you want to clone
// In this example, you can clone the Our Code World website
urls: ['//ourcodeworld.com/'],
// Specify the path where the content should be saved
// In this case, in the current directory inside the ourcodeworld dir
directory: path.resolve[__dirname, 'ourcodeworld'],
// Load the Puppeteer plugin
plugins: [
new PuppeteerPlugin[{
launchOptions: {
// If you set this to true, the headless browser will show up on screen
headless: true
}, /* optional */
scrollToBottom: {
timeout: 10000,
viewportN: 10
} /* optional */
}]
]
}];
Mã trước đó sẽ nhập các thư viện đã cài đặt và Trình trợ giúp đường dẫn Node.js [để tạo một đường dẫn tuyệt đối của thư mục hiện tại]. Chúng tôi sẽ gọi phương thức Scrape, cung cấp đối số đầu tiên là một đối tượng với cấu hình cần thiết để bắt đầu với bản sao trang web. Các tùy chọn quan trọng nhất là thuộc tính URLS, mong đợi một loạt các chuỗi, trong đó mọi mục là một URL web của trang của trang web mà bạn muốn sao chép. Tùy chọn thư mục tương ứng với đường dẫn thư mục cục bộ nơi nên đặt nội dung trang web. Tùy chọn plugins sẽ tải plugin Puppeteer cho Scrapper thông thường để sao chép các trang web động đúng cách.
3. Chạy tập lệnh
Cuối cùng, hãy mở thiết bị đầu cuối của bạn và chuyển sang thư mục của tập lệnh bạn vừa viết và thực hiện nó:
node index.js
Điều này sẽ sao chép trang web mong muốn, trong trường hợp này là Code World.Khi nó kết thúc, bạn sẽ tìm thấy trong cùng một thư mục của tập lệnh thư mục mới với tất cả JavaScript, HTML và CSS của trang web.Ví dụ: nhân bản Code World của chúng tôi sẽ tạo ra một cấu trúc tương tự như:
./
âââ CK7DK53I.json
âââ CK7I4KJM;CK7IP27L
âââ css/
â âââ bootstrap.css
â âââ cookieconsent.min.css
â âââ custom.css
â âââ font-awesome.min.css
â âââ magnific-popup.css
â âââ simple-line-icons.css
â âââ slick.css
â âââ style-dark.css
âââ favicon.ico
âââ fonts/
â âââ Simple-Line-Icons.eot
â âââ Simple-Line-Icons.svg
â âââ Simple-Line-Icons.ttf
â âââ Simple-Line-Icons.woff
â âââ Simple-Line-Icons.woff2
â âââ fontawesome-webfont.eot
â âââ fontawesome-webfont.svg
â âââ fontawesome-webfont.ttf
â âââ fontawesome-webfont.woff
â âââ fontawesome-webfont.woff2
â âââ fontawesome-webfont_1.eot
â âââ sprite.svg
âââ images/
â âââ articleocw-5c5a2906da73d.jpg
â âââ articleocw-5c8fb0eab08af.png
â âââ articleocw-5c8fe4b534e04.jpg
â âââ articleocw-5cb14f9ea4cfa.png
â âââ articleocw-5cb1f4b2bd76b.png
â âââ articleocw-5cdc8d904e6b9.jpg
â âââ articleocw-5cdde93a04430.png
â âââ articleocw-5ce040e91c1a8.png
â âââ articleocw-5d040d2ec3975.png
â âââ articleocw-5d200b5b06504.png
â âââ articleocw-5d45c528f0103.webp
â âââ articleocw-5d69328bac9a2.webp
â âââ articleocw-5da07b41aa587.png
â âââ articleocw-5db79e7faa2c5.webp
â âââ articleocw-5de93b3040ac4.webp
â âââ articleocw-5e1df41d2e35b.webp
â âââ articleocw-5e3caa198aab8.webp
â âââ articleocw-5e3d7b2a01256.webp
â âââ articleocw-5e3dbabbcff04.webp
â âââ articleocw-5e3dd0faa3106.webp
â âââ articleocw-5e4162f1d2db6.webp
â âââ articleocw-5e418ee7e81b4.png
â âââ bestfreehtmlcsstemplates_banner_quad.png
â âââ graph-bg.png
â âââ hero-slide-1.jpg
â âââ hero-slide-2.jpg
â âââ hero-slide-3.jpg
â âââ home_bg.jpg
â âââ jobble.png
â âââ login_register_bg.jpg
â âââ login_register_bg_1.jpg
â âââ main-news-banner__bg.jpg
â âââ mini_ads.png
â âââ mini_bestfreehtmlcsstemplates.png
â âââ mini_wrapbootstrap.png
â âââ ocw_logo_255.png
â âââ page-heading-pattern.png
â âââ page-heading.jpg
â âââ rosterv3_player_01-bg.png
â âââ single-post-img5.jpg
â âââ team-roster-slider-bg.jpg
âââ index.html
âââ js/
â âââ adsbygoogle.js
â âââ analytics.js
â âââ bootstrap.bundle.js
â âââ bsa.js
â âââ cookie.js
â âââ cookieconsent.min.js
â âââ core.js
â âââ custom.js
â âââ init.js
â âââ integrator.js
â âââ integrator_1.js
â âââ jquery.min.js
â âââ monetization.js
â âââ osd.js
â âââ pro.js
â âââ s_83085e49dfeedee6628ee5a7d7cd7359.js
â âââ show_ads_impl_fy2019.js
âââ js_1/
âââ raw_83a93c31c68198a3762e2237ff33e529.html
âââ raw_b54f5852f835e7a023fcacceb1b6473c.html
âââ zrt_lookup.html
Hãy chắc chắn xóa tất cả các quảng cáo, video và phân tích mà bạn có thể tìm thấy trong một số trang web để ngăn chặn ngoại lệ JavaScript sẽ tăng các ngoại lệ trong trang web nhân bản.
Mã hóa hạnh phúc!