如何实现自己的网页中某板块同步某门户网站新闻标题的功能?

如何实现自己的网页中某板块同步某门户网站新闻标题的功能

详细描述:
我的网页A,某门户网页B,现在需要把B页面某新闻板块的新闻标题放到A页面上;

A网页上同步B网页上的新闻标题和链接,无需同步新闻内容。

B网页上的新闻标题更新则A网页的更新是同步的。

注:不使用IFAME,使用iframe框架B页面的新闻板块到A网页上也可以实现同步新闻标题的更新,但是新闻标题的样式和顺序等我无法控制。

第二版源码:Python服务器:

@app.route('/')
def index():
    hot_news = getNews()
    return render_template("index.html", news = hot_news,works = works)

Python爬取功能:

import requests as rq
from bs4 import BeautifulSoup

URL = 'https://www.cls.cn/'
headers = {
    'host': 'www.cls.cn',
    'User-Agent': 'Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/89.0.4389.90 Safari/537.36',
}

def getNews():
    news = {}
    try:
        res = rq.get(URL,headers = headers)
        res.encoding = 'utf-8'    
        soup = BeautifulSoup(res.text,'lxml')
        
        hot = soup.find_all('a',class_='f-w-b c-ef9524 b-c-222')
        for a in hot:
            news[a.text] = "https://www.cls.cn" + a['href']   
            
        hot2 = soup.find_all('a',class_='f-w-b c-222 b-c-222')
        for b in hot2:
            news[b.text] = "https://www.cls.cn" + b['href']
            
        hot3 = soup.find_all('a',class_='clearfix o-h f-s-23 f-w-b home-article-title home-article-title-small')
        for c in hot3:
            news[c.text] = "https://www.cls.cn" + c['href']  
            
        hot4 = soup.find_all('a',class_='c-383838 w-100p o-h home-article-rec-list')
        for d in hot4:
            news[d.text] = "https://www.cls.cn" + d['href']  
    except:
        with open("./static/news.txt",encoding='utf-8') as f:
            contents = f.readlines()
        for content in contents:
            content = content.split(",")
            news[content[0]] = content[1] 

    return news


def get_news():
    news = {}
    with open("./static/news.txt",encoding='utf-8') as f:
        contents = f.readlines()
        for content in contents:
            content = content.split(",")
            news[content[0]] = content[1] 
    return news

HTML网页端:

<!--实时财经热点-->
            <div id="hot" class="bj">
                <h4><span><img src="../static/images/热点.png" style="width:30px"></span>实时财经热点</h4>
                <ul class="list-group">
                {% for text in news %}
                     <li class="list-group-item"><a href='{{news[text]}}'>{{text}}</a></li>
                {% endfor %}
                </ul>
            </div>

如果能帮到您请务必点击采纳。

给题主提供一个思路,
第一步:设计一张数据库表 ,将你要展示的信息都设计成字段
第二步:打开你要copy的新闻页面,按f12拿连接地址
第三步:后端写定时任务,定时去访问这些地址,并将返回的数据保存到数据库,建议凌晨去访问。
访问数据的时候,看需要什么参数,最好采取分段访问。

可以试试JS注入,第一步创建一个隐藏的iframe,第二步写获取标题传给top的js方法,第三步注入到iframe中,第四步显示到top中,前提是浏览器要支持注入,反正是你自己用,那就用一个可以注入js的浏览器

let titleListBox = document.querySelectorAll('.home-content-left')[1]
let titleListNode = titleListBox.querySelectorAll('.home-article-list')
let titleList = []
titleListNode .forEach(item=>{titleList.push(item.querySelector('a').text())})
console.log(titleList )

1

1.先用nodejs爬虫定时爬取网站标题
2.再用websocket推送,将标题数据推送给你这个前端网站
3.在你这个前端网站用websocket接收推送的数据,渲染到前端网站上

定时爬别人的数据就行了

1.看是否有请求参数接口,有接口,前端可以直接通过请求接口获取你需要的标题等数据,然后将所获取的数据填充到自己页面
2.如果没有数据请求接口,只能考虑根据页面标签元素去解析页面,爬取你所需要的信息,然后将获取信息在自己页面展示,爬的话建议不要太频繁,太频繁容易被封禁IP或拉入黑名单等。

尝试上 微前端 吧 京东的 MicroApp、阿里的乾坤都是比较好上手的,父子兄弟传值也是比较方便

实时更新是做不到的。只有定时刷新可以做到。
写爬虫从目标页面获取 标题和链接,定时抓取存入到数据库。
你的前端页面定时获取以上自己数据库的数据。

![img](https://img-mid.csdnimg.cn/release/static/image/mid/ask/036365102446190.png "#left"

就是这一个板块给放到自己的网页上 如果使用iframe框架,那么右边的收音机图标还有广告都框架进去了 使用别的方法怎么实现?

通过访问 view-source:https://www.cls.cn/ 看的出财联社有做ssr
所以可以尝试ajax读取页面的代码再做解析取出需要内容

如有帮助请采纳回答谢谢

js不行,用php获取

很简单,从A网页上ajax请求到B网页的标题和链接,然后写入A网页对应的标题和链接上。当然服务端获取后B网页输出到A网页也可以。如果考虑B门户可能设置跨域限制,服务端获取能同时解决跨域问题,更为稳妥。

建议先将别的门户网站的标题爬取下来(推荐你使用scrapy框架)或者你本身通过你使用开发语言的内置库能爬取也可以,然后存库(建议用redis),然后你自己的网页模块读取库,将读取的标题信息或者链接信息显示在你自己写的网站上,大概流程是这样。然后你需要定时的去获取别的门户网站的标题信息来更新。 另外,题主,你说的想把人家的标题样式风格也拷贝过来这个没必要,如果人家网站用的是js动态呈现,工作量会很大的,你要保证的是标题的准确性和实时性

简单说下思路:

  1. 实时, 在渲染页面的时候直接用js抓取B网站内容, 解析数据后再渲染页面, 缺点...页面太慢了;
  2. 定时, 定时抓取B网站内容放入内存或者第三方存储中, 渲染页面时候直接去取数据, 也可以达到类似的实时效果(比如你十秒抓一次)

可以写一个Ajax调用,将A站的页面显示的HTML内容获取到,通过唯一的标识,获取到自己想要的的一块div内容,然后将这块div内容通过innerHTML的方式加入到自己的页面中。听上去可能像是爬虫,但是要比爬虫的实现方案简单。如果数据不是太讲究实时性的话,可以通过浏览器的缓存来实现暂存。当缓存失效过期的时候,再次进行加载对应的页面逻辑就可以了

但是有一点不好的点就是万一你找到的唯一标识被人家的站点替换了,你这块的内容也就不好加载了。

就以百度热搜为例,用Python代码。但是实时更新是做不到的。

实现方式就是很直接
1、如果B网站使用的接口给页面提供信息,你可以直接调用这个接口,自然可以获取相同的数据,自己解析数据放在你的网站上;
2、爬它。。。实时性不好,但是通用,哇咔咔,安全第一;