I have configured oAuth in api connect with extracting user identity using custom HTML form. I have created HTML form from the example shown here. basic/example form works fine. So i added some java script and that's not getting executed and this is the error in browser console.
"Refused to apply inline style because it violates the following Content Security Policy directive: "default-src 'self'". Either the 'unsafe-inline' keyword, a hash ('sha256-64QJjzLzBML/LeZdvHCeLDUWYbF9paVcf/zNonwZpew='), or a nonce ('nonce-...') is required to enable inline execution. Note also that 'style-src' was not explicitly set, so 'default-src' is used as a fallback."
Here is my HTML code.
<html lang="en" xml:lang="en">
<head>
<meta charset="UTF-8"/>
<meta name="viewport" content="width=device-width, initial-scale=1.0"/>
<style>
body {
display: flex;
justify-content: center;
align-items: center;
height: 100vh;
font-family: Arial, sans-serif;
background-color: #f0f0f0;
margin: 0;
}
.login-container {
background-color: white;
padding: 30px;
border-radius: 8px;
box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
text-align: center;
width: 300px;
}
.login-container img {
width: 100px;
margin-bottom: 20px;
}
.login-container input[type="text"],
.login-container input[type="password"] {
width: calc(100% - 20px);
padding: 10px;
margin: 10px 0;
border: 1px solid #ccc;
border-radius: 5px;
font-size: 16px;
}
.login-container button {
width: 100%;
padding: 10px;
background-color: #3928d6;
border: none;
color: white;
font-size: 16px;
border-radius: 5px;
cursor: pointer;
}
.login-container button:hover {
background-color: #45a049;
}
</style>
</head>
<body>
<div class="login-container">
<form method="POST" enctype="application/x-www-form-urlencoded" action="authorize">
<h1>Please sign in</h1>
<p>Username </p>
<p style="text-indent: 0em;"><input type="text" name="username" required="required" /> </p>
<p>Password </p>
<p style="text-indent: 0em;"><input type="password" name="password" required="required" /> </p>
<EI-INJECT-HIDDEN-INPUT-FIELDS/>
<p > <button id="login_button" type="submit" name="login" value="true">Sign in</button> </p>
<EI-LOGINFIRSTTIME>
<p>If you have forgotten your user name or password, contact your system administrator.</p>
</EI-LOGINFIRSTTIME>
<EI-LOGINFAILED>
<p style="color: red">At least one of your entries does not match our records.
If you have forgotten your user name or password, contact your system administrator.</p>
</EI-LOGINFAILED>
<EI-INTERNAL-CUSTOM-FORM-ERROR/>
</form>
</div>
</body>
</html>
I understand this setting is done in API connect and my html form is hosted on web server , but policies are getting created in data power i.e 'User security assembly action' So i was curious what changes do i need to do in HTML to fix this error ?
Rajesh
------------------------------
Rajesh Solanki
------------------------------