第三方服务codepen不显示

[geekape]

希望可以显示第三方服务，替换下这个模板

<iframe height="265" style="width: 100%;" scrolling="no" title="前端路由history" src="https://codepen.io/happysoldier/embed/JjGeWPK?height=265&theme-id=dark&default-tab=js,result" frameborder="no" allowtransparency="true" allowfullscreen="true">
  See the Pen <a href='https://codepen.io/happysoldier/pen/JjGeWPK'>前端路由history</a> by geekape
  (<a href='https://codepen.io/happysoldier'>@happysoldier</a>) on <a href='https://codepen.io'>CodePen</a>.
</iframe>

[x-cold]

输入（语雀原文）和输出（拉取之后的 markdown）提供一下。

[geekape]

输入（语雀原文）和输出（拉取之后的 markdown）提供一下。

语雀原文地址：https://www.yuque.com/geekape/blog/cl80gi

输出的markdown:

---
title: 前端路由
urlname: cl80gi
date: 2020-07-18 15:02:44 +0800
tags: []
categories: []
---

## 一、起源

前端路由的出现是为了实现**单页面应用，**简称 SPA（single page web application ）。
\*\*

## 二、定义

简单的说，就是在保证只有一个 HTML 页面，且与用户交互时不刷新和跳转页面的同时，为 SPA 中的每个视图展示形式匹配一个特殊的 url。在刷新、前进、后退和 SEO 时均通过这个特殊的 url 来实现。

有两点特性：

- 改变 url 且不让浏览器像服务器发送请求。
- 可以监听到 url 的变化。

## 三、实现

### History 模式

**使用的 API**

```javascript
history.go(-1); //后退一页
history.go(2); //后退两页
history.forward(); //前端一页
history.back(); //后退一页

// 添加状态到栈
history.pushState();

// 新状态代替当前状态
history.replaceState();

// 返回当前状态对象
history.state;

主要使用的 api 是 pushState  和 replaceState ，均接收三个参数：

• state：合法的 javascript 对象，可以用在 popstate 事件中
• title：现在大多数浏览器忽略这个参数，直接用 null 代替
• url：任意有效的 URL，用于更新浏览器地址栏

对于 history模式 ，url 改变只能由下面四种方式引起：

1. 点击浏览器前端或后退按钮
2. 点击 a 标签
3. 使用 history.pushState
4. 使用 history.replaceState

Hash 模式

hash 模式有个明显的特征，就是 url 中有 # 号，例如 www.baidu.com/#query=123 ，而 #query＝123  就是我们期望的 hash 值。

使用的 API：

// 设置hash值
window.location.hash = "xxx";

//获取hash值
let hash = window.location.hash;

//监听hash值变化，点击浏览器前端后退也会触发
window.addEventListener(
  "hashchange",
  function (event) {
    let newURL = event.newURL; // hash 改变后的新 url
    let oldURL = event.oldURL; // hash 改变前的旧 url
  },
  false
);

[x-cold]

语雀的 markdown 里面根本没有 iframe

https://www.yuque.com/geekape/blog/cl80gi/markdown

[geekape]

预览html可以获取到codepen链接，可以将链接替换到codepen通用模板吗？

[x-cold]

我理解应该是通过 iframe 嵌入的

[x-cold]

markdown 里面暂时无法获取到这个信息

[Leader755]

这个里面使用的及时iframe链接的，我也用过codePen，发现导出后也不支持。能支持下iframe吗

[x-cold]

可以试试在 adapter 支持一下，近期我的工作比较繁忙，你可以先尝试 fork 项目开发这个特性哈，后续可以提 MR