How to find an image and get path in twig generated content - php

I am a newbie to PHP Symfony and Twig. I need to dynamically set meta property og:image from the post content, if there is an image. I have a twig code like this.
<div class="content">
{{ d.description|raw }}
</div>
I can and get an image url from the div content if any and set it as a meta property og:image by using javascript but Facebook does not parse JavaScript? Is there a way to do this on server side?

Facebook indeed only reads the source code of the page, so you won't be able to js your way out of it, you have to rely on server side.
You'd have to process the content, in the controller, by using a DOM parser (you can use PHP's own DOMDocument class https://www.php.net/manual/en/class.domdocument.php) and search for an img node (or lack thereof, in case you'll need to provide a default value)
Once you have found the url of the src of the image (user provided or default), pass this as a variable to the view and echo it inside the appropriate meta tag.
Do not forget to print the full path of the image, including the domain and protocol as Facebook now requires it.

Related

Browsers are changing html markup. How force all browsers to use native markup?

I have a problem and hope someone can help me.
I use iframe with src="http://my.own.domain/some/path/file-1";
This url send me a content from "http://some-site.com/path1/path2/path3/qwerty.html";
But before sending the content I am pre-proccessing links and resources.
For example if css <link rel="/css/style1">, I add protocol and host to it and makes something like <link rel="http://some-site.com/css/style1">
After what I'm clicking on some page element and read current node information by js ( name and attributes of current node, name and attributes of parent node and goes up till I see html tag).
This data I send to php script using ajax.
Using php I convert it to XPath selector and see that my selector is incorrect.
//html
/body[0]
/div[#id='wrap']
/div[#id='main']
/table[contains(#class, 'content-wrapper')][1]
/tbody[1]
/tr[1]
/td[contains(#class, 'content-wrap')][1]
/div[contains(#class, 'content')][1]
/div[contains(#class, 'node')][1]
/div[contains(#class, 'techs')][1]
/table[1]
/tbody[1]
/tr[4]
/td[contains(#class, 'techs-right')][1]
But native markup of that page is:
//html
/body[0]
/div[#id='wrap']
/div[#id='main']
/table[contains(#class, 'content-wrapper')][1]
/*/tbody[1] - without this*/
/tr[1]
/td[contains(#class, 'content-wrap')][1]
/div[contains(#class, 'content')][1]
/div[contains(#class, 'node')][1]
/div[contains(#class, 'techs')][1]
/table[1]
/*/tbody[1] - without this*/
/tr[4]
/td[contains(#class, 'techs-right')][1]
It seems like browser is modifying incorrect markup and makes it correct.. But this is a hitch for me. How to turn this off?

i want to get data from another website and display it on mine but with my style.css

So my school has this very annoying way to view my rooster.
you have to bypass 5 links to get to my rooster.
this is the link for my class (it updates weekly without changing the link)
https://webuntis.a12.nl/WebUntis/?school=roc%20a12#Timetable?type=1&departmentId=0&id=2147
i want to display the content from that page on my website but with my
own stylesheet.
i don't mean this:
<?php
$homepage = file_get_contents('http://www.example.com/');
echo $homepage;
?>
or an iframe....
I think this can be better done using jquery and ajax. You can get jquery to load the target page, use selectors to strip out what you need, then attach it to your document tree. You should then be able to style it anyway you like.
I would recommend you to use the cURL library: http://www.php.net/manual/en/curl.examples.php
But you have to extract part of the page you want to display, because you will get the whole HTML document.
You'd probably read the whole page into a string variable (using file_get_contents like you mentioned for example) and parse the content, here you have some possibilities:
Regular expressions
Walking the DOM tree (eg. using PHPs DOMDocument classes)
After that, you'd most likely replace all the style="..." or class="..." information with your own.

Dynamically create elements from unrendered code using jquery and/or php

I want to store html that isn't to be rendered until needed either within a tag that can hold raw html code without rendering it on page load or store it within a php or jquery variable for later use. I then want to be able to insert the html into the DOM on button click and have it render.
I've tried storing it within an xmp tag as that can store html code with the < and > characters without using character codes for them, but when trying to insert it into the DOM, the updated source shows it had been copied but it wouldn't render on screen. Also tried storing it within a code tag, which worked on a desktop browser but not in mobile safari. Since this is a webapp mobile browser compatibility is important.
Anyone know of a good method of doing this?
Try <script> tags with a type of text/plain or text/html:
<script type="text/plain" id="example">
<div class="example">
<h2>Hello</h2>
<p>World</p>
</div>
</script>
$(".button").click(function () {
var html = $("#example").text();
$("#destination").html(html);
});
It depends on where do you want to generate the content in question. If it's easier for you setup to generate it on the server side, you can use css to hide those parts (like display:none) and just remove the css property or grab the nodes with javascript and put them elsewhere with something like this:
$('.target').html($('.hidden_node').html());
If you want to generate the content on the js side, you can build it as a long string and just shove it into the target, or you can use jquery's node generation syntax like:
$('<div />').attr({
class: 'test'
}).appendTo("body");
Or you can use one of the various javascript templating solutions like mustache or handlebars.

Return and embed image with pure javascript , like php?

I'm having trouble figuring out if it's possible to embed an html or js document as an image, like so:
<img src="http://blah.com/image.js" />
or
<img src="http://blah.com/image.html" />
The general idea being that when the browser tries to access the file, it would execute the file clientside and get the actual image, and would then embed it as usual. I realize this can be done easily with PHP, but I'm looking for a non-server solution.
Problems being the content type it transfers as is wrong, and more importantly I think this violates every crossdomain and sandbox rule, to which I don't think there's any way around.
As long as the document you are linking to can display the binary data this will work.
Follow this article to solve the binary load with javascript, http://emilsblog.lerch.org/2009/07/javascript-hacks-using-xhr-to-load.html
Then you can also include base64 data in img tags like this
<img src="data:image/png;base64,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" />
The src attribute must point to a URI that eventually results in actual image data. Perhaps you should consider leaving it blank and then creating a script that generates a data: URI and replaces it into the attribute.

how to extract all image urls from a html source and download them using curl?

I am using curl to get the images from html source code of an external webpage. I am getting img original='imageurl' on view page source in Firefox. But when i select the particular images then it shows img src='imageurl' on view selection source in in Firefox.
How can I get this type of image using curl?
Currently I am using regex to get the image:
preg_match_all('/<img[^>]+>/i',$output, $result);
print_r($result);
But it doesn't display any image.
I am very confused about what to do here. Anyone have any thoughts?
I am very confused about what to do here.
The confusion probably results from that you use your webbrowser to view the source of an URL. Even if it's often the case that the source of the page displayed by the webbrowser is the data that curl would return as well, this is not always the case.
Especially the Firefox feature view selection source will not display that selection from the original resource, but often something else. To prevent that, you need to disable javascript in your Firefox browser­Docs. Because often documents are modified with javascript and you want to see the original, not the modification because curl is not able to run javascript, it can only get "the original".
Anyone have any thoughts?
Disable javascript in your browser.
Reload the page.
Locate the fragment of the HTML-source-code you're interested in.
Write it down, e.g. into a string.
Request the page with CURL. Output the source.
Locate that string in there. If it's not in there, search the curl request result for the string you're interested and use that instead.
Write a regular expression that is able to obtain what you need from that string.
Use that regular expression in your program then.
Your web browser is reformatting the HTML according to how it understands/parses the HTML page.
When you choose "View Page Source" it shows you the original source code served from the server.
When you select content and choose "View Selection Source" it shows what the browser has parsed into DOM (what the browser understands) for the selected content.
I am guessing you're using Firefox
If you are attempting to use cURL to process the HTML served from the server, you must not look at "View Selection Source" of the page, always refer to "View Page Source"..
Ultimately
You should rather refer to the ACTUAL result from cURL
For example:
$content = curl_exec($ch);
header("Content-type: text/plain");
echo $content;
That should echo exactly what cURL has received from the server...
NOTE: This is a re-post of https://stackoverflow.com/questions/8754844/can-not-get-images-using-curl
Furthermore
If you want to fetch the actual image inside a <img src=""> tag then you need to pin-point the IMG tag in the result HTML response using preg_match, and do a seperate cURL request to the IMG SRC

Categories