nfl / jquery-oembed-all Goto Github PK

Flickr provides an iframe for its picture shows. The result is that a standard image is shown and then the iframe, i.e. the same picture twice.

On inspection, the getPhotoCode was using the url data to reference the image and then adding the html data is there is any.

I solved for this instance by changing the getPhotoCode so that is only uses the url data if there is no html data, see below.

I didn't want to push this as I have no way of carrying out a comprehensive test.

$.fn.oembed.getPhotoCode = function (url, oembedData) {
    var code;
    var alt = oembedData.title ? oembedData.title : '';
    alt += oembedData.author_name ? ' - ' + oembedData.author_name : '';
    alt += oembedData.provider_name ? ' - ' + oembedData.provider_name : '';

    if (oembedData.html) {
        code = "<div>" + oembedData.html + "</div>";
    } else if (oembedData.url) {
        code = '<div><a href="' + url + '" target=\'_blank\'><img src="' + oembedData.url + '" alt="' + alt + '"/></a></div>';
    } else if (oembedData.thumbnail_url) {
        var newURL = oembedData.thumbnail_url.replace('_s', '_b');
        code = '<div><a href="' + url + '" target=\'_blank\'><img src="' + newURL + '" alt="' + alt + '"/></a></div>';
    } else {
        code = '<div>Error loading this picture</div>';
    }

// if (oembedData.html) {
// code += "

    return code;
};

Small sites will not be listed as provider, so having oEmbed discovery support will help with those smaller pages/applications.

Polldaddy embed doesn't work as expected, as evident by trying to embed http://polldaddy.com/poll/7527144/. A possible new process is documented at http://support.polldaddy.com/how-do-i-embed-my-survey-into-my-website/.

not sure if this should be part of oembed or somewhere else...

This link, https://www.facebook.com/photo.php?fbid=10152074542607372&set=a.389482927371.168583.42693447371&type=1, doesn't embed as expected, and in fact, an error is thrown on a GET of the embed URL: https://graph.facebook.com/photo.php?fbid=10152074542607372&set=a.389482927371.168583.42693447371&type=1/?callback=jQuery1710637706714682281_1415731164913&_=1415731165124

{
error: {
message: "(#803) Some of the aliases you requested do not exist: photo.php",
type: "OAuthException",
code: 803
}
}

Please update to accept a URL of type https://www.facebook.com/photo.php?fbid=10152074542607372&set=a.389482927371.168583.42693447371&type=1

Unfortunately, the URL expanding doesn't work on HTTPS sites due to Same Origin Policy. The URL expanding services don't offer HTTPS access to their API, so the ajax request will be blocked by the browser.

See an explanation on stackoverflow

The effect of this is that (for example) shortened youtube (youtu.be) URLs will not be embedded correctly if your site runs on HTTPS.

One solution is to proxy the calls via another service (in our case we are using our servers to do this), thereby meaning we adhere to Same Origin Policy, and it is also an HTTPS call.

An enhancement to the library (which I plan to PR soon) would be to have the URL expanding service to be configurable, due to different API implementations, possibly using a callback would be the best method.

Can you please provide a guide on what kind of markup is produced so I can appropriately do the styling. I have found that some of the links like Youtube and SoundCloud produce an iframe whereas articles produce normal HTML markup.

Thanks.

Works if I use the long version of the youtube url but using https://youtu.be/wBf6BUQzYgA does not seem to work.

Hi,
I am really new to the oembed tag so this might be my own mistake, but I'm trying to get YouTube embed working with your tool and it doesn't seem to be working. Every YouTube video I try I am getting this "It may have been moved or deleted" frame in Chrome.

Screenshot: https://iota.lt/d/DnDUkVFytG/azLw5bKl.png

Is this functionality broken right now?

Other embeds such as the github one under the "shortened URL" section of your documentation do work.

Hi,

Longurl.org is no longer available? The DNS is not resolved and becaause of that the whole thing breaks down.

Jerry

We embed wistia videos using your plugin. The URLs have changed, so please also allow the following scheme:

"wistia.com/medias/.+"

Otherwise, the wrong embed tags are used

A lot of interesting articles are being published on Medium. However, Medium does not appear to support embedding.

Is it possible, and/or planned, for jquery oembed all to support Medium embeds?

It seems as though it is called long before the embed is even started. But I get the console you have in your library. and if i overwrite the onError function, it is always called. code I am using is like this ...

$("oembed").each(function() {
            var oembedelement = this;
            $(oembedelement).oembed($(oembedelement).html(), {
                includeHandle : false,
                embedMethod : 'auto',
                afterEmbed : function() {
                    $(oembedelement).remove();
                }
            });
        });

and the embed tags are something like <oembed>https://instagram.com/p/6aEQqHpS7g/?taken-by=earsplitt</oembed> being created from ckeditor.

starfishmod#119 (comment)

If the parent page is loaded via HTTPS, YouTube links will not be shown due to a Mixed Content warning, even if they are HTTPS links. An HTTPS Twitter links works in the same setup.

Parent page

