I run the JS codes
<a class="dropdown-item" href="<c:url value="javascript:DoPostLogout()" />"><i class="ft-power"></i> <spring:message code="label.logout" /></a>
<script language="javascript">
function DoPostLogout(){
$.post("${pageContext.request.contextPath}/logout", {}, function( result ) {
document.location.href= "${pageContext.request.contextPath}" ;
} );
}
</script>
But failed
Display error message at Chrome consol:
Mixed Content: The page at '' was loaded over HTTPS, but requested an insecure XMLHttpRequest endpoint ''. This request has been blocked; the content must be served over HTTPS.
The codes are no problem in my local. but has issue at AWS server.
enter image description here
enter image description here
Related
Well, I'm integrating the Google Identity Services into my application. But it doesn't run.
I'm following the instruction give in https://developers.google.com/identity/gsi/web
So I added these lines into the head of the index.html file
<meta name="google-signin-client_id" content="MY_GOOGLE_ID.apps.googleusercontent.com">
<script src="https://accounts.google.com/gsi/client" async defer></script>
and these at the beginning of the body:
<script>
function handleCredentialResponse(response) {
console.log('hello, world');
console.log("Encoded JWT ID token: " + response.credential);
}
window.onload = function () {
google.accounts.id.initialize({
client_id: 'MY_GOOGLE_ID.apps.googleusercontent.com',
callback: handleCredentialResponse
});
// Display the One Tap prompt
google.accounts.id.prompt();
// Display the Sign In With Google Button
google.accounts.id.renderButton(
document.getElementById("buttonDiv"),
{ theme: 'outline', size: 'large' }
);
}
</script>
Then added this line into my Navbar.js
<li className='nav-item'>
<div id="buttonDiv" class="g-signin2" data-onsuccess="onSignIn"></div>
</li>
As far as I understood, when the user correctly sign-in, the handleCredentialResponse callback should be called by Google, but nothing appeared on my console.log.
I can login correctly, using different credentials. The user image and email address appear into the button, but I'm not notified of the event.
I tried to follow the instruction, but seems that Google suggest these new approach referred in the link at the top, but the instruction still are for the old implementation.
Can anyone help, please?
So when you initialise the button in your tag, it will have a "data-callback" parameter. Pass your handler in that like below.
<html>
<body>
<script src="https://accounts.google.com/gsi/client" async defer></script>
<div id="g_id_onload"
data-client_id="YOUR_GOOGLE_CLIENT_ID"
**data-callback="handleCredentialResponse"**
data-login_uri="https://your.domain/your_login_endpoint"
data-auto_prompt="false">
</div>
<div class="g_id_signin"
data-type="standard"
data-size="large"
data-theme="outline"
data-text="sign_in_with"
data-shape="rectangular"
data-logo_alignment="left">
</div>
</body>
</html>
Sorry for my bad english. I think same question but with different idea have asked, but my idea is different. What I am asking is I have compile the laravel url in wordpress using curl request. please see my code to better understand what i am trying to say.
<html lang="{{ config('app.locale') }}">
<head>
<!-- ImportInWordpressHeaderStart -->
<meta charset="utf-8" />
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no" />
<meta name="csrf-token" content="{{ csrf_token() }}" />
<title>{{ config('app.name', 'Laravel') }}</title>
<!-- ImportInWordpressHeaderEnd -->
</head>
<body> .......
//here is my complete html part ignore it.
<!-- ImportInWordpressFooterScriptStart -->
<script type="text/javascript" src="{{ asset('frontend/js/jquery-2.1.0.min.js') }}"></script>
<script type="text/javascript">
$("#login form").on('submit', function (e){
e.preventDefault();
$.ajax({
type: $(this).attr('method'),
url: $(this).attr('action'),
data: $(this).serialize(),
dataType: "json", ........... // the rest ajax code.
<!-- ImportInWordpressFooterScriptEnd -->
The upper part of the code is completly in laravel which is working perfectly. Now see what i have done in wordpress theme header and footer.
<?php
//Laravel Home url
$url = "http://example.com/home";
$ch = curl_init();
// set URL and other appropriate options
curl_setopt($ch, CURLOPT_URL, $url);
curl_setopt($ch, CURLOPT_HEADER, 0);
curl_setopt($ch, CURLOPT_RETURNTRANSFER, true);
// grab URL and pass it to the browser
$output = curl_exec($ch);
//Regular expression to excerpt the targeted portion
preg_match('/<!-- ImportInWordpressFooterStart -->(.*?)<!--ImportInWordpressFooterEnd -->/s', $output, $footer);
preg_match('/<!-- ImportInWordpressFooterScriptStart -->(.*?)<!-- ImportInWordpressFooterScriptEnd -->/s', $output, $script);
// close curl resource, and free up system resources
curl_close($ch);
?>
<?php echo $footer[0];
wp_footer();
echo $script[0];
?>
Now in laravel when i clicked on login it is logged in perfectly but when i try to do the same in wordpress it gives me token mismatch error
http://example.com/wordpress
The wordpress and laravel are both in same domain i don't want to create the same laravel header footer again in wordpress. any better idea will be appreciated. Thanks
each cookie session has its own csrf token, and you seemingly make no attempt to transfer the cookie session id recieved by curl to the browser, or vise-versa. thus the browser will attempt to login with it's own cookie session, and with the csrf token of curl's cookie session, that definitely wont work.
solution: make curl fetch the csrf token using the cookies of the browser.
$str='';
foreach($_COOKIE as $n=>$v){
$str.=$name.'='.$v.'; ';
}
curl_setopt($ch,CURLOPT_COOKIE,$str);
note that if the page where you get the csrf token sends any new Set-Cookie headers, curl will not transfer those headers to the browser unless you write some code to explicitly do this. for example, if the url where you fetch the cookie session also regenerate the session id of the browser, and you dont transfer the new id to the browser, it will effectively logout the browser.
I'm currently tying to get Pushwoosh working for browsers, such as Chrome, Safari and Firefox. The site I'm trying to do this for however is a Drupal 7. My browsers are enabled in the Pushwoosh dashboard. But somehow I can't get it to work.
What I've done so far:
added the manifest.json file to my root and linked
added the service workers to my root
I've add this piece of code to my html.tpl.php (temporary when it works I will add it in a cleaner way)
<head>
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
<title><?php print $head_title; ?></title>
<?php print $head; ?>
<link rel="manifest" href="/manifest.json">
<?php print $styles; ?>
<script src="https://cdn.pushwoosh.com/webpush/v3/pushwoosh-web-notifications.js" async></script>
<script>
var Pushwoosh = Pushwoosh || [];
Pushwoosh.push(["init", {
logLevel: 'error', // possible values: error, info, debug
applicationCode: 'MY CODE',
safariWebsitePushID: 'MY ID',
defaultNotificationTitle: 'MY TITLE',
defaultNotificationImage: 'https://cp.pushwoosh.com/img/logo-medium.png',
autoSubscribe: true,
userId: 'user_id',
tags: {
'Name': 'John Smith'
}
}]);
</script>
<?php print $scripts; ?>
<?php print $gtm_datalayer; ?>
<?php print $gtm_script; ?>
</head>
Everything shows up in the website, also my manifest.json is accesible.
However, I'm doing this on a staging environment which has http but a login is needed to acces and see the website. Is it possible that this restriction is causing the problem, did I go wrong in my setup or did I even forget some config?
Thanks in advance!
Web pushes do not work with http out of the box, therefore https is required for the described solution to work.
However, Pushwoosh do have Chrome and Firefox http pushes, please take a look at this guide - http://docs.pushwoosh.com/docs/chrome-web-push-for-http-websites
Hope it will help!
I want to create google login in my website and code used is from google developer website here and I am using php for coding and my code is
<!DOCTYPE html>
<html>
<head>
<title>Google Login</title>
<meta name="google-signin-client_id" content="9252517****-o9350mh2vrp58maddlv0aeitkd0c****.apps.googleusercontent.com">
<script src="https://apis.google.com/js/platform.js" async defer></script>
<script>
function onSignIn(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 signOut()
{
var auth2 = gapi.auth2.getAuthInstance();
auth2.signOut().then(function ()
{
console.log('User signed out.');
});
}
</script>
</head>
<body>
<div align="center" margin-top="100px">
<div class="g-signin2" data-onsuccess="onSignIn"></div>
Sign out
</div>
</body>
</html>
After signin I am getting error like this Error: redirect_uri_mismatch
The JavaScript origin in the request: http://localhost did not match a registered JavaScript origin.
You can check error here.
Please help me to get out of this problem.
After long search I found solution which magically solve my problem.
As shown in error http://localhost did not match a registered JavaScript origin I set http://localhost instead of full path in my redirect url in console.developer site and it works.
I have currently deployed a swagger project but I am having trouble adding some basic authorization to it. Currenty when you click on the "Try it out!" button you are required to log in to an account to access the results. I have an account that I want to automatically be used everytime someone tries to access the api. Bellow is my index.html for the project:
<!DOCTYPE html>
<html>
<head>
<title>Swagger UI</title>
<link href='css/screen.css' media='screen' rel='stylesheet' type='text/css'/>
<link href='css/screen.css' media='print' rel='stylesheet' type='text/css'/>
<script src='lib/jquery-1.8.3.js' type='text/javascript'></script>
<script src='lib/jquery.slideto.min.js' type='text/javascript'></script>
<script src='lib/jquery.wiggle.min.js' type='text/javascript'></script>
<script src='lib/jquery.ba-bbq.min.js' type='text/javascript'></script>
<script src='lib/handlebars-1.0.rc.1.js' type='text/javascript'></script>
<script src='lib/underscore-min.js' type='text/javascript'></script>
<script src='lib/backbone-min.js' type='text/javascript'></script>
<script src='lib/swagger.js' type='text/javascript'></script>
<script src='lib/swagger-ui.js' type='text/javascript'></script>
<script src='lib/highlight.7.3.pack.js' type='text/javascript'></script>
<script type="text/javascript">
$(function () {
window.swaggerUi = new SwaggerUi({
discoveryUrl:"https://localhost:8080/AssistAPI/api-docs.json",
apiKey:"",
dom_id:"swagger-ui-container",
supportHeaderParams: true,
supportedSubmitMethods: ['get', 'post', 'put'],
onComplete: function(swaggerApi, swaggerUi){
if(console) {
console.log("Loaded SwaggerUI")
console.log(swaggerApi);
console.log(swaggerUi);
}
$('pre code').each(function(i, e) {hljs.highlightBlock(e)});
},
onFailure: function(data) {
if(console) {
console.log("Unable to Load SwaggerUI");
console.log(data);
}
},
docExpansion: "none"
});
window.authorizations.add("key", new ApiKeyAuthorization("Authorization", "XXXX"header"));
//window.authorizations.add("key", new ApiKeyAuthorization("username", "rmanda", "header"));
window.swaggerUi.load();
});
</script>
</head>
<body class="swagger-section">
<div id='header'>
<div class="swagger-ui-wrap">
<a id="logo" href="http://swagger.io">swagger</a>
<form id='api_selector'>
<div class='input'><input placeholder="http://example.com/api" id="input_baseUrl" name="baseUrl" type="text"/></div>
<div class='input'><input placeholder="api_key" id="input_apiKey" name="apiKey" type="text"/></div>
<div class='input'><a id="explore" href="#">Explore</a></div>
</form>
</div>
</div>
<div id="message-bar" class="swagger-ui-wrap"> </div>
<div id="swagger-ui-container" class="swagger-ui-wrap"></div>
</body>
</html>
I am trying to determine where the information is supposed to go to allow Basic Authorization. I know it involved the following lines of code, but can someone please explain to me in a little more detail where things go exactly. I have come to the realization that the documentation for swagger on GitHub is not very clear or helpful
window.authorizations.add("key", new ApiKeyAuthorization("Authorization", "XXXX"header"));
window.authorizations.add("key", new ApiKeyAuthorization("username", "password", "header"));
Swagger UI 3.x
In Swagger UI 3.13.0+, you can use the preauthorizeBasic method to pre-fill the Basic auth username and password for "try it out" calls.
Assuming your API definition includes a security scheme for Basic auth:
swagger: '2.0'
...
securityDefinitions:
basicAuth:
type: basic
security:
- basicAuth: []
you can specify the default username and password for Basic auth like so:
// index.html
const ui = SwaggerUIBundle({
url: "https://my.api.com/swagger.yaml",
...
onComplete: function() {
// "basicAuth" is the key name of the security scheme in securityDefinitions
ui.preauthorizeBasic("basicAuth", "username", "password");
}
})
"Try it out" will use the specified username and password, and if you click the "Authorize" button in Swagger UI, you will see that the username and masked password are pre-filled in the UI.
This answer also contains a solution for Swagger UI 3.1.6—3.12.1, which do not have the preauthorizeBasic feature.
The correct setting for Basic authentication Header is:
Authorization: Basic username:password
The String username:password needs to be encoded using RFC2045-MIME a variant of Base64.
See more details here: https://en.wikipedia.org/wiki/Basic_access_authentication#Client_side
Then, to configure this header, you should do:
Considering that the Base64 encoding for username:password is dXNlcm5hbWU6cGFzc3dvcmQ=
swaggerUi.api.clientAuthorizations.add("key", new SwaggerClient.ApiKeyAuthorization("Authorization", "Basic dXNlcm5hbWU6cGFzc3dvcmQ=", "header"));
Read more about this here:
https://github.com/swagger-api/swagger-ui
I had a similar problem, the suggested answers are correct in my case I end up adding something in the index.html like:
var myAuth = "Basic " + btoa("user:password");
window.authorizations.add("key", neSwaggerClient.ApiKeyAuthorization("Authorization", myAuth, "header"));
I added this on either the marked method addApiKeyAuthorization or you can create another method but call it after the window.swaggerUi.load();
But if you have your swagger-ui running as "stand alone" with something like gulp or grunt you may require to configure the services to accept all OPTIONS request.
I struggle a little with that, I hope it helps someone.
Regards
you can add/change this function in your dist/index.html file
function addApiKeyAuthorization(){
var key = encodeURIComponent($('#input_apiKey')[0].value);
if(key && key.trim() != "") {
key = 'Basic '+key;
var apiKeyAuth = new SwaggerClient.ApiKeyAuthorization("Authorization", key, "header");
window.swaggerUi.api.clientAuthorizations.add("Authorization", apiKeyAuth);
log("added key " + key);
}
}
OR you can move on new version of Swagger 2.0 , this is known issue is was fixed.