javascript - 如何直接移植其他网站的部分区域内容？

问题描述

问 题

可能问题描述的不是很清楚，比如我要整个复制SF的

这一块HMTL到我的网站里，如果SF更新了，我的也跟着更新，而且能保持可点击的状态？
还是只能写爬虫抓取后自己排版来实现？

解决方案

鉴于题主想要使用代理实现，我在这里使用NodeJS中间层做代理，实现题主的需求。

实现原理

给项目加个NodeJS中间层，实时获取SF网页内容，前端使用Ajax请求此中间层，中间层得到SF的html之后以字符串的形式返回到前端，最后绑定到DOM即可。简单来说，就是使用服务端去抓取SF网页内容，返回给前端。

实现思路

可以使用ExpressJS框架，具体的使用方式请查看官方文档。

服务端代码：

var express = require('express');
var app = express();
var request = require('request');

//定义路由，供前端ajax调用
app.get('/sf', function(req, res, next) {
  //请求sf网页内容
  request({url: req.query.url, encoding : null}, function(err, response, body) {
    if (!err && response.statusCode == 200) {
      req.body.sfHtml = res.body;
    }
  });
  next();
}, function (req, res) {
  //获取到返回值之和以json的形式返回给前端
  res.json({sfHtml: req.body.sfHtml});
});

//启动服务
app.listen(3000, function () {
  console.log('Example app listening on port 3000!');
});

前端代码就更简单了：

$(document).ready(function(){
  $.ajax({
      url:"/sf?url=http://sfurl.cn",
      success: function(res){
          //这里拿到Node服务端返回的sf html内容
          console.info(res.sfHtml);
      }
  });
});

最后

以上只是提供一个简单的实现思路，具体的情况请题主结合自己的技术场景做调整，假如使用的是其它服务端语言，同样也是可以使用这种思路去实现题主的需求。

这篇关于javascript - 如何直接移植其他网站的部分区域内容？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！