AngularJS databinding through responsemessage not working as expected - html

Code is as follows
var myApp = angular.module("gameModule", []);
myApp.controller("gamecontroller", function ($scope) {
$scope.message = "test";
// websocket connection.
var gameHub = $.connection.socketHub;
$.connection.hub.start().done(function () {
var clientid = $.connection.hub.id;
$(function () {
var user = { signalrsessionid: clientid };
$.ajax({
type: "POST",
data: JSON.stringify(user),
url: "http://localhost:53629/api/game/signalr",
contentType: "application/json"
}).done(function (response) {
alert(response);
$scope.responsemessage = response;
});
});
});
});
and front end code
<!DOCTYPE html>
<html ng-app="gameModule">
<head>
<title>game registration</title>
<meta charset="utf-8" />
<script src="Scripts/jquery-1.10.2.js"></script>
<script src="Scripts/jquery.signalR-2.2.1.js"></script>
<script src="Scripts/angular.js"></script>
<!--Automatisch gegenereerde signalR hub script -->
<script src="signalr/hubs"></script>
<script src="Scripts/rouletteAngular.js"></script>
</head>
<body>
<div ng-controller="gamecontroller">
{{ message }}
{{ responsemessage }}
</div>
So the 'message' is being displayed, the alert box with the response is showing the correct response, but the responsemessage doesnt show any value.
Can anyone tell me what i'm doing wrong.

you must call $scope.$apply(); or $scope.$digest(); after setting $scope.responsemessage = response; because you are using jQuery ajax call, which is outside Angulars context.
EDIT:
here you have nice way to use SignalR in AngularJS:
http://henriquat.re/server-integration/signalr/integrateWithSignalRHubs.html

Related

Authenticating with Facebook Graph API & Parsing JSON Reviews from a Facebook Page

I am having trouble authenticating and parsing.
get Facebook Graph api page review
I have tried to submit the app for review and request manage_page access but I get an error:
"Invalid Scopes: manage_pages. This message is only shown to developers. Users of your app will ignore these permissions if present. Please read the documentation for valid permissions at: developers.facebook.com/docs/facebook-login/permissions" and possibly the API is deprecated
<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.1.2/css/bootstrap.min.css" integrity="sha384-Smlep5jCw/wG7hdkwQ/Z5nLIefveQRIY9nfy6xoR1uRYBtpZgI6339F5dgvm/e9B" crossorigin="anonymous">
<title>Ilan's Test</title>
</head>
<body>
<div class="container">
<div class="row">
<div class="col-lg-12">
<div id="results">
</div>
</div>
</div>
</div>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<script src="https://stackpath.bootstrapcdn.com/bootstrap/4.1.2/js/bootstrap.min.js" integrity="sha384-o+RDsa0aLu++PJvFqy8fFScvbHFLtbvScb8AjopnFD+iEQ7wo/CG0xlczd+2O/em" crossorigin="anonymous"></script>
<script>
var myurl = "http://graph.facebook.com/v3.3/FinancialSanityNow/ratings";
var getToken = function(req, res) {
var facebookToken = req.headers['facebooktoken'];
//TODO : check the expirationdate of facebooktoken
if(facebookToken) {
var path = 'https://graph.facebook.com/v3.3/FinancialSanityNow?access_token=' + facebookToken;
request(path, function (error, response, body) {
var facebookUserData = JSON.parse(body);
if (!error && response && response.statusCode && response.statusCode == 200) {
if(facebookUserData && facebookUserData.id) {
var accessToken = jsonWebToken.sign(facebookUserData, jwtSecret, {
//Set the expiration
expiresIn: 86400
});
res.status(200).send(accessToken);
} else {
res.status(403);
res.send('Access Forbidden');
}
}
else {
console.log(facebookUserData.error);
//console.log(response);
res.status(500);
res.send('Access Forbidden');
}
});
res.status(403);
res.send('Access Forbidden');
}
};
$.ajax({
url: myurl,
headers: {
'access_token':'xxxxxaccesstokenherexxxxx',
},
method: 'GET',
dataType: 'json',
success: function(data){
$.each(data.reviews, function(i, item) {
// Store each review object in a variable
var reviewdata = item.data.reviews;
// Append our result into our page
$('#results').append('test:' + reviewdata);
});
}
});
</script>
</body>
</html>
I just want to know if this is even possible through pages/ratings api from facebook
https://developers.facebook.com/docs/graph-api/reference/page/ratings/
Most permissions need review before you can use them. Without review, they will only work for users with a role in the App, and you need to keep the App in dev mode. If you put it live, unapproved permissions will not work at all.
Also, you have to use a Page Token of the Page in question to get reviews, you get a Page token by using the /me/accounts?fields=access_token endpoint, with a User Token that includes the manage_pages permission.
More information about Tokens: https://developers.facebook.com/docs/facebook-login/access-tokens/

