Since today, our application that uses the linkedin javascript SDK to authenticate users stopped working.
We realized that the call to https://platform.linkedin.com/in.js now redirects to https://platform.linkedin.com/xdoor/scripts/in.js.
Consequently, calls to IN.User.Authorize(callbackFunction) successfully opens the authentication dialog window but the callback is never fired anymore.
Also, in another part of our application we are using the IN.UI.Authorize.place().onWindowRemove.subscribe(callbackFunction) to track dialog closes. This feature has also stopped wording and now opens a new window with the url invalid:// and the console throws this error:
jSecure Error: URL should be absolute with allowed schemas, relative, a hash fragment or query string. TODO?client_id=XXXX&type=user-agent in.js:7
jSecure Error: URL should be absolute with allowed schemas, relative, a hash fragment or query string. invalid://?xdOrigin=https%3A%2F%2FXXX-XXX&xdChannel=XXXX&xd_origin_host=https%3A%2F%2FXXXX.XXXX in.js:7
jSecure Error: URL should be absolute with allowed schemas, relative, a hash fragment or query string. TODO?client_id=XXXX&type=user-agent
Do you have an idea on why this stopped working ?
EDIT: Bug reappeared as of 2019 01 28.
Try replacing window.IN.User.authorize with window.IN.user.authorize
window.IN.user.authorize is returning a promise and success callback is executed post login success. Its weird but working if we replace User with user
window.IN.user.authorize().then(function(data){
console.log("Logged in successfully .");
window.IN.API.Raw("/people/~:(id,first-name,last-name,formatted-name,headline,location,industry,current-share,num-connections,num-connections-capped,summary,specialties,positions,picture-url,site-standard-profile-request,api-standard-profile-request,public-profile-url,email-address)").method("GET").body().result(function (oData) {
that.props.dispatch(userCreation(linkedInProfileFormat(oData)));
});
},function(error){
alert("Linkedin failed because of harshita !");
});
Try this code. I did some changes and working fine for me. need to replace window.IN.User.authorize() TO window.IN.user.authorize()
<script type="text/javascript" src="//platform.linkedin.com/in.js">
api_key: XXXXXXXXX
authorize: true
</script>
<script type="text/javascript">
function liAuth(){
window.IN.user.authorize().then(function(){
getProfileData();
});
}
function setLoginBadge(profile) {
if (!profile) {
profHTML = "<p>You are not logged in</p>";
}
document.getElementById("given_name").value = profile.firstName;
document.getElementById("family_name").value = profile.lastName;
document.getElementById("email").value = profile.emailAddress;
document.getElementById("verifyOauthRequestLinkedIn").submit();
}
function onError(error) {
console.log(error);
}
function getProfileData() {
IN.API.Profile("me")
.fields(["id", "firstName", "lastName", "pictureUrl", "publicProfileUrl","email-address","headline"])
.result(function(result) {
setLoginBadge(result.values[0]);
})
.error(onError);
}
</script>
<img onclick="liAuth()" src="/images/linkedIn.png">
Related
Since today, our application that uses the linkedin javascript SDK to authenticate users stopped working.
We realized that the call to https://platform.linkedin.com/in.js now redirects to https://platform.linkedin.com/xdoor/scripts/in.js.
Consequently, calls to IN.User.Authorize(callbackFunction) successfully opens the authentication dialog window but the callback is never fired anymore.
Also, in another part of our application we are using the IN.UI.Authorize.place().onWindowRemove.subscribe(callbackFunction) to track dialog closes. This feature has also stopped wording and now opens a new window with the url invalid:// and the console throws this error:
jSecure Error: URL should be absolute with allowed schemas, relative, a hash fragment or query string. TODO?client_id=XXXX&type=user-agent in.js:7
jSecure Error: URL should be absolute with allowed schemas, relative, a hash fragment or query string. invalid://?xdOrigin=https%3A%2F%2FXXX-XXX&xdChannel=XXXX&xd_origin_host=https%3A%2F%2FXXXX.XXXX in.js:7
jSecure Error: URL should be absolute with allowed schemas, relative, a hash fragment or query string. TODO?client_id=XXXX&type=user-agent
Do you have an idea on why this stopped working ?
EDIT: Bug reappeared as of 2019 01 28.
Try replacing window.IN.User.authorize with window.IN.user.authorize
window.IN.user.authorize is returning a promise and success callback is executed post login success. Its weird but working if we replace User with user
window.IN.user.authorize().then(function(data){
console.log("Logged in successfully .");
window.IN.API.Raw("/people/~:(id,first-name,last-name,formatted-name,headline,location,industry,current-share,num-connections,num-connections-capped,summary,specialties,positions,picture-url,site-standard-profile-request,api-standard-profile-request,public-profile-url,email-address)").method("GET").body().result(function (oData) {
that.props.dispatch(userCreation(linkedInProfileFormat(oData)));
});
},function(error){
alert("Linkedin failed because of harshita !");
});
Try this code. I did some changes and working fine for me. need to replace window.IN.User.authorize() TO window.IN.user.authorize()
<script type="text/javascript" src="//platform.linkedin.com/in.js">
api_key: XXXXXXXXX
authorize: true
</script>
<script type="text/javascript">
function liAuth(){
window.IN.user.authorize().then(function(){
getProfileData();
});
}
function setLoginBadge(profile) {
if (!profile) {
profHTML = "<p>You are not logged in</p>";
}
document.getElementById("given_name").value = profile.firstName;
document.getElementById("family_name").value = profile.lastName;
document.getElementById("email").value = profile.emailAddress;
document.getElementById("verifyOauthRequestLinkedIn").submit();
}
function onError(error) {
console.log(error);
}
function getProfileData() {
IN.API.Profile("me")
.fields(["id", "firstName", "lastName", "pictureUrl", "publicProfileUrl","email-address","headline"])
.result(function(result) {
setLoginBadge(result.values[0]);
})
.error(onError);
}
</script>
<img onclick="liAuth()" src="/images/linkedIn.png">
I don't know why, the logout button in my Meteor App often fails to callback. the code is simple:
$scope.logout = function () {
Accounts.logout(function () {
// the code often fails to come here
$state.go('login');
});
}
maybe the network's problem? so I added some code to ensure my logout button won't look like frozen:
$scope.logout = function () {
Accounts.logout(function () {
// the code often fails to come here
$state.go('login');
});
$timeout(function () {
$state.go('login');
}, 2000);
}
The redirection to login page succeeded, but because Meteor.userId() still have value, the login page still shows the App user someone is logged on.
I want to know if there is a way to delete Meteor.userId / Meteor.user family even when failed connecting to the server.
I know it is not a complete solution, the App user will probably failed to do the next login at that state, but at least they won't complain the App even cannot logout.
The function you're looking for is Meteor.logout() not Accounts.logout()
I had used the following script to integrate google authentication
//google auth code
gapi.load('auth2', function() {//load in the auth2 api's, without it gapi.auth2 will be undefined
gapi.auth2.init(
{
client_id: '1063305095705-k68gpfhi46tbu6kv8e8tidc751hte5pb.apps.googleusercontent.com'
}
);
var GoogleAuth = gapi.auth2.getAuthInstance();//get's a GoogleAuth instance with your client-id, needs to be called after gapi.auth2.init
$scope.onLogInButtonClick=function(){//add a function to the controller so ng-click can bind to it
GoogleAuth.signIn().then(function(response){//request to sign in
console.log(response);
console.log(response.wc.wc);
console.log(response.wc.hg);
console.log(response.wc.Ph);
});
};
});
I am trying to use this in some other application and getting the following error :-
gapi.auth2.ExternallyVisibleError: gapi.auth2 has been initialized with
different options. Consider calling gapi.auth2.getAuthInstance()
instead of gapi.auth2.init().
I've also included
<script src="https://apis.google.com/js/platform.js?key=xxxxxxxxx"></script>
Everything seems to be fine, don't understand why it does not work..
Next code should help:
I have been spent two hours of solving this and because I was receiving the same error, I decided to use onLoad function with custom google sign in button.
Some points, that are probably neccessary if we do not want get profile info from users...
use onload function as in code below, when using defer async method:
https://apis.google.com/js/platform.js?onload=onLoadCallback
make your own sign in button with click event on signIn function
<a onclick="signIn();">Google Sign In</a>
Full solution is here:
<script src="https://apis.google.com/js/platform.js?onload=onLoadCallback" async defer></script>
<meta name="google-signin-client_id" content="YOUR_ID.apps.googleusercontent.com"/>
<!-- I have commented default google sign in button because it didn't allow me to make my own gapi.load -->
<!--<div class="g-signin2" data-onsuccess="ConSignIn"></div>-->
<a onclick="signIn();">Google Sign In</a>
<script>
function onLoadCallback() {
console.log('onLoadCallback');
gapi.load('auth2', function() {
gapi.auth2.init({
client_id: 'YOUR_ID.apps.googleusercontent.com',
//This two lines are important not to get profile info from your users
fetch_basic_profile: false,
scope: 'email'
});
});
}
function signIn() {
console.log('I am passing signIn')
var auth2 = gapi.auth2.getAuthInstance();
// Sign the user in, and then retrieve their ID.
auth2.signIn().then(function() {
console.log(auth2.currentUser.get().getId());
});
}
</script>
I have run into an issue recently where we have been told to remove the hash symbols from our Backbone applications. This presents two problems: (a) the ASP.NET routes need to handle any remotely linked URL (currently this is no problem with the hash symbols) so that we're not hitting a 404 error and (b) the proper route needs to be preserved and passed on to the client side (Backbone) application. We're currently using ASP.NET MVC5 and Web API 2 for our backend.
The setup
For an example (and test project), I've created a test project with Backbone - a simple C# ASP.NET MVC5 Web Application. It is pretty simple (here is a copy of the index.cshtml file, please ignore what is commented out as they'll be explained next):
<script type="text/javascript">
$(document).ready(function(event) {
Backbone.history.start({
//pushState: true,
//root: "/Home/Index/"
});
var Route = Backbone.Router.extend({
routes: {
"test/:id": function (event) {
$(".row").html("Hello, " + event);
},
"help": function () {
alert("help!");
}
}
});
var appRouter = new Route();
//appRouter.navigate("/test/sometext", { trigger: true });
//appRouter.navigate("/help", { trigger: true });
});
</script>
<div class="jumbotron">
<h3>Backbone PushState Test</h3>
</div>
<div class="row"></div>
Now, without pushState enabled I have no issue remote linking to this route, ie http://localhost/Home/Index#test/sometext
The result of which is that the div with a class of .row is now "Hello, sometext".
The problem
Enabling pushState will allow us to replace that pesky # in the URL with a /, ie: http://localhost/Home/Index/test/sometext. We can use the Backbone method of router.navigate("url", true); (as well as other methods) to use adjust the URL manually. However, this does not solve the problem of remote linking. So, when trying to access http://localhost/Home/Index/test/sample you just end up with the typical 404.0 error served by IIS. so, I assume that it is handled in in the RouteConfig.cs file - inside, I add a "CatchAll" route:
routes.MapRoute(
name: "CatchAll",
url: "{*clientRoute}",
defaults: new { controller = "Home", action = "Index" }
);
I also uncomment out the pushState and root attributes in the Backbone.history.start(); method:
Backbone.history.start({
pushState: true,
root: "/Home/Index/"
});
var Route = Backbone.Router.extend({
routes: {
"test/:id": function (event) {
$(".row").html("Hello, " + event);
},
"help": function () {
alert("help!");
}
}
});
var appRouter = new Route();
//appRouter.navigate("/test/sometext", { trigger: true });
//appRouter.navigate("/help", { trigger: true });
This allows me to at least let get past the 404.0 page when linking to these routes - which is good. However, none of the routes actually "trigger" when I head to them. After attempting to debug them in Chrome, Firefox, and IE11 I notice that none of the events fire. However, if I manually navigate to them using appRouter.navigate("/help", { trigger: true }); the routes are caught and events fired.
I'm at a loss at this point as to where I should start troubleshooting next. I've placed my Javascript inside of the $(document).ready() event as well as the window.onload event also (as well as not inside of an event); none of these correct the issue. Can anyone offer advice on where to look next?
You simply have to move Backbone.history.start after the "new Route" line.
var Route = Backbone.Router.extend({
routes: {
"test/:id": function (event) {
$(".row").html("Hello, " + event);
},
"help": function () {
alert("help!");
}
}
});
var appRouter = new Route();
Backbone.history.start({
pushState: true,
root: "/Home/Index/"
});
Make sure you go to ".../Home/Index/help". If it doesn't work, try temporarily removing the root and go to ".../help" to see if the root is the problem.
If you still have troubles, set a js breakpoint in Backbone.History.loadUrl on the "return" line. It is called from the final line of History.start to execute the current browser url on page load. "this.matchRoot()" must pass then, "fragment" is matched against each "route" or regexp string in "this.handlers". You can see why or why not the browser url matches the route regexps.
To set to the js breakpoint, press F12 in the browser to open the dev console, press Ctrl-O or Ctrl-P to open a js file, then type the name of the backbone js file. Then search for "loadUrl:". You can also search for "Router =" to find the start of the router class definition (same as for "View =" and "Model =" to find the backbone view/model implementation code). I find it quite useful to look at the backbone code when I have a question like this. It is surprisingly readable and what better place to get answers?
If your js files happen to be minified/compressed, preferably turn this off. Alternately you can try the browser unminify option. In Chrome this is the "{}" button or "pretty print". Then the js code is not all on 1 line and you can set breakpoints. But the function and variable names may still be mangled.
I have solved my own problem using what feels to be "hackish", via the following. If anyone can submit a better response it would be appreciated!
My Solution:
I globally override the default Backbone.Router.intilaize method (it is empty) with the following:
$(document).ready(function (event) {
var _root = "/Home/Index/";
_.extend(Backbone.Router.prototype, {
initialize: function () {
/* check for route & navigate to it */
var pathName = window.location.pathname;
var route = pathName.split(_root)[1];
if (route != undefined && route != "") {
route = "/" + route;
this.navigate("", { trigger: false });
this.navigate(route, { trigger: true });
}
}
});
});
I'm using laika for testing and the meteor-router package for routing. I want to do tests that navigate to some page, fill a form, submit it and check for a success message, but I'm stuck on the navigation part. This was my first attempt:
var assert = require('assert');
suite('Router', function() {
test('navigate', function(done, server, client) {
client.eval(function() {
Meteor.Router.to('test');
var title = $('h1').text();
emit('title', title);
})
.once('title', function(title) {
assert.equal(title, 'Test');
done();
});
});
});
This doesn't work because Meteor.Router.to doesn't have a callback and I don't know how to execute the next line when the new page is loaded.
I tried also with something like this
var page = require('webpage').create();
page.open('http://localhost:3000/test', function () {
...
}
but I got the error Error: Cannot find module 'webpage'
Edit
I'm moving to iron router, so any answer with that also will be helpful.
I had the same problem. I needed to navigate to some page before running my tests. I'm using iron router as well. I figured you can't just execute Router.go('foo') and that's it. You need to wait until the actual routing took place. Fortunately the router exposes a method Router.current() which is a reactive data source that will change as soon as your page is ready. So, in order to navigate to a specific route before running my tests, I firstly run the following code block:
// route to /some/path
client.evalSync(function() {
// react on route change
Deps.autorun(function() {
if (Router.current().path == '/some/path') {
emit('return');
this.stop();
}
});
Router.go('/some/path');
});
Since this is within an evalSync()everything that follows this block will be executed after the routing has finished.
Hope this helps.
Laika now includes a waitForDOM() function you can set up to wait for a specific DOM element to appear, which in this case would be an element in the page you're loading.
client.eval(function() {
Router.go( 'test' );
waitForDOM( 'h1', function() {
var title = $('h1').text();
emit( 'title', title );
});
});
The first parameter is a jQuery selector.