I am working on api of a script i recently coded.
on browser the output of the file is working fine see here : http://www.lilink.it/api.php?u=http://www.designzzz.com/&method=get_short_url
but if i do the calling on client side it returns empty. here is the code for client side :
<script type="text/javascript">
$(document).ready(function() {
// method 1
$.get('http://lilink.it/api.php', {method: 'get_short_url', u: 'http://www.blastingart.com/ayaz-malik'},
function(data){
alert(data.status + data.res);
}, "json"
);
// method 2
$.getJSON('http://lilink.it/api.php?method=get_short_url&u=http://www.blastingart.com/ayaz-malik', function(data) {
if (data.status == 1) {
alert(data.status + data.res);
}
});
});
</script>
Probably, you are trying to make a cross-domain request. Cross domain requests are denied in modern web browsers for security reasons. But it's possible to implement them using special techniques. See:
http://usejquery.com/posts/the-jquery-cross-domain-ajax-guide
You probably have problem about the Same Origin Policy: more info here
Related
I'm developing a website that supports desktop notifications. I'm utilizing GCM and Azure Notification Hub to send push messages to end users. I followed this codelab tutorial. When testing I have found that the push notifications do get displayed on the screen, but the message that I have written in the payload is not shown in the notification. So I again went through the codelab, and they have mentioned a body key in the showNotification method.
Code
self.addEventListener('push', function(event) {
console.log('Push message', event);
var title = 'Push message';
event.waitUntil(
self.registration.showNotification(title, {
body: 'The Message',
icon: 'images/icon.png',
tag: 'my-tag'
}));
});
They have hardcoded "The Message" in the showNotification function. I don't want to hardcode my message in the function since my message won't be the same always and will vary time to time. I want to know how to make the function take the message in payload and display it. Thanks in advance!
Chrome doesn't support push payloads yet, for now you could use them only in Firefox.
The solution is to request the payload from the server (using fetch) once you get a notification.
Something like this:
self.addEventListener('push', function(event) {
event.waitUntil(
fetch('./getPayload?someUniqueID=' + someUniqueID)
.then(function(response) {
return response.text();
})
.then(function(payload) {
self.registration.showNotification('Title', {
body: payload,
});
})
);
});
Obviously, the response can also be in JSON, so that you can specify everything (title, body, icon, etc.).
You can see an example here: https://serviceworke.rs/push-get-payload.html.
Another possible solution is to use the payload when it's available and use fetch otherwise. This way you can take advantage of the feature in Firefox (and in Chrome once available), and have a fallback for browsers that don't support payloads yet.
There's an example in Mercurius.
I am hosting an html page on localhost:8888 with a MAMP Server and I am trying to get some data from a JSON file which I am hosting on localhost:3000 on the 'categories' route. Firstly, I wanted to know is this possible ?
If it is not possible, is it possible for me to route the JSON data to another site. If it is possible, here is the script I have embedded in my HTML
<script>
$(document).ready(function(){
setInterval(test,500);
console.log("document ready");
alert('page ready');
});
function test() {
$.ajax({
url:"HTTP://localhost:3000/categories",
dataType: 'jsonp',
success: function(json){
$("#Address1").html(json[0]["id"]);;
}
});
}
</script>
Here is the JSON file :
[{"_id":"5624711f1a530785d511e747","__v":0,"name":"Beverages","description":"Soft drinks, coffees, teas, beers, and ales","created":"2015-10-19T04:27:11.649Z"}]
Currently, It doesn't display any data. I have tried pure JS instead of jquery but it doesn't help.
This is what I got in the Chrome Console : GET localhost:3000/categories?callback=jQuery1113012827125121839345_1445236000644&_=1445236000645 net::ERR_UNKNOWN_URL_SCHEME
Added http:// - does not make a difference
im trying to pull data from drupal 7 website from a local files inside
http://example.com:8888/test/test.html
im using this Ajax code with html request since i have tried json and also the website prevents me from pulling even i have added
<?php
header('Access-Control-Allow-Origin: *');
?>
code to pull the data , but no result:
$.ajax(
{
// The link we are accessing.
url: "http://horizon-websolutions.com",
// The type of request.
type: "get",
// The type of data that is getting returned.
dataType: "html",
error: function(){
alert("error");
// Load the content in to the page.
$("#output").html( "<p>Page Not Found!!</p>" );
},
beforeSend: function(){
alert("not yet"); },
complete: function(){
alert("done"); },
success: function( strData ){
alert("success");
// Load the content in to the page.
$("#output").html( strData );
}
}
);
// Prevent default click.
return( false );
please help my telling the website accept my localhost request to pull data from the server . the same code tested on a pure php page and its working fine .
Not sure how secure this would be but one way to solve it is to enable CORS.
For Drupal 7 (would be analogous to Drupal 6) so you need to download and install the CORS module,
enable the module under Modules,
go to the Drupal config (Configuration on Drupal 7 main dashboard top navigator),
search for CORS. Click,
give the path for the links you wish to access. Examples are given on that page of how to put in new links.
Hope this helps.
I have searched many times and find examples which match my code structure perfect. Yet I am not getting the results from my ajax to display on the input box.
I get results from the POST that have been evaulated with firebug and everything looks great.
Here is the javascript im using.
<script type="text/javascript" language="javascript">
$(function () {
$("input.FamousPerson-List").autocomplete({
source: function (request, response) {
$.ajax({
url: "/FamousPeople/FPPAutoComplete",
type: "POST",
dataType: "json",
data: {
searchText: request.term,
maxResults: 12
},
success: function (data) {
response($.map(data, function (item) {
return {
value: item.DisplayName
}
}))
}
});
}
});
});
Here is a link of the actual code I am using on the web.AutoCompleteTesting Type just about any letter in one of the boxes below to invoke it.
Thanks.
If you look closely at the request being sent up, you'll notice that a callback parameter is being added. Weird, right? Since you're doing a local AJAX post, not a cross-domain (JSONP) one.
I noticed that your project includes jQuery Validate. According to this answer to a question dealing with a similar problem (performing a JSONP request instead of a normal JSON request even though you asked for one), it's a known issue in jQuery validate.
Judging by the other answer, you can change your version of jQuery or perhaps use a patched version of jQuery validate (found here).
I need to do a cross-domain request in a chrome extension. I know I can it via message passing but I'd rather stick to just jQuery idioms (so my javascript can also work as a <script src="">).
I do the normal:
$.getJSON("http://api.flickr.com/services/feeds/photos_public.gne?tags=cat&tagmode=any&format=json&jsoncallback=?", function(data) {
console.log(data);
});
but in the error console I see:
Uncaught ReferenceError: jsonp1271044791817 is not defined
Is jQuery not inserting the callback function correctly into the document? What can I do to make this work?
(If I paste the code into a chrome console, it works fine, but if I put it as the page.js in an extension is when the problem appears.)
Alas, none of these worked, so I ended up doing the communication via the background.html.
background.html
<script src="http://code.jquery.com/jquery-1.4.2.js"></script>
<script>
function onRequest(request, sender, callback) {
if (request.action == 'getJSON') {
$.getJSON(request.url, callback);
}
}
chrome.extension.onRequest.addListener(onRequest);
</script>
javascripts/page.js
chrome_getJSON = function(url, callback) {
console.log("sending RPC");
chrome.extension.sendRequest({action:'getJSON',url:url}, callback);
}
$(function(){
// use chrome_getJSON instead of $.getJSON
});
If you specify "api.flickr.com" in your manifest.json file you will not need to use the JSONP callback, script injection style of cross domain request.
For example:
"permissions": ["http://api.flickr.com"],
This should work beautifully in you code. I would remove the querystring parameter "&jsoncallback" as there is no JSONP work needed.
The reason why your current code is not working is your code is injecting into pages DOM, content scripts have access to the DOM but no access to javascript context, so there is no method to call on callback.
My impressions it that this fails because the jQuery callback function is being created within the 'isolated world' of the Chrome extension and is inaccessible when the response comes back:
http://code.google.com/chrome/extensions/content_scripts.html#execution-environment
I'm using Prototype and jQuery for various reasons, but my quick fix should be easy to parse:
// Add the callback function to the page
s = new Element('script').update("function boom(e){console.log(e);}");
$$('body')[0].insert(s);
// Tell jQuery which method to call in the response
function shrink_link(oldLink, callback){
jQuery.ajax({
type: "POST",
url: "http://api.awe.sm/url.json",
data: {
v: 3,
url: oldLink,
key: "5c8b1a212434c2153c2f2c2f2c765a36140add243bf6eae876345f8fd11045d9",
tool: "mKU7uN",
channel: "twitter"
},
dataType: "jsonp",
jsonpCallback: callback
});
}
// And make it so.
shrink_link('http://www.google.com', "boom");
Alternatively you can try using the extension XHR capability:
http://code.google.com/chrome/extensions/xhr.html
var xhr = new XMLHttpRequest();
xhr.open("GET", "http://api.example.com/data.json", true);
xhr.onreadystatechange = function() {
if (xhr.readyState == 4) {
// JSON.parse does not evaluate the attacker's scripts.
var resp = JSON.parse(xhr.responseText);
}
}
xhr.send();
The syntax is a little off. There's no need for the callback( bit. This works flawlessly. Tested in the javascript console of Chrome on this StackOverflow page (which includes jQuery):
$.getJSON("http://api.flickr.com/services/feeds/photos_public.gne?tags=cat&tagmode=any&format=json&jsoncallback=?", function(data) {
console.log(data);
});
As many of you will know, Google Chrome doesn't support any of the handy GM_ functions at the moment.
As such, it is impossible to do cross site AJAX requests due to various sandbox restrictions (even using great tools like James Padolsey's Cross Domain Request Script)
I needed a way for users to know when my Greasemonkey script had been updated in Chrome (since Chrome doesn't do that either...). I came up with a solution which is documented here (and in use in my Lighthouse++ script) and worth a read for those of you wanting to version check your scripts:
http://blog.bandit.co.nz/post/1048347342/version-check-chrome-greasemonkey-script