HTML code to invoke Azure automation runbook webhook

Trying to invoke two webhooks that I've defined on a runbook in an azure automation account.
I can run the webhook through powershell, and it works, but i'm having trouble getting it to run. Below is the code i'm using
<HTML>
<TITLE>Jumpbox Power</TITLE>
<BODY>
<CENTER>
<SCRIPT>
function startjumpbox() {
var _url = 'https://s5events.azure-automation.net/webhooks?token=asdf;
return $.ajax({
type: 'post',
url: _url
})
};
function startjumpbox() {
var _url = 'https://s5events.azure-automation.net/webhooks?token=fdsa';
return $.ajax({
type: 'post',
url: _url
})
};
</SCRIPT>
Start / Stop jumpbox<br>
<button onclick="startjumpbox()">Start Jumpbox</button>
<button onclick="stopjumpbox()">Stop Jumpbox</button
</CENTER>
</BODY>
</HTML>
The idea is that when the first button is pressed, the 'startjumpbox' function is run, which generates a post request to the webhook URL. same goes for the second button and a post to the second webhook URL.
Would appreciate any advise.
Please use the code below. It works at my side, just reference the jquery lib(You can also download it to local and then reference it):
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
sample code:
<!DOCTYPE html>
<HTML>
<head>
<TITLE>Jumpbox Power</TITLE>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
</head>
<BODY>
<SCRIPT>
function startjumpbox() {
alert("start call 1")
var _url = 'https://s4events.azure-automation.net/webhooks?token=your_token';
$.ajax({
type: 'POST',
url: _url
});
alert("completed call 1")
}
function startjumpbox2() {
alert("start call 2")
var _url = 'https://s4events.azure-automation.net/webhooks?token=your_token';
$.ajax({
type: 'POST',
url: _url
});
alert("completed call 2")
}
</SCRIPT>
Start / Stop jumpbox<br>
<button onclick="startjumpbox()">Start Jumpbox</button>
<button onclick="startjumpbox2()">Start Jumpbox2</button>
</BODY>
</HTML>

html elements in the request parameter is not retrieved in the server side

My project have following structure.
The pages is in the html file. and server request is processed on Page_load in the other aspx page.
I created a sample application to show the error.
Here is the HTML file HTMLPage1.html
<!DOCTYPE html>
<html>
<head>
<title></title>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<script>
$(document).ready(function () {
var params = 'pak=' + encodeURIComponent('</br>');
debugger;
var url = 'http://localhost:49735/WebForm1.aspx?' + params;
$.ajax({
type: 'POST',
async: false,
url: url,
success: function (data) {
alert('Hi');
}
});
});
</script>
<meta charset="utf-8" />
Here is the PageLoad function in WebForm1.aspx.cs
protected void Page_Load(object sender, EventArgs e)
{
var authorize = Request["pak"];
int i = 0;
}
But Request["pak"] is not accessible. I should need to pass pak as </br>
If you want to call web by POST
You should set the data field
like this
$(document).ready(function () {
//var params = 'pak=' + encodeURIComponent('</br>');
debugger;
var url = 'http://localhost:49735/WebForm1.aspx';
$.ajax({
type: 'POST',
async: false,
data:{
pak : encodeURIComponent('</br>')
},
url: url,
success: function (data) {
alert('Hi');
}
});
});
encodeURIComponent('</br>') will encodeURL like "%3C%2Fbr%3E"
You can try to use HttpUtility.UrlDecode() to Decode
var authorize = HttpUtility.UrlDecode(Request["pak"].toString());
You will get </br>

