Author Topic: CKEditor: insert YouTube adds the wrong URL  (Read 1323 times)

Offline CodeALot

  • Posts: 322
CKEditor: insert YouTube adds the wrong URL
« on: April 28, 2016, 05:45:10 PM »
Fresh installation of 2.8.3 SP6, nothing changed yet.  Let's say the domain name is http://www.example.com

Made a new page, inserted a Youtube video using CKEditor's YouTube button.

Used the second option ("Paste Youtube URL"), selected Responsive video
No other options were turned on or off.

After clicking OK, the video shows in the backend-editor. (Which is weird already) - source of the YouTube-embed says:  src="//www.youtube.com/embed
After saving the page, the source of the Wysiwyg says: src="http://example.com//www.youtube.com/embed

Now, that won't work of course.

Question: what's going wrong here?

Offline jacobi22

  • Posts: 4206
    • Jacobi22
Re: CKEditor: insert YouTube adds the wrong URL
« Reply #1 on: April 28, 2016, 06:41:47 PM »
do you use the text field to insert the embed code (right mouse click on the yt-video-page and copy the embed codeto clipboard) or the link field?? - first variant works for me without problems, the link field add my WB_URL to the video adress   :roll:

Du warst hier in meiner Seele und bist jetzt meilenweit entfernt
Wenn ich in Liedern von dir erzähle, war das jede Träne wert!
Alex Diehl- In meiner Seele

Offline CodeALot

  • Posts: 322
Re: CKEditor: insert YouTube adds the wrong URL
« Reply #2 on: April 29, 2016, 09:39:53 AM »
do you use the text field to insert the embed code (right mouse click on the yt-video-page and copy the embed codeto clipboard) or the link field?? - first variant works for me without problems, the link field add my WB_URL to the video adress   :roll:


I used the second option ("YouTube Video hier einfügen"), selected Responsive video, and that does not work correctly. Is there a way to fix that?

Offline jacobi22

  • Posts: 4206
    • Jacobi22
Re: CKEditor: insert YouTube adds the wrong URL
« Reply #3 on: April 29, 2016, 01:35:33 PM »
we think, the problem come's out of the youtube-plugin, maybe we found something in the source code there

P.S. its not a WB-plugin, it comes from the ckeditor-group
Du warst hier in meiner Seele und bist jetzt meilenweit entfernt
Wenn ich in Liedern von dir erzähle, war das jede Träne wert!
Alex Diehl- In meiner Seele

Offline CodeALot

  • Posts: 322
Re: CKEditor: insert YouTube adds the wrong URL
« Reply #4 on: April 29, 2016, 01:57:04 PM »
Found it.

Find /modules/ckeditor/ckeditor/ckeditor.js

Unminify it

Go to line 24626

Change:

Code: [Select]
var b = "//",
into:

Code: [Select]
var b = "http://",
That's all.


Offline jacobi22

  • Posts: 4206
    • Jacobi22
Re: CKEditor: insert YouTube adds the wrong URL
« Reply #5 on: April 29, 2016, 02:08:43 PM »
good job!  (Y)

the double slash come's from the original yt-plugin and its "saved" in the ckeditor.js from the package-builder - this method give's a smaler code for the complete module (all original plugin are stored in this ckeditor.js and doesnt need own plugin-files, only the images)

hope, we can solve this in a next upgrade, but its difficult, because, if somebody use the original plugin, he has the same problem
Du warst hier in meiner Seele und bist jetzt meilenweit entfernt
Wenn ich in Liedern von dir erzähle, war das jede Träne wert!
Alex Diehl- In meiner Seele

Offline CodeALot

  • Posts: 322
Re: CKEditor: insert YouTube adds the wrong URL
« Reply #6 on: April 29, 2016, 02:23:19 PM »
For those who don't know how to fix that JS-file: here's the compressed version with working YouTube plugin.

This goes into /modules/ckeditor/ckeditor/ckeditor.js

Offline dbs

  • Posts: 6831
  • tioz4ever
    • WebsiteBaker - jQuery-Plugins - Module - Droplets - Tests
Re: CKEditor: insert YouTube adds the wrong URL
« Reply #7 on: March 24, 2017, 04:27:47 PM »
Hi, with SP7 (PHP7.0.16) and the original ckeditor.js or the attached file from CodeALot it will not work for me.

Embedded code or URL, nothing shows anything. Content stay blank. No errors.
In both cases the video is visible in editor before i save the content or switch to sourcecode view. After saving or switching there is only a box with red borders and the word "iframe" inside. In frontend is also nothing.

What is the secret?

edit: the embedded code in a code2-html section works.
Code: [Select]
<iframe width="560" height="315" src="https://www.youtube.com/embed/XPSt6191Dw4?rel=0" frameborder="0" allowfullscreen></iframe>in wysiwyg-section it looks so:
Code: [Select]
<iframe allowfullscreen="" frameborder="0" height="360" scrolling="no" src="https://www.youtube.com/embed/XPSt6191Dw4" width="640"></iframe>
« Last Edit: March 24, 2017, 04:39:52 PM by dbs »

