我現在遇到一個很詭異的情境
我目前用的編輯器是 summernote,我有把它改造過
我做了一個 custom button
當我要嵌入 instagram 時
第一個可以選擇網址貼上,我就直接打 IG的API就好,他就會返回給我 IFRAME
例如這樣的網址:https://www.instagram.com/p/BpD_tPJjLS4/?utm_source=ig_embed&utm_medium=loading
第二個是透過內嵌方式,取得類似這種程式碼
<blockquote class="instagram-media" data-instgrm-captioned data-instgrm-permalink="https://www.instagram.com/p/BpD_tPJjLS4/?utm_source=ig_embed&utm_medium=loading" data-instgrm-version="12" ...省略
datetime="2018-10-18T05:20:04+00:00">PDT 2018 年 10月 月 17 日 下午 10:20</time> 張貼</p></div></blockquote> <script async src="//www.instagram.com/embed.js"></script>
但是我要跟 line 串 RSS 的時候,對方是說只能給他 blockquote 不能是 iframe,但是只要有 www.instagram.com/embed.js
存在, IG就會把它變成 iframe 而且是立即~
但是 line 的 rss 只能接受 blockquote
於是我去看 facebook 即時文章 的RSS範例,他也是只能接受 blockquote,因為他會自動幫我跑出一個 embed.js 出來,跟 line 一樣的功能~也就是說他們兩個都不需要轉換過後的 iframe
問題
我在自己後台編輯文章的時候,我把 blockquote
最後附帶的 embedjs 拿掉,
他就只會出現IG預設預覽像這樣:
https://imgur.com/a/uoCp0GM
於是送出的時候也會只有 blockquote ,這個是 facebook 跟 line RSS 要的~這OK
只是要怎麼樣的作法
可以在當我在編輯文真的時候,可以看到該IG貼文圖片?但是送出的時候一樣會是 blockquote?
因為現在要能看到該貼文圖片只能讓 IG的embedjs 轉成 iframe,但這樣臉書跟賴他們也不是要 iframe
我現在的作法在編輯器輸入文本後,按下reload,可以透過 ajax 打後端,然後直接印出編輯器內的資料顯示在旁邊,這OK
但是裡面如果有 blockquote ,就一樣變成只有IG預設預覽。當我在後端替她加上 embedjs 他帶到前端來之後,預覽那邊確實轉成貼文預覽了(iframe),但我編輯器內的 blockquote 也會被轉為 iframe 。。。
也就是說如果在同一頁都有 embedjs ,所有的 blockquote 都會被轉成 iframe....
我的目的很像是左邊文章編輯,右邊是預覽(就是前端看到的樣子)
所以如果做另一頁,就似乎失去這個效果~