Angularjs and Web Services

I make a web services which returns me a JSON formatted data when I use this url(http://localhost:8080/jerseyweb/crunchify/ftocservice). Now I want to get those data through Angular js but I can not get it. The code with which I try that is as follow:
<!DOCTYPE html>
<html>
<script src="http://ajax.googleapis.com/ajax/libs/angularjs/1.3.14/angular.min.js"></script>
<body>
<div ng-app="myApp" ng-controller="customersCtrl">
<ul>
<li ng-repeat="x in names">
{{ x.id + ', ' + x.name }}
</li>
</ul>
</div>
<script>
var app = angular.module('myApp', []);
app.controller('customersCtrl', function($scope, $http) {
alert("hi");
$http.get("http://localhost:8080/jerseyweb/crunchify/ftocservice")
.success(function (data, status, headers, config) {
alert("hiee"); // i can not reach at this alert
$scope.names = data;
});
});
</script>
</body>
</html>
The JSON data in http://localhost:8080/jerseyweb/crunchify/ftocservice is as following
[{"id":98.24,"name":36.8}]
There is an error in Web Services Response.....
#OPTIONS
#Path("/getsample")
public Response getOptions() {
return Response.ok()
.header("Access-Control-Allow-Origin", "*")
.header("Access-Control-Allow-Methods", "POST, GET, PUT, UPDATE, OPTIONS")
.header("Access-Control-Allow-Headers", "Content-Type, Accept, X-Requested-With")
.build();
}
Please try this code might be it's use full :
var response = $http({
method: "GET",
url: "http://localhost:8080/jerseyweb/crunchify/ftocservice",
dataType: "json"
});
response.then(function (obj) {
$scope.names = obj.data.name;
}, function () {
alert('Error.');
});
If data comes from the API in string format then use
var objdata = JSON.parse(obj.data);
$scope.names = objdata.name;

How to Get Data from remote Webservice using jquery

I have problem in binding data to a control in html page,here we have a web service in remote location as we are binding the data to a control(dropdown) in html the data is not binding the code for fine for localhost but for the remote url.here i'm placing code below can any one tell me any modifications or any code to be added to it.
<!DOCTYPE html>
<html>
<head>
<title></title>
<script src="Scripts/jquery-1.8.3.js" type="text/javascript"></script>
</head>
<body>
<select id="CbxArea" style="width: 200px">
<option>Select Area</option>
</select>
<script type="text/javascript">
$(document).ready(function () {
//debugger;
var requestUrl = 'http://192.168.3.252:8081/HaraveerWCF/ExcelDataService.asmx/GetAreaNames';
var ddlArea = $("#CbxArea");
$.ajax({
url: "http://192.168.3.252:8081/HaraveerWCF/ExcelDataService.asmx/GetAreaNames",
//url: "ExcelDataService.asmx/GetAreaNames",
type: "POST",
dataType: "json",
contentType: "application/json; encoding=utf-8",
success: function (data) {
debugger;
for (i = 0; i < data.d.length; i++) {
ddlArea.append($("<option></option>").val(data.d[i].AreaName).html(data.d[i].AreaName));
};
alert(data.d.AreaName);
},
error: function (e) {
$('#status').innerHTML = "Unavailable";
}
});
});
</script>
Thanks in Advance.