Difference between Enplug SDK web extension URLs? - enplug-sdk

I'm using the Enplug SDK web extension to create an app to show digital menus from DSMenu on screens using Enplug. I'm using AngularJS on my config page.
I'm confused about the relationship between the "Configure Url" setting in the back-end from this guide, and the Value.Url in the payload from this tutorial.
Configure URL
Value.Url
$scope.page = {
Value: {
ShowContent: 'url', // Show Content is used to hide/show the Url or Html form field based on the selection.
Url: '', // The Url the web page back-end uses to display the content.
Html: '', // If applicable, used to show custom HTML. Cannot be used in conjunction with the Url.
ShowMobileWebsite: false, //Only applies if OverrideUserAgent is true, False = Show Desktop Website, True = Show Mobile Website
OverrideUserAgent: false, //False = Use android's best fit. True = Use the value of ShowMobileWebsite
ShowDelay: 0, //Custom delay between displaying the page after it's been loaded.
RefreshInterval: 0, // Custom refresh interval rate in X seconds.
AllowJavascript: true, // Set to true by default, allows Javascript to be executed on the page.
Username: '', // Username option, would need to write script passing in credentials.
Password: '', // Password option, would need to write script passing in credentials.
Token: '', // Token option, would need to wrtie script passing in credentials.
JavascriptOnload: '' // Custom JS to be executed once the page loads, can be used to log into authenticated pages.
}
};
I created a page http://www.dsmenu.com/con-enplug-display.php and each app will have a custom URL to show the menu like http://www.dsmenu.com/uph/204. Where do I put each?

The 'Configure Url' is the link to the configuration page which will be displayed to the end user on Enplugs web dashboard, in your example http://www.dsmenu.com/con-enplug-display.php
The Value.Url is the link to the web app that will be shown publicly on the screen in the venue. In your case http://www.dsmenu.com/uph/204

Related

Geeting error in dynamica links on adding efr=1

Hello i am using dynamic links and these are working as expected what the problem is it is showing me a preview page in ios and i don't want to show a preview page that's why i am adding a efr=1 as in the link but i am getting an error in the browser that invalid url link
const link_URL = await dynamicLinks().buildShortLink({
link: 'https://reelweb.com/',
domainUriPrefix: 'https://reelweb.page.link',
ios: {
bundleId: 'com.reelweb',
appStoreId: '34354',
fallbackUrl: 'https://apps.apple.com/us/app/reelweb-app/id1535962213',
},
android: {
packageName: 'com.reelweb',
fallbackUrl: 'https://play.google.com/store/apps/details?id=com.reelweb',
}
});
sharing url after adding efr
https://reelweb.page.link/mJCyiFDrr78MGoye8&efr=1
So please suggest me how can i remove preview page in the sharing url.
error page
must be a parseable URI, but possibly incomplete to be a DynamicLink.
If you are the developer of this app, ensure that your Dynamic Links domain is correctly configured and that the path component of this URL is valid.

single page application deep linking with login page

