Google login / Third party authentication provider - javascript

I'm developing an angularjs app where Google login is one of it's features.
I'm using this link to implement the feature
https://blog.codecentric.de/en/2014/06/angularjs-google-sign-integration/.
Here is also the script called when the page is loaded
`
<script type="text/javascript">
(function () {
var p = document.createElement('script');
p.type = 'text/javascript';
p.async = true;
p.src = 'https://apis.google.com/js/platform.js?onload=onLoadCallback';
var s = document.getElementsByTagName('script')[0];
s.parentNode.insertBefore(p, s);
})();
</script>
`
Is this the right way and how I can fetch data from google and show the data to the user and if he is happy to press sign up and then to be signed. I already have my app created into the google api service and tried many options but no success so far.
Thanks in advice.

Well this has a problem you would be login in directly with out being clicked so that might be a problem in future
Try something like this
<script type="text/javascript">
(function() {
var po = document.createElement('script'); po.type = 'text/javascript'; po.async = true;
po.src = 'https://apis.google.com/js/client.js?onload=onLoadCallback';
var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(po, s);
})();
</script>
In the view
function login()
{
var myParams = {
'clientid' : 'YOUR_CLIENT_ID.apps.googleusercontent.com', //You need to set client id
'cookiepolicy' : 'single_host_origin',
'callback' : 'loginCallback', //callback function
'approvalprompt':'force',
'scope' : 'https://www.googleapis.com/auth/plus.login https://www.googleapis.com/auth/plus.profile.emails.read'
};
gapi.auth.signIn(myParams);
}
Convert this codes to Angular .
Please see this question for details

Related

Geoplugin SSL - Country undefined error

I am trying to disable my live chat from displaying by blocking countries India and Pakistan.
I used the tool from http://www.geoplugin.com and it worked great. However - I was using the typical http javascript. I just bought the SSL version from them so that there wouldn't be a conflict with my current website which uses HTTPS and the new javascript.
However - now that I use it - I get the error message
Uncaught ReferenceError: geoplugin_countryCode is not defined
My website is https://www.blueskychat.com
The code is as follows:
<script language="JavaScript" src="https://ssl.geoplugin.net/json.gp?k=..." type="text/javascript"></script>
<script type="text/javascript">
var countryCode = geoplugin_countryCode();
if (countryCode != 'IN' && countryCode != 'PK') {
window.__lc = window.__lc || {};
window.__lc.license = 8653536;
window.__lc.chat_between_groups = false;
window.__lc.ga_version = "ga";
(function() {
var lc = document.createElement('script');
lc.type = 'text/javascript';
lc.async = true;
lc.src = ('https:' == document.location.protocol ? 'https://' : 'http://') + 'cdn.livechatinc.com/tracking.js';
var s = document.getElementsByTagName('script')[0];
s.parentNode.insertBefore(lc, s);
})();
}
</script>
Any ideas as to what is the problem and how to resolve?
Thanks!!
You're loading json response, but attempting to use javascript method.
Just replace json.gp with javascript.gp in your src attribute of loading script and it will work.

Client server javascript communication

I want to create 2 scripts, 1 for client 1 for server side.
I found snippet which allows call asyncrhonously js
<html>
<head>
</head>
<body>
<script>
(function() {
var projectId = "script";
var protocol = ('https:' == document.location.protocol ?
'https://' : 'http://');
var scriptTag = document.createElement('script');
scriptTag.type = 'text/javascript';
scriptTag.async = true;
scriptTag.src = protocol + 'localhost/wp/' +
projectId + '.js';
var s = document.getElementsByTagName('script')[0];
s.parentNode.insertBefore(scriptTag, s);
})();
function optimizelyTimeout() {
window.optimizely = window.optimizely|| [];
if (!window.optimizely.data) {
window.optimizely.push("timeout");
}
}
setTimeout(optimizelyTimeout, 1000);
</script>
</body>
</html>
This produces below code:
<script type="text/javascript" async="" src="http://localhost/wp/script.js"></script>
Now I would like script.js to return some custom js code which will be injected into original webpage. I tried with:
-return("code");
-response.write("code");
but non of that worked for me.
How script.js should look like in order to return some custom js code to be executed on client side?
How can I pass arguments from client to server side call?
How script.js should look like in order to return some custom js code
to be executed on client side?
if the javascript code returned by script tag has to be invoked immediately then you need to return a self invoking function
(function(){
/* code that you want to invoke immediately after the script has been loaded*/
})(this);
How can I pass arguments from client to server side call?
just push the parameters in the script src itself
scriptTag.src = protocol + 'localhost/wp/' + projectId + '.js?param1=value';
and intercept the same on your server side

How can I access Google search results programmatically

I am using the Google Custom Search in my web page and want to filter the results before displaying the results. I cannot find any callback in Google's documenation where I can access the results so I can tweek them before displaying the results. Below is my code in my web page.
<script>
(function() {
var cx = '99999999999999999999:ddddddddd';
var gcse = document.createElement('script');
gcse.type = 'text/javascript';
gcse.async = true;
gcse.src = (document.location.protocol == 'https:' ? 'https:' : 'http:') +
'//cse.google.com/cse.js?cx=' + cx;
var s = document.getElementsByTagName('script')[0];
s.parentNode.insertBefore(gcse, s);
})();
</script>
<div style="font-size: 1.3em">
<gcse:searchbox gname="search"></gcse:searchbox>
<gcse:searchresults gname="search"></gcse:searchresults>
</div>
Does anyone know how I can access the results before they are displayed in the searchresults element?
Custom Search has an API which allows you to retrieve the results in JSON or XML format. You'll probably want to use the official JavaScript client library to access the API more conveniently.

how to load main.js only after facebook response status is connected in cocos2d-js

I am using cocos2d-js for game development. In a script of index.html I want to load main.js only when some conditions will be fulfilled.
The sample code is the below
<script>
if(user_id == data.id)
{
// call the main.js
}
</script>
I tried the below
<script>
if(user_id == data.id)
{
(function(document){
var s = document.createElement('script');
s.id = "external_content";
s.async = true;
s.src = "main.js";
document.getElementsByTagName('body')[0].appendChild(s);
s.onload = function() {
document.write(external_content);
}
}(document));
}
</script>
But it does not work. I can not call the main.js from inside another sript. What can I do ? Please help.

javascript and jquery override

I am making a small project that will let:
different websites to load my external javascript file: something like this:
<script type="text/javascript">
var vsid = "SA89696";
(function() {
var vsjs = document.createElement('script'); vsjs.type = 'text/javascript'; vsjs.async = true; vsjs.setAttribute('defer', 'defer');
vsjs.src = ('https:' == document.location.protocol ? 'https://' : 'http://') + 'example.com/robot/robot.js';
var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(vsjs, s);
})();
</script>
now I want to use jquery in my javascript file, I dont have problem to load it by myself,
but I dont want to cause errors to the curresnt website if it already loaded jquery.
do you have any suggestions how to load jquery with no overrides.
You need something like this:
<script>
if(!window.jQuery)
{
var script = document.createElement('script');
script.type = "text/javascript";
script.src = "path/to/jQuery";
document.getElementsByTagName('head')[0].appendChild(script);
}
</script>
It checks if jQuery is loaded or no..
Source

Categories

Resources