joomla user authentication by my own custom written form inputs - authentication

I've been struggling to find out about user authentication using your own form elements.
In order to make it clear, heres what i want to do.
I'm going to have a button which is going to redirect to a page.
Now, this page can be redirected to in the following ways.
A popup opens where the user needs to enter their email address and password.
My form is like this
<form action="userlogin.php" method="post">
<ul>Email
<li><input type="text" id="email" name="email" /></li>
</ul>
<ul>Password
<li><input type="password" id="pass" name="pass" /> </li>
</ul>
</form>
The user clicks the submit button and if the email address and password exist then we have a successful login and if they dont then we add that user in the database and then redirect.
I dont understand how to authenticate user login using this form i've mentioned about. Which file do i have to post it to and how can it work like a normal joomla login.
Please do help.
Thanks.

You can write your own authentication routine relatively easily in two steps.
Authentication Logic
For the authentication logic, in the plugins folder, there is another folder called "authentication". Aside from the default joomla authentication, there is another called "example.php", which you can clone and work on from there. These are the plugins that you can enable/disable in the plugins manager in your Joomla Administrator, so you can look at them and see the different ways that they authenicate (gmail, openid, etc.).
Be sure to scan/replace all the naming used in the copied file (it's not very big), and when you're happy with it, make an entry in table jos_plugins so that you can enable it in the Joomla administrator.
Your Form (using template atomic as the example, and assuming you're using mod_login)
Within /templates/atomic/html/mod_login you should have, a file called default.php. This is where you change the form to suit your needs, and incorporate into the authentication logic your wrote in the plugin.
Popup Approach
That will depend on the template you're using, and how it, or you, generally handle popups. Rockettheme have many popup modules (some being free) which demonstrate how you could do it that way, or jquery if you're comfortable with that, the list goes on....

You could override the existing login form and open this in a modal popup?

Related

Shopify: How to add user as subscriber from contact form?

I have tried searching but so far haven't been able to find a solution that doesn't involve paying for an app or using a third party form. So if anyone has a solution to this I'd be so happy.
I need to include a checkbox on the standard contact form on a contact page page.contact.liquid. I understand how to add fields, but I want the checkbox, when checked to automatically add the user to our subscriber list.
I have tried adding the below, hidden field, but it doesn't add a subscriber. It doesn't seem to do anything.
<input type="hidden" name="customer[accepts_marketing]" id="hiddenMarketingCheck" autocorrect="off" value="true" >
I did look at the code in the subscriber form section and noticed that the two forms are tagged differently using form_type. So I did some testing and changed the form type from contact to customer. So basically the output goes from this <input type="hidden" name="form_type" value="contact"> to this <input type="hidden" name="form_type" value="customer">.
That 'half works', because it does achieve my original goal to add a user to the 'customer accepts_marketing'. But then it doesn't send the message to the admin user of the site. So now it doesn't work as a contact form.
Does anybody know how I can achieve this? Maybe there are other form types I can use? Or additional fields I need to add?
Any help will be much appreciated.
Many thanks in advance.
My suggestion would be not to add the users at this stage, however, what I did on one of my projects was to put the subscription field AFTER they submitted the contact form and on the success message box.
This way you give them a clear option and understanding that they are subscribing with you and you didn't force them to do so.
I had a much higher acceptance than simply opting in the user.

Prevent browser caching form values in .NET Core 2.2

ASP.net Core 2.2 MVC Web Application
I have a number of forms where I do NOT want the browser to cache/show any previous entered data when the user return to the page. I want the elements/form to NOT cache any information. I do not simply want the browser not to show previously entered information, I want it not to be cached for security reasons.
I tried decorating the controller method with:
[ResponseCache(NoStore = true, Location = ResponseCacheLocation.None)]
to no avail, when I again navigate to the page/form and start typing, previously entered values keep showing up as autocomplete options.
I've tried playing with every nuance of this as well:
Response Caching Middleware in ASP.NET Core
How is this done for all browsers nowadays?
Sounds like it is caused by the autocompletion feature of browser:
By default, browsers remember information that the user submits through fields on websites. This enables the browser to offer autocompletion (that is, suggest possible completions for fields that the user has started typing in) or autofill (that is, pre-populate certain fields upon load).
To disable this feature for a form:
<form autocomplete="off">
...
</form>
Or disable a field :
<input ... autocomplete="off">
Here's a detailed explanation on off
The "off" keyword indicates either that the control’s input data is particularly sensitive (for example the activation code for a nuclear weapon); or that it is a value that will never be reused (for example a one-time-key for a bank login) and the user will therefore have to explicitly enter the data each time, instead of being able to rely on the user agent to prefill the value for him; or that the document provides its own autocomplete mechanism and does not want the user agent to provide autocompletion values.
For more details, see how to disable autocompletion on MDN and w3c.org
Hope it helps.
You can use autocomplete="off" for html elements but chrome prevent this for some names like "name", "address" etc.
This topic was discussed earlier. Chrome ignores autocomplete="off"

How to make login authentication page in HTML or JAVASCRIPT

I am from electronics background so don't have good knowledge in designing webpages. I am doing an ethernet project and for that I need to make a webpage but before that webpage I also need to make a login authentication webpage. I somehow managed to do it using HTML JAVASCRIPT but the problem is anyone can see the username password by viewing the page source.
I am having hard time making authentication. I have basic knowledge of HTML and JAVASCRIPT but ready to learn. All I can find on google is login templates but I don't even know how to use them.
Can anyone give me an example or point me to some good links.
HTML and Javascript are interpreted on the client side. For login purposes, it is the server side code that is commonly used to verify the credentials - simply because that fact that you are already aware of - with a simple client side implementation, you can see the credentials in source code, server side is also easier to work with, once you understand it, it is more flexible for further development, it is more secure, and it is really used everywhere for this task.
It is a good idea to use PHP, ASP, Ruby (or any other server side language) for this. If you do not want that, you need to make it hard for the user to read the credentials from the source code.
In order to do that, you can use various methods like cryptography or obfuscation. Cryptography is highly recommended over obfuscating as it provably adds more security to your application. Obfuscating basically means that you change the source code in a way that it is hard to read - you add functions that encode strings, so that your "password" can not be spotted on the first sight. However, obfuscation can always be bypassed, and usually quite easily with a good debugging tools.
So, let's go with cryptography. What you are looking for here is using one way hash functions. You have plenty to choose from - MD5, SHA1, SHA256, ... each provides different level of security. SHA256 implementation in Javascript is an example you can use. There are many other libraries and examples for this, so just use Google and find the one that you like.
Now, what to do with it? Say you have sha256() function that accepts a string and returns its hash as a string. For each user and password you have, you precount SHA256 hash of string "user + password".
Say, you want your username to be "Pedro" and password for this account is "MyPassword".
You precount the hash of "PedroMyPassword" - e.g. with with online hashing tool. You can see the its SHA256 hash is
40be6e939eedf018b2b846e027067dcb006585a2155ce324f1f2a6a71d418b21
This hash is what you put into your Javascript code.
When the user enters their user and password, you call your sha256 function on "username + password" and you compare it to your precounted hash.
Note that you have to select really strong password, otherwise certain attacks (such as dictionary attack) would be easy to use to break your hash.
The problem is now, that you did not specify, what you want to do next. For example, you might want to redirect authenticated users to next page, but here you have the same problem again - if you have redirection in Javascript to "secondpage.html" in your code, someone could just skip the authentication and navigate to this second page directly.
What you can do in this case is that you name your second page as
40be6e939eedf018b2b846e027067dcb006585a2155ce324f1f2a6a71d418b21.html
i.e. the hash of your user+pass string. In this variant you do not put the hash in the code at all. The web server will just return error 404 for all users that fail to authenticate. For example, if someone attempts to use "Pedro" with "123456" as password, the SHA256 would be
3bac31720fdd4619ebe2e8865ccc0dc87eb744f3f05f08c628bb9217a77e4517
and if you redirect them to
3bac31720fdd4619ebe2e8865ccc0dc87eb744f3f05f08c628bb9217a77e4517.html
it won't exist, because your second page file is called
40be6e939eedf018b2b846e027067dcb006585a2155ce324f1f2a6a71d418b21.html
You would need to create these second pages for each user/pass combination. You could then put a simple redirection code to the real second page.
But make sure you are using HTTPS protocol, otherwise, the second pages would go through the wire unencrypted ...
This all will work, but still, I highly suggest, you consider the server side way.
In my previous answer I was using client side technologies thats why the username and password was not safe and hidden if we check the page-source.
Now,we will use server side technology, for this you need web-server package such as WAMP,XAMPP etc
Download and install one of these packages.(if you have one of these two, then its well and good)
I am using XAMPP so I will explain with XAMPP.
If you have successfully downloaded XAMPP,
then look for the htdocs folder in XAMPP folder. Mine is "C:\xampp\htdocs"
copy the below code and create new php fileand Save this file as login.php in htdocs directory.
Here is php code.
<?php
$usr="root";
$pwd="root";
if(isset($_POST['username']) && !empty($_POST['username']) && isset($_POST['password']) && !empty($_POST['password']) ){
$username=$_POST['username'];
$password=$_POST['password'];
if(($username==$usr) && ($password==$pwd) ){
echo '<br>login successfull';
}else{
echo '<br>login unsuccessfull';
}
}else{
echo "<br>Connot be left empty!";
}
?>
ok!! Now Create a simple HTML page containing login form and save this as login.html
Here is the HTML code
<html>
<head>
<title>Login</title>
</head>
<body>
<form action="login.php" method="POST" align="center">
<br>
Username:<input type="text" name="username"><br><br><br>
Password :<input type="text" name="password"><br><br>
<input type="Submit" value="Submit">
</form>
</body>
</html>
Now, Goto browser->Type http://localhost/login.html and run
Insert Username and password as root.
I am assuming you have basic knowledge of php, if not go through it, its is very easy and also read about HTTP requests
GET
POST
<html>
<head>
<title>Login paget</title>
</head>
<script type="text/javascript">
function display(form){
if (form.username.value=="root") {
if (form.password.value=="root") {
location="page2.html"
} else {
alert("Invalid Password")
}
} else { alert("Invalid Username")
}
}
</script>
<body >
<form >
<input type="text" name="username" /><br><br>
<input type="password" name="password"/><br><br>
<input type="button" value="Login" onClick="display(this.form)"/>
</form>
</body>
</html>
Hello I have created a login page for you using html and Javascript. The Username and password are root.
You see if you input correct username and password then the page directs to page2.html and this will show you
This webpage is not found
ERR_FILE_NOT_FOUND
so what you have to do is replace page2.html with your next page name.
You can't really have a secure authentication system using JavaScript and HTML alone.
I would suggest Basic HTTP authentication on your server instead, as it is much more secure (not perfect by any means, but at least employs a standard server-side method of access control).
If you must implement something in JavaScript, you could do a password only scheme based on the name of a hidden directory. Something like the following (note this is untested so will need some tweaks):
(Code borrowed and adapted from this question)
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
<script>
$(function() {
var url = "some_url";
$.ajax(url,
{
if (statusCode == 200) {
document.location.href = url;
}
else {
alert('Incorrect password')
}
}
});
});
</script>
<input type="password" />Login
The code should be finished so that the function is called when the button is clicked. So if the password is foo, you set a directory on your website called foo, and if the JQuery JavaScript detects that the entered password matches a directory name (e.g. /foo/), then the user is redirected there. Therefore you'd create a /foo/index.html in order to take care of the user's logged in session.
Note that this is the most secure thing you can do with JavaScript and HTML alone and it suffers from the following vulnerabilities.
It requires that the URL be kept secret, although this can be leaked by the referer header, by browser history and server/proxy logs.
Once a user is logged in, they are always logged in (they could bookmark the logged in pages)
There is no easy way to revoke a password.
There is only one password.
Anyone with access to view files on the server could view the directory structure and learn the password.
The URL may be leaked by analytics tools.
Assumes directory browsing on your server is disabled (or that there's a default page in the private page's parent directory).
In any case, always protect your server with TLS/SSL. My recommendation is to properly create a user authentication system using the advice from OWASP. The above shows only what's achievable in basic HTML (not much). However, it is better than exposing the password within client-side files.
just try out this code
-
function validate(){
var username = document.getElementById("username").value;
var password = document.getElementById("password").value;
if ( username == "username1" && password == "password1"){
alert ("Login successfully");
}
else{
alert("Invalid username or password");
}
return false;
}
<html>
<head>
<title>Javascript Login Form Validation</title>
<!-- Include JS File Here -->
<script src="js/login.js"></script>
</head>
<body>
<div class="container">
<form id="form_id" method="post" name="myform">
<label>User Name :</label>
<input type="text" name="username" id="username"/>
<label>Password :</label>
<input type="password" name="password" id="password"/>
<input type="button" value="Login" id="submit" onclick="validate()"/>
</form>
</div>
</body>
</html>

_ServerClick event and Response.Redirect: wrong redirection

Perhaps this question is a bit too general, but I'll try to narrow it down by explaining my scenario.
I have a login page, with an html input button:
<input runat="server" id="btnLogin" type="submit" value="Login"></input>
The button triggers the btnLogin_ServerClick event which runs a validation routine.
If the user is validated the following happens:
HttpContext.Current.Response.Redirect("~/myPage.aspx")
This is all good in development environment.
However, after I deployed my application, the validated user would still be redirected to the localhost URL, instead of the application URL corresponding to the root directory.
After lots of trials and errors, I've fixed the issue by changing the button to a webcontrol namespace button:
<asp:Button runat="server" ID="btnLogin" Text="Login"/>
This triggers a Click event in the code behind.
The routine is exactly the same as in the development environment, but the user is now redirected to the appropriate URL.
So, could anyone explain why the ServerClick event was making Response.Redirect "behave" differently?

MySpace Login URL?

I want to allow users log-into MySpace directly from a URL?
I see that when MySpace submits its login form it goes to:
https://secure.myspace.com/index.cfm?fuseaction=login.process
But I need to tack on all the hidden parameters as well as the login text box and password text box.
Does anybody have this done already?
I know I would do something like: https://secure.myspace.com/index.cfm?fuseaction=login.process&ctl00_ctl00_cpMain_cpMain_LoginBox_Email_Textbox_Label=&ctl00$ctl00$cpMain$cpMain$LoginBox$Password_Textbox=
Considering the security implications of that, I hope it cannot be done.
But you can try grabbing all the form elements / form tag & input 's etc and change the form's action attribute to the fully qualified absolute path.
<form action="https://secure.myspace.com/index.cfm?fuseaction=login.process" method="post">