My team is going to build a single-page-application for our future project. At the moment, I have a problem with designing the app with login page. There are 2 approaches:
Create the login page as a separate page, the rest of the app is another single page.
The app has only 1 page and the login page will be a view in the app which is switched back and forth using javascript.
I don't know which approach I should take. I have read some discussions on the internet, it seems like it's more popular to create the login page as a separate page, the reason for this is we can use normal cookie-based authentication with session on server, redirect users to default page (main page) after successful login, and so on. Therefore, I'm thinking about creating the login page as a separate page, but I have a problem with deep linking.
For example, let's say I have 2 pages: login.html, index.html (main page). When an unauthenticated user requests a page like this index.html#product=1, the user will be redirected to the login.html, after successfully loging in, redirect the user back to index.html#product=1. But at this point, the #product=1 is lost.
Please advice me on how to keep the deep link or should I take the second approach?
Thank you
If you are building a single page app, it would be 'nicer' from the users point of view to have it all on one page, so I would suggest option 2.
Not sure if you need javascript to switch it though - you could use something like the following (PHP code)
At the start of the application saves what view the user is looking at and checks if the user pressed 'submit' on the login form
$selected_menu = $_GET['menu'] ;
//check to see if they've submitted the login form
if(isset($_POST['submit-login'])) {
If the login is successful, redirect them back to the same page with the appropriate view as a parameter
Then in the main page of the app when you are about to display data you would check to see if the user is validated, and if not then present the login form as part of the page.
$usr = CheckLogon();
if ( $usr == "" ) { // check for correct test to make sure user is logged on
ShowLoginForm();
....
I decided to go with approach 2: The app has only 1 page and the login page will be a view in the app which is switched back and forth using javascript.. I found out that it's not difficult to do and I can still use normal cookie-based authentication with session on server, redirect users to default page (main page) after successful login, and so on. Here is a sample code how I do it with angularjs.
Routing:
var App = angular.module('App', ["ui.state"]);
App.config(function ($stateProvider, $routeProvider) {
$stateProvider.
.state('login', {
url: "/login?returnUrl",
templateUrl: '/Home/Login',
controller:"LoginController"
})
.state('main', {
url: "/main",
abstract:true,
templateUrl: '/Home/Main',
controller: "MainController"
})
})
.run(function ($rootScope, $state, $stateParams, $location) {
$rootScope.$on('$stateChangeError', function(event, toState, toParams, fromState, fromParams, error){
if (error.status == 401) {
$state.transitionTo("login", { returnUrl: $location.url() });
}
})
});
The point here is when there is a route change error with status 401 (from the server) indicating that the user is not logged in, I will transition to login state with the return url.
After the user successfully logging in using ajax, I will transition the state back to my main view. Something like this:
$http.post("/Login", JSON.stringify({UserName:username,Password:password}))
.success(function (data, status, headers, config) {
var returnUrl = $stateParams.returnUrl ? $stateParams.returnUrl : "mydefaulturl";
$location.url(returnUrl);
})
With this approach, now I'm able to create deep-link to jump to a specific state in my app with login page and return url.

ExtJS4 - How to make an initial entry to a site with param data?

I have an ExtJS4 site www.mysite.com where I serve index.html when a user enter the site. I want the user to be able to access the site with some param data redirected from another site. For example, www.mysite.com?q=10
How do I capture q=10 which I will use to retrieve some data from the database?
How do I send index.html so that browser retrieves javascript and css files. Once all the javascript and css files are loaded, I need to render a page displaying the result from the database?
Thanks
To get the url parameters I've done this :
var getParams = document.URL.split("?");
var params = Ext.urlDecode(getParams[getParams.length - 1]);
console.log(params.q) // you should see 10 being printed
If index.html is gonna come with some param in the url you can use the launch method to do an ajax request and bassed on that response render something
Ext.application({
name : 'MyAppWithDynamicFirstPage',
launch : function() {
var getParams = document.URL.split("?");
var params = Ext.urlDecode(getParams[getParams.length - 1]);
var q = params.q;
Ext.Ajax.request({
url: 'someServlet/getViewToRender',
params: {
'q': q
},
success: function(response, opts) {
//bassed on this you would do something else like render some specific panel on your viewport
},
failure: function(response, opts) {
console.log('server-side failure with status code ' + response.status);
}
});
}
});
I hope this was of some help.
Best regards.
Depends of your web server, programming language and architecture
Usually first ExtJs is loading with all js/css. After it loaded, data loads asynchronously from the server. But if you exactly know what are you doing, you can render your data into a global variable inside a script tag and then use it in the code.

Preventing automatic sign-in when using Google+ Sign-In

I am in the process of integrating Google+ sign in with my site, which also lets users sign in with Twitter and Facebook. The sign in page of the site therefore has 3 buttons, one for each of the services.
The issue I am having is in the following scenario:
user goes to the sign in page
user signs in successfully with G+
user signs out of my site (but the account is still associated with G+, signing out of the site does not disconnect the G+ account)
user visits the sign in page again
at this stage the Sign in with G+ button is rendered and automatically signs the user into the account associated with G+ without the user having to click the button
The problem is that on revisiting the sign in page, I want the user to have the option of signing in with another service, rather than automatically being signed in with G+. If the user wants to sign in with G+ then they can do so by clicking the button - the user will then be signed in automatically.
Is it possible to prevent this automatic sign in on button render? I can simulate it by using the data-approvalprompt="force" as an attribute on the button, but I don't think this is an ideal solution (the user then has to go through the confirmation process, which I would ideally would like to prevent)
Update
The best supported way to prevent automatic sign-in is to use the API method gapi.auth2.getAuthInstance().signOut() which will prevent automatic sign-in on your site after it has been called. Demo here.
In the demo, the user is signed out when they leave the page as shown in the following code:
window.onbeforeunload = function(e){
gapi.auth2.getAuthInstance().signOut();
};
Now, whenever the user exits the site (e.g. closes the window, navigates away), they will be signed out and the sign in button will not trigger sign-in until the user clicks it.
I don't recommend you do this in your own implementation but instead allow the user to explicitly sign out when they no longer desire want to be signed in. Also, please note that my example is a demo, you probably do not want to sign the user out automatically any time they leave your site.
Original Post
First, you should not be using data-approvalprompt="force" as this will cause extra authorized subtokens to be issued to your application / client and is designed to be used in scenarios where the user needs to be reauthorized after credentials have been lost server-side.
Second, you probably do not want to have the behavior where the user needs to click to sign in because they are already "signed in" to their Google account and it could be confusing to need to sign in (or trigger sign-in) again, separately, for your site.
If you really wanted to do this, you would perform an explicit render for the signin button but would not make the call to gapi.signin.render as documented in the Google+ sign-in documentation until you are aware that the user will not automatically get signed in.
The following code shows how to enable explicit render of the sign-in button:
<script type="text/javascript" src="https://apis.google.com/js/plusone.js">
{"parsetags": "explicit"}
</script>
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
<head>
<script type="text/javascript">
var token = "";
function onSigninCallbackVanilla(authResponse){
// in a typical flow, you show disconnect here and hide the sign-in button
}
The following code shows you how to explicitly render the button:
<span id="signinButton">
<button id = "shim" onclick="gapi.signin.go(); $('#shim').hide();">Show the button</button>
<span
class="g-signin"
data-callback="onSigninCallbackVanilla"
data-clientid="YOUR_CLIENT_ID"
data-cookiepolicy="single_host_origin"
data-requestvisibleactions="http://schemas.google.com/AddActivity"
data-scope="https://www.googleapis.com/auth/plus.login">
</span>
</span>
How you're communicating that the user is signed out of your site is probably going to vary from site to site, but one approach could be to set a cookie indicating the "signed out" state for a user and then using this as the trigger for blocking explicit load. The behavior gets a little trickier when a user visits your site and has disabled cookies or uses a separate, signed-in, browser. To address this, you could do something complicated like querying the user state from your server over XHR on the sign-in callback and pretending not to know the user is signed in to Google+.
Just check for g-auth-window in the callback function:
function google_sign_callback(authResult){
if(authResult['g-oauth-window']){
}else if(authResult['error']) {
}
}
I had this issue and used auth2.disconnect()
function onSignIn(googleUser) {
var profile = googleUser.getBasicProfile();
var auth2 = gapi.auth2.getAuthInstance();
auth2.disconnect();
//do other stuff
}
Edit:
you need to store the token before you disconnect because in some cases id_token will become null after disconnect:
function onSignIn(googleUser) {
var profile = googleUser.getBasicProfile();
var idToken=profile.id_token;
googleUser.disconnect()
//use idToken for server side verification
}
If i'm correct you have your own sign in mechanism for your site and just need google sign in to sign up a user on verified email. in this case you can easily disconnect after you get the profile info.
Next time you load the page you will see "sign in" button instead of "signed in " button.
Unfortunately calling gapi.auth.signOut() made the app to log-in again when I'm requesting user data (neither it is persistent)
So the solution, as suggested by #class is to revoke the token:
$.ajax({
type: 'GET',
url: 'https://accounts.google.com/o/oauth2/revoke?token=' +
gapi.auth.getToken().access_token,
async: false,
contentType: 'application/json',
dataType: 'jsonp',
success: function(result) {
console.log('revoke response: ' + result);
$('#authOps').hide();
$('#profile').empty();
$('#visiblePeople').empty();
$('#authResult').empty();
$('#gConnect').show();
},
error: function(e) {
console.log(e);
}
});
I too has same issue this how i fixed it.I may not sure this is a stander way to do it but still it works fine with me...
add this Google JS from google developer
<script src="https://apis.google.com/js/platform.js" async defer></script>
<script>
function onSuccessG(googleUser) {
var profile = googleUser.getBasicProfile();
console.log('ID: ' + profile.getId()); // Do not send to your backend! Use an ID token instead.
console.log('Name: ' + profile.getName());
console.log('Image URL: ' + profile.getImageUrl());
console.log('Email: ' + profile.getEmail());
}
function onFailureG(error) {
console.log(error);
}
function renderGmail() {
gapi.signin2.render('my-signin2', {
'scope': 'https://www.googleapis.com/auth/plus.login',
'width': 0,
'height': 0,
'longtitle': true,
'theme': 'dark',
'onsuccess': onSuccessG,
'onfailure': onFailureG
});
}
Now add html link and onClick call this renderGmail() function.
SignUp with Gmail
I hope this works...
I am using https://developers.google.com/identity/sign-in/web/build-button to build the sign in button for my web app which gives the user a choice to log in through either Facebook or Google.
This code is pretty easy for obtaining the Id_token.
However it also came with automatic signing in of the user if the user is already signed in.
Thus, adding the following snippet in the beginning of the script helped me control the signup procedure.
window.onbeforeunload = function(e){
gapi.auth2.getAuthInstance().signOut();
};
Thanks!
Our AngularJS solution was:
$scope.$on('event:google-plus-signin-success', function (event, authResult) {
if( authResult.status.method !== "AUTO"){
onGoogleLogIn(authResult[settings.configKeys.googleResponseToken]);
}
});
I have been struggling with this for a while and could not find a way to prevent automatic sign in to Google using the "easy implementation" of the Sign-in
I ended up using the custom integration which does not attempt to auto sign in (also allowed me to change the appearance in the same time)
The accepted answer no longer works when you start to use both Google Sign In and OAuth access tokens for other Google services. The access tokens expire immediately when the user is signed out. Instead, I would recommend the answer from this SO post, which involves attaching a click event handler to the Google sign in button. Only once the user clicks the sign in button and successfully logs into their Google account will the callbacks events fire.
I solved this by adding a click handler to my Google sign-in button. The click handler sets a global Javascript variable google_sign_in to true. When the onSuccess() handler fires (whether automatically on page load, or manually when the user clicks the sign-in button), it first checks whether google_sign_in == true and only then does it continue signing the user in:
<div id="google-signin2" onclick="return do_click_google_signin();"></div>
<script>
var google_sign_in = false; // assume
function do_click_google_signin() {
google_sign_in = true;
}
function onSuccess( googleUser ) {
if ( google_sign_in ) {
// Process sign-in
}
}
// Other redundant login stuff not shown...
</script>

Multiple whitelists/blacklists for content script injection?

I'm building a Safari extension with two different content scripts. One script needs to be injected into all http pages (but not https pages). The other one only gets injected into google.com pages regardless of scheme.
In order to achieve this, I have set Extension Website Access to:
This should mean that at a high level, content scripts in my extension should be able to access all pages.
To get more fine-grained control, I then programatically inject the content scripts into URLs which match my patterns.
App = {
content: {
// Inject into unsecure pages.
whitelist: ['http://*/*'],
// But not into secure pages.
blackList: ['https://*/*'],
loc: safari.extension.baseURI + 'data/content.js'
},
results: {
// Inject this script into all google.com pages
whiteList: ['http://*.google.com/*', 'https://*.google.com/*'],
// Surely I don't need a blacklist if I specify a whitelist?
blacklist: undefined,
loc: safari.extension.baseURI + 'data/results.js',
}
};
// Inject the first content script.
safari.extension.addContentScriptFromURL(App.content.loc,
App.content.whitelist, App.content.blacklist, false);
// Inject the second content script.
safari.extension.addContentStyleSheetFromURL(App.results.cssLoc,
App.results.whitelist, App.results.blacklist, false);
The problem is that both scripts are being injected into all pages. It's as if my white and blacklists do nothing. What am I doing wrong?
I was using capitals in my whilelist/blacklist definitions at the top:
App = {
content: {
blackList: ['https://*/*'],
},
results: {
whiteList: ['http://*.google.com/*', 'https://*.google.com/*']
}
};
But then using non-capitalized versions of the variables when I pass the lists into the script injection function.
safari.extension.addContentScriptFromURL(App.content.loc, App.content.whitelist, App.content.blacklist, false);
This obviously means that undefined was being passed into the injection function rather than an actual whitelist/blacklist.