Offline jacobi22

  • Posts: 4206
    • Jacobi22
Re: CKEditor: insert YouTube adds the wrong URL
« Reply #8 on: March 24, 2017, 06:19:18 PM »
problem is the third party ckeditor plugin "youtube" - it generate the wrong url, if you use the plugin interface
after saving the url, it give's a wrong url back (added WB_URL inside of the youtube-link) like

http://wb1638/www.youtube.com/embed/d5DNIGzgMF0?wmode=transparent&amp;jqoemcache=vueiE

if you edit this link in the editor source-mode, it will work

the fix from CodeALot was only for this, at this time actual ckeditor-version. after upgrade from editor or plugin, you lost the code changes again, because also the ckeditor.js is third party

the only good solution is a wb-own-plugin, so, that you dont need the third party plugin or not overwrite the code in a upgrade
Du warst hier in meiner Seele und bist jetzt meilenweit entfernt
Wenn ich in Liedern von dir erzähle, war das jede Träne wert!
Alex Diehl- In meiner Seele

Offline dbs

  • Posts: 6831
  • tioz4ever
    • WebsiteBaker - jQuery-Plugins - Module - Droplets - Tests
Re: CKEditor: insert YouTube adds the wrong URL
« Reply #9 on: March 24, 2017, 06:25:45 PM »
Had not seen a wrong url in SP7. See my last line in post..
But a test in 2.10 shows the wb-url before youtube-url. Plugin there is "oembed" i think.

I will test to build a droplet.

Offline dbs

  • Posts: 6831
  • tioz4ever
    • WebsiteBaker - jQuery-Plugins - Module - Droplets - Tests
Re: CKEditor: insert YouTube adds the wrong URL
« Reply #10 on: March 24, 2017, 06:40:32 PM »
Found a old droplet. Works for me.


edit: droplet removed. needs some changes.
« Last Edit: March 24, 2017, 06:54:12 PM by dbs »

Offline jacobi22

  • Posts: 4206
    • Jacobi22
Re: CKEditor: insert YouTube adds the wrong URL
« Reply #11 on: March 24, 2017, 08:39:24 PM »
so, i know, whats happend, but didnt found a way, to compress a valide ckeditor.js

the plugin give's a invalide source url to the video for the iframe-part back, like src="//www.youtube.com/embed/d5DNIGzgMF0............."
(needs the protocoll http/https in the front)

in the save process come the filter  to replace hard-coded URL's in the content (ReplaceSysvar) and think, its a relative url. And he add the WB-URL in the front of this link like
src="http://myWBURL/www.youtube.com/embed/d5DNIGzgMF0............."

solution is the same like this from CodeALot, but different line's and different variable names in this file
(remember: this solution was for the editor in WB-Version 2.8.3 SP6 and works in this solution)

i use a lot of compressors for a test, any of them makes only some hundred line, other found errors in the code, the next gives a result, but this doesnt work in WB  :x

from my point, its better, to have not all plugins in the ckeditor.js, its not possible, to fix them for a normale user. In the old good time, every plugin has a plugins.js inside of the plugin folder, simple to change anything there

Du warst hier in meiner Seele und bist jetzt meilenweit entfernt
Wenn ich in Liedern von dir erzähle, war das jede Träne wert!
Alex Diehl- In meiner Seele

Offline dbs

  • Posts: 6831
  • tioz4ever
    • WebsiteBaker - jQuery-Plugins - Module - Droplets - Tests
Re: CKEditor: insert YouTube adds the wrong URL
« Reply #12 on: March 24, 2017, 10:21:34 PM »
First, good to know there is a problem.
I know it was a bad idea to take the old file for a newer version, but i want it testing.

I tought the plugin oembed is the right place to repair the invalid url. But i can't understand the code there in line 18/19 of jquery.oembed.min.j s.
In 2.10 this plugin i used.
In SP7 was it plugin youtube.

Offline jacobi22

  • Posts: 4206
    • Jacobi22
Re: CKEditor: insert YouTube adds the wrong URL
« Reply #13 on: March 25, 2017, 12:35:27 AM »
so...
we talk about different plugins   :-D

1. the multi-media plugin 
works for a lot of multimedia-platforms, youtube, wikipedia, scivee, metacafe, photobucket, twitter, googlecalendar etc

replace all http:// with //

fixed in jquery.oembed.min.j s

unpack the zip and replace the file in modules/ckeditor/ckeditor/plugins/oembed/libs

2. youtube-Plugin - for youtube-video only
code included in modules/ckeditor/ckeditor/ckeditor.js

unpack the zip and replace the file in modules/ckeditor/ckeditor/

both files for CKEDITOR v.4.6.2  - included in WB 2.10.0

P.S.: ZIP-Files in the next post
« Last Edit: March 25, 2017, 08:40:30 AM by jacobi22 »
Du warst hier in meiner Seele und bist jetzt meilenweit entfernt
Wenn ich in Liedern von dir erzähle, war das jede Träne wert!
Alex Diehl- In meiner Seele