https://www.mydomain.com/example.html
FICTIVE URL!

<html>
  <!-- other stuff -->
  <body>
    <a class="oembed" href="https://www.youtube.com/watch?v=iQnWuIGq2CM">https://www.youtube.com/watch?v=iQnWuIGq2CM</a>
  </body>
</html>

Binding

$('a.oembed').oembed()

(no custom settings)

JavaScript console

Mixed Content: The page at 'https://www.mydomain.com/example.html' was loaded over HTTPS, but requested an insecure resource 'http://www.youtube.com/embed/iQnWuIGq2CM?wmode=transparent&jqoemcache=N1doi'. This request has been blocked; the content must be served over HTTPS.

It seems a redirect is triggered to an HTTP address, maybe on YouTube's part?

Using the exactly same setup but with an HTTPS Twitter link, e.g. https://twitter.com/reinmarpl/status/573118615274315776 works as expected, i.e. no Mixed Content warning.

Interestingly, I can find a few requests to twitter.com, but no requests to youtube.com.

The problem occurs with Chrome and Firefox.

• Chrome Version 43.0.2357.134 (64-bit), Mozilla/5.0 (Macintosh; Intel Mac OS X 10_10_4) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/43.0.2357.134 Safari/537.36
• Firefox 39.0, Mac OS Mozilla/5.0 (Macintosh; Intel Mac OS X 10.10; rv:39.0) Gecko/20100101 Firefox/39.0

I can provide additional data if needed.

Could we make this repo's version tag semantic by renaming it from 0.9RC1 to 0.9.0-rc1? For more details please see http://semver.org/.

This will allow both NPM and Bower to automatically register new releases.

Hi, I'm trying to embed the following url but it returns an error:

http://www.instagram.com/p/BRVt7dZD0cG/

it actually happen on any instagram url. The error return is simply an object with error: error.

Hi. The error handlers on lines 251, 303, 332

error: settings.onError.call(container, externalUrl, embedProvider)

will be executed immediately, before ajax even started, since call is imperative to execute function right now. Then call will return undefined. As result, it will allways be errors in console, even when ajax succeed and no error handler will assigned to ajax at al. Right approach is to wrap handler code into anonymous function like

error: function(xhr, type, httpcode) {
    settings.onError.call(container, externalUrl, embedProvider, type, httpcode);
}

or to make settings.onError allways return function which does something with arguments.

But both of this methods will not help actually, because most of the library calls are JSONP, which is not ajax. According to jQuery manual

Note: This handler is not called for cross-domain script and cross-domain JSONP requests. This is an Ajax Event.

There is not much we can do about error handling in JSONP – fall gracefully after timeout exceeded is the limit. More info in SO question.

Just noticed today that links posted from https://mobile.twitter.com/ don't embed.
...also noticed youtu.be doesn't embed as well, but there was already an issue posted on that one so I figured I'd point out the twitter one just in case it was overlooked.

Thanks for the great work, finally got this figured out on my phpbb forum and it's working awesome, very happy to have it!

Hi,

I'm trying to get the oEmbed response from Youtube to have the thumbnail URL. Is it possible to get only the provider response (youtube, instagram, etc...) and not have only the embed code?

thanks

Resolving short URLs using longUrl service fails with mixed content when parent page is secured (HTTPS). LongUrl service is not accessible through HTTPS.

When you want to embed a large amount of URLs on a single page, in a social feed or blog for instance, you will get a large amount of resources and requests. This is not ideal for mobile and page load speed in general.

It'd be great if there's a setting that allows us to embed only the URL's 'og:image' property, overlayed with a Play button, and then load the player iframe only if the button is clicked.

Exemple : https://www.google.com/maps/place/San+Francisco,+Californie/@37.7577,-122.4376,12z/data=!3m1!4b1!4m2!3m1!1s0x80859a6d00690021:0x4a501367f076adff

or
https://www.google.com/maps/place/Toulouse,+France/@43.6052175,1.4453364,15.25z/data=!4m2!3m1!1s0x12aebb6fec7552ff:0x406f69c2f411030

Maybe character "+" break the rules. (?)

This is working : (without "+France")

https://www.google.com/maps/place/Toulouse/@43.6052175,1.4453364,15.25z/data=!4m2!3m1!1s0x12aebb6fec7552ff:0x406f69c2f411030

But Zoom, map type and others parameters aren't not supported.

You should enable Github Gist embed

As Yahoo! seems to have stopped their YQL API (https://stackoverflow.com/questions/44431212/yql-html-table-is-no-longer-supported) and as the fallback to open graph uses this API to parse web pages, the fallback is currently broken.

The YQL API response is:

/**/jQuery223015006062294677558_1499783106440({"query":{"count":0,"created":"2017-07-11T14:25:10Z","lang":"fr-FR","meta":{"message":"html table is no longer supported. See https://policies.yahoo.com/us/en/yahoo/terms/product-atos/yql/index.htm for YQL Terms of Use"},"results":null}});

Edit: Well, in fact a large part of providers are using YQL and so are no longer working.