I'm currently working on a simple webcrawler that will show all of the links the given site has. For example, this is what I would like my program to do:
-you give it a url : http://www.example.com/
-then the program gets the html source and looks for all of the <a href=...></a>tags
-finally, all of the links are shown to the user
To do this, I am using simple javacsript with jQuery, and am currently stuck on a $.ajax() call:
$.ajax({
url:"http://example.com",
dataType : "jsonp",
crossDomain : true,
success : function(data){
console.log(data);
}
});
This throws Uncaught SyntaxError: Unexpected token < error and I don't know how to fix this.
Is this behavior actually possible? If it's not, how can web-browsers actually show source code of any site? And if this is not the right way of getting HTML source, what is the right way?
Thanks for your attention
You can set it up with php by creating a “proxy”. You can look it up on the web, but I recall it being something like:
PROXY.PHP
<?php
print file_get_contents($_POST[‘url’]);
?>
ON JQUERY
var yourURL = “your url here”;
$(“div”).load(“proxy.php?url=“+yourURL)
Feel free to ask for any doubt you may have
Hope it helps :D
Related
I am trying to finish one page of my website the last couple of hours while achieving the following.
While clicking on a button, the following should happen
Download link appears (done - works)
The mySQL table should be opened and a counter should be incremented
As far as I got the points. Javascript cannot handle that and thus we can use AJAX or jQuery. I was already checking out different posts and websites such as:
how to execute php code within javascript
https://www.w3schools.com/js/js_ajax_database.asp
and much more. However, I guess I do have problems with the AJAX syntax and I actually don't know if the requested php files is loaded/opened or not. Especially the second link given above is almost similar to what I am searching for. However, it does not work. To check if the php file is called, I set an alert which works if I do call the file explicitly in the browser. Maybe this does not work with AJAX as I expect it. Here the code to get more familiar with the inconstency I am doing.
The page code:
<?php
echo '<div><button onclick="incrementAndDownload('testPath', 'fileName'); ">Click me</button></div>';
?>
<script>
function incrementAndDownload (link, fileName)
{
$.ajax({
url: 'openfoam/increment.php',
success: function(data) {
// Print something if necessary
}
});
//- Open the link
// window.open(arguments[0], "_blank");
//- Increment download inside mysql
//var xhttp;
//xhttp = new XMLHttpRequest();
//xhttp.open("GET", "openfoam/increment.php?foo=nana", true);
//xhttp.send();
}
</script>
The increment.php looks as follows:
<?php
echo '<script type="text/javascript" language="Javascript">
alert("Test message if the script is called...");
</script>';
// Code for accessing the mysql database and manipulate the data
//$page_id = mysql_real_escape_string(html_entities($_POST['file']));
?>
Now when I click the button, the javascript is executed (e.g., if I uncomment the window.open) this works as expected. However, as already said, the second part is to open the database via php and increment a number (counter). For any reason, I am not able to figure out where the problem is located. I am even not sure if AJAX opens the increment.php file (the alert messages never appears so I guess it is never called). Any suggestion is appreciated and I hope that this question does not just contain a fundamental small error. Thank in advance, Tobi
It's not the way the AJAX works. If you call alert() on a destination page it won't show in your browser. Your case is very basic so I will keep my solution on a basic level.
In increment.php just echo something, it can be just OK string. So when you go to increment.php page you will see only OK, nothing more, nothing less.
Then go back to your javascript and check what is your response.
$.ajax({
url: 'openfoam/increment.php',
success: function(data) {
if (data == 'OK') {
console.log('It works, sir!');
}
}
});
If you don't see a message in a console after these modifications something doesn't work. However, I think your page is executed properly, but you just don't get feedback, because you don't handle the response (data param in your case).
Check it out and don't forget to give me a feedback!🤓
So I made a website that displays FPS information stored in a mysql database. For each second of gameplay I have a pair of number(fps)-image(screenshot).
I display the numbers in a line chart made with JavaScript. The behaviour desired is when I click on a bullet in the chart, the screenshot for that particular second is displayed in a div on the page.
I have to mention that the screenshots are stored in the database and they are very low in size. I display then using PHP like this:
$query = "SELECT `image` FROM `logs` WHERE `session_id`=".$_GET['session']." AND `second`=".$second;
$sth = $mysqli->query($query);
$result=mysqli_fetch_array($sth);
if (!empty($result))
echo ' <img id="screen" src="data:image/jpg;base64,'.base64_encode($result['image']).'"/>';
The method I'm using now is when I click on a bullet in the chart (action recorded in JS), I send it as a GET parameter and read it with PHP afterwards, like this:
window.location.href = url + "?second=" + second;
This method obviously will refresh my page. The problem is, the chart I made also has a zoom/scroll option and that resets whenever the page is refreshed, making the experience very bad for the user.
Is there any method to display the screenshots without refreshing the page, for this particular case (where I have to query the database for each click/picture)? Maybe there is a better way of approaching this problem?
Thanks.
I think you've got 2 solutions which are Ajax or Websocket depending your needs.
AJAX
Ajax permit to asynchronously, only when you need, call the server and get datas from an URL which could be a webservice or PHP page... Perhaps, it's the better solution in your case.
To make it easy, you can use JQuery library by donwloading the script and insert it in your HTML :
<script src="jquery-3.0.0.min.js"></script>
To call the server, using JQuery :
$.ajax({
url: url + "/yourphppage.php",
data: "parameter=" + yourOptionelParameter,
async: false,
success: function(data) {
refreshYourChart(data);
},
error: function() {
alert("Your error");
},
contentType: 'charset=utf-8'
});
Or if your prefer pure javascript.
Now, you just have to work on the presentation of your data, on the server side. It could be what you want HTML, TXT, JSON, XML...
Websocket
Websocket is like a permanent tunnel opened between your server and the client. Each side can ask or send datas in real time.
It seems to be a library server side :
http://socketo.me/
And client side, it's very easy :
Nice documentation on mozilla website
Hope it helps. Good luck.
To change a picture source, as I see the easiest way is using an ajax call, so you can send any kind of parameters to your server, and in return your will get your new picture source.
$.get('urlToYourServer.com?parameter=1', function(data){
$('#img').attr('src', data.imgSrc);
})
I am trying to replace all of my PHP with JS (Node and ajax (and jQuery library)) but am having trouble converting the following PHP script into an ajax engine.
<?php
$xmlDoc=new DOMDocument();
$xmlDoc->load("Administration/data/people.xml");
$xx=$xmlDoc->getElementsByTagName('person');
$hintt="";
for($ii=0; $ii<($xx->length); $ii++)
{
$yy=$xx->item($ii)->getElementsByTagName('id');
$zz=$xx->item($ii)->getElementsByTagName('fullName');
if ($yy->item(0)->nodeType==1)
{
echo "<button type='button' class='mybutton' name='users'>" .
$zz->item(0)->childNodes->item(0)->nodeValue . "</button>";
}
}
?>
Here is my ajax attempt:
<div id="loadMe">
<h1>Reading..</h1>
</div>
<script>
$.ajax({
type: "GET",
url: "Administration/data/people.xml",
dataType: "xml",
success: function(xml) {
$(xml).find('person').each(function(){
var fullName = $(this).attr('fullName');
$("<button type=button class=mybutton value='+fullName+'></button>").html("<h3>'+fullName+'</h3>").appendTo('#loadMe');
});
}
});
</script>
To me, it looks pretty similar, but the JS is not working. Anyone see an inconsistency or can tell me why my XML elements are not appending to the indicated div tag? Thanks a lot in advance guys and gals!
EDIT (1/24/14 1:24 AM):
I thought providing my XML would be helpful, perhaps I am referencing the data wrong?
<people>
<person>
<id>10</id>
<fullName>Philadelphia Collins</fullName>
<firstName>Philadelphia</firstName>
<lastName>Collins</lastName>
<age>62</age>
<hometown>Sunnyvale</hometown>
<job>Restraunt Owner</job>
</person>
<people>
I've set up a test page that you can try and play around with if at any time you need to do more exploring. So here comes the solution.
First, I tried doing an AJAX request, which always came back as failed because the XML was invalid. If I just tried to access the XML, it said it was not valid and could not be displayed. The issue was the closing <people> tag was missing a /. It should be </people>'. So that fixed the AJAX request failing. The next part was parsing the XML response. I did this by using the.children()method in jQuery and then getting the text of the element with.text()`. It ends up looking something like this:
var fullName = $(this).children('fullName').text();
So with all that and anything else I may have missed but is available at the test page, I hope you can fix your issue and get a successful AJAX request going. If I missed anything or I wasn't clear, let me know and I'll try to explain a little more.
By the way, doing console.log(); in Chrome DevTools and using breakpoints to access the data myself always helps me see what I'm working with, that way I know how to go about getting what data I want from a request.
Good luck!
I'm totally new on JavaScript and SharePoint.
What I am trying to do is to build a website that be able to connect SharePoint 2010 and query data from it using JavaScript. The website I am building is outside the SharePoint.
I searched a lot of questions and examples about this topic. But all of these confused me, a very very new programer. So please forgive me if you think I am asking silly questions, but those things really confuse new programer like me. I wish my question could also help others who is as fresh as I am.
Here comes my questions:
1) what method should I use
I found a lot of samples teaching how to query the List of SharePoint, e.g. using Client Object Model. Does it is applied to my case? I think that is for the SharePoint website programming, am I right? Because based on the sample I see, there is no any URL that link to the SharePoint Server I want to query.
Or using xmlhttp.open("POST", "http://[my SharePoint Sever]/_vti_bin/search.asmx", true) ...
2) what is right URL of the SharePoint Server and its List
According to my understanding, in my codes, I should first link to the right SharePoint ( or the specific List). so there should be a URL of the SP. I don't think opening the SharePoint List and do copy paste the Address is the right. how to get the right URL and how to alter it (like adding _vti_bin/search.asmx at the end of URL)
3) what is the right query format
when I try to right my own query. too many different format of query examples confused me a lot.
soapEnvelope = "<?xml version=\"1.0\"?> \
<soap:Envelope xmlns:soap=\"http://schemas.xmlsoap.org/soap/envelope/\" \
...
and some looks like this,
var soapEnv =
'<?xml version="1.0" encoding="utf-8"?>' +
'<soap12:Envelope xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"' +
...
4) any reference should I quote to make my codes work
should I use Qjuery, XML, or Ajax? What's the connection and how to use them? (sorry about this unclear question, not sure what to ask specifically )
I'm sorta embraced about my un-mature questions. I really need to figure it out somehow....
I will appreciate it a lot if you could give me a full example including and . So I could have a better idea of where is the right place to put my coding.
Thank you so so so much!!!!
There is an open source library created for Sharepoint 2010, code name Camelot. You can find more information here:
http://camelotjson.codeplex.com/
This is a code sample from the link above:
Javscript:
// Build the command
var command = {
Type: "SELECT",
List: "Tasks"
}
var result;
// Send the command using JQUERY
$.ajax({
type: "GET",
contentType: "application/json",
data: { command: JSON.stringify(command)},
url: "/_vti_bin/Camelot.JSONAPI/jsonapi.svc/Items",
success: function (data) {
// Decode and store the result in a variable
result = $.parseJSON(data.d);
console.log("Successfully executed the command, please check the 'result' variable.");
},
error: function (xhr, textStatus, errorThrown) {
console.log(errorThrown);
}
});
You probably want to look at SPService or at the library I created: SharepointPlus.
I think SharepointPlus is really easy to use. For example if you want to query a list to get the data you'll do something like:
$SP().list("Name of your list").get({fields:"First_x0020_Field,OtherField", where:"OtherField = 'something'"}, function(data) {
for (var i=data.length; i--;) console.log(data[i].getAttribute("First_x0020_Field"))
})
Check the SharepointPlus website, it's full of examples. I think it's what you're looking for :-)
I have problems when saving html5 data from a page into mysql through an ajax request and trying to retrieve it back with ajax. HTML attributes that trigger some javascript such as
<onload> or <iframe> will be stored as <on<x>load> and <if<x>rame> in the database and thus screw up the page when loading it.
Here's a short description of what I am trying to accomplish: I want registered users to have the ability to highlight text on my site and get the highlighted text back after refreshing the page, relogging etc.
What I have done so far: I implemented a javascript highlight library on my server that allows users to highlight text. That works well.
By clicking a button, those data are then saved into mysql through jquery ajax post. See specific code here:
Javascript
$(document).ready(function() {
//saves highlighted data in var "highlighted"
$('#savehighlights').click(function() {
var highlighted = $('.tabcontent.content1').html();
//send data to server
$.ajax({
url: 'highlight.php',
type: 'POST',
data: {highlighted: highlighted},
dataType: 'html',
success: function(result) {
console.log(result);
}
});
});
Saving the data to mysql works generally, but it looks as if certain commands are disabled through the process (e.g. onload becomes on<x>load5). The data are stored in the database as longtext and utf8_bin. I also tried blob, but problem remains. I also tried different dataTypes with Ajax such as 'text' and 'script'. 'Text' causes the same problem and 'script doesn't work at all. I also tried the ajax .serialize function, but no luck either.
I really don't know what to do about it and I am not sure what is causing the problem, Ajax or mysql? I was searching the web for an answer, including many articles in stackoverflow (which normally always give me the answer), but this time I am stuck. Either I don't know enough about it to look for the right question, or I just don't have any luck this time. So, any help would be greatly appreciated.
I was requested to add some more information. Here it is:
I am actually doing this on my local server (localhost) with XAMP, so security issues should not be a problem, right? If it is of any help, I am doing this in a Tiki Wiki CMS. The php script that is called through ajax (highlight.php) is the following:
require_once ('tiki-setup.php');
include_once ('lib/highlights/highlightslib.php');
$highlighted = $_POST['highlighted'];
$highlightslib->save_highlights($user, $highlighted);
The highlightslib library is here:
if (strpos($_SERVER["SCRIPT_NAME"], basename(__FILE__)) !== false) {
header("location: index.php");
exit;
}
class HighlightsLib extends TikiLib
{
function save_highlights($user, $highlighted) {
$saveHighlights = $this->table('tiki_user_highlights');
$saveHighlights->insert
(array(
'user' =>$user,
'highlightId' =>'',
'data' =>$highlighted,
'created' =>$this->now,
)
);
return true;
}
};
$highlightslib = new HighlightsLib;