Offline dbs

  • Posts: 6831
  • tioz4ever
    • WebsiteBaker - jQuery-Plugins - Module - Droplets - Tests
Re: CKEditor: insert YouTube adds the wrong URL
« Reply #14 on: March 25, 2017, 07:38:39 AM »
moin, no zips in your post, but sounds good.

Offline jacobi22

  • Posts: 4206
    • Jacobi22
Re: CKEditor: insert YouTube adds the wrong URL
« Reply #15 on: March 25, 2017, 08:39:26 AM »
sorry, i was sure, i add this zip's, but dont check it again after the preview
Du warst hier in meiner Seele und bist jetzt meilenweit entfernt
Wenn ich in Liedern von dir erzähle, war das jede Träne wert!
Alex Diehl- In meiner Seele

Offline dbs

  • Posts: 6831
  • tioz4ever
    • WebsiteBaker - jQuery-Plugins - Module - Droplets - Tests
Re: CKEditor: insert YouTube adds the wrong URL
« Reply #16 on: March 25, 2017, 09:31:53 AM »
The oembed plugin works now in SP7 & 2.10  (Y)
The ckeditor.js is for 2.10 i think and there it works too.  (Y)
Don't forget to clean cache.

Thanks for the solution!

Offline jacobi22

  • Posts: 4206
    • Jacobi22
Re: CKEditor: insert YouTube adds the wrong URL
« Reply #17 on: March 25, 2017, 09:57:09 AM »
do you need the ckeditor.js for SP7 also?
Du warst hier in meiner Seele und bist jetzt meilenweit entfernt
Wenn ich in Liedern von dir erzähle, war das jede Träne wert!
Alex Diehl- In meiner Seele

Offline dbs

  • Posts: 6831
  • tioz4ever
    • WebsiteBaker - jQuery-Plugins - Module - Droplets - Tests
Re: CKEditor: insert YouTube adds the wrong URL
« Reply #18 on: March 25, 2017, 10:12:04 AM »
Not really. In 2.10.1 will be a security-fix i think and everybody should upgrade. Or is a patch in work for security?

If patch, then a upgrade can wait and then i could need a ckeditor.js for SP7
But forget it. The media plugin is ok enough.

Offline jacobi22

  • Posts: 4206
    • Jacobi22
Re: CKEditor: insert YouTube adds the wrong URL
« Reply #19 on: March 25, 2017, 10:35:25 AM »
my information (but not actual and not a official info): no patch

i change the ckeditor.js for CKEditor 4.5.10, included in SP7 with a short test of the Youtube-Plugin in the attachement, maybe, you can test it - but be carefull with all this fixes - it works only for this special Editor-version,

you found the needed editor-version in all ckeditor.js in the first line with ,version:"4.5.10"
Du warst hier in meiner Seele und bist jetzt meilenweit entfernt
Wenn ich in Liedern von dir erzähle, war das jede Träne wert!
Alex Diehl- In meiner Seele

Offline dbs

  • Posts: 6831
  • tioz4ever
    • WebsiteBaker - jQuery-Plugins - Module - Droplets - Tests
Re: CKEditor: insert YouTube adds the wrong URL
« Reply #20 on: March 25, 2017, 11:18:02 AM »
Very cool, works, thanks.  (Y)

All 3 variations (droplet, media plugin, youtube plugin) works.
Only the media plugin shows also in backend a video (after saving).

Seems the youtube plugin replace html-code for the src.
Code: [Select]
<img class="cke_iframe" data-cke-realelement="%3Ciframe%20allowfullscreen%3D%22%22%20src%3D%22https%3A%2F%2Fwww.youtube.com%2Fembed%2F9xHhj9y0na4%3Frel%3D0%22%20frameborder%3D%220%22%20height%3D%22360%22%20width%3D%22640%22%3E%3C%2Fiframe%3E" data-cke-real-node-type="1" alt="IFrame" title="IFrame" src="data:image/gif;base64,R0lGODlhAQABAPABAP///wAAACH5BAEKAAAALAAAAAABAAEAAAICRAEAOw==" data-cke-real-element-type="iframe" data-cke-resizable="true" style="width:640px;height:360px;" align="">
But the user can choose one of the plugins. All good.

Offline CodeALot

  • Posts: 322
Re: CKEditor: insert YouTube adds the wrong URL
« Reply #21 on: May 17, 2017, 12:17:41 PM »
Is there an official update for CKEditor already that fixes all this?

Offline jacobi22

  • Posts: 4206
    • Jacobi22
Re: CKEditor: insert YouTube adds the wrong URL
« Reply #22 on: May 17, 2017, 01:11:01 PM »
Quote
Is there an official update for CKEditor already that fixes all this?
no, also the latest version of the plugin has the same problems, see the solution and the fix here

https://forum.WebsiteBaker.org/index.php/topic,29174.msg210559.html#msg210559
Du warst hier in meiner Seele und bist jetzt meilenweit entfernt
Wenn ich in Liedern von dir erzähle, war das jede Träne wert!
Alex Diehl- In meiner Seele

 

postern-length