2017-02-21 126 views
1

我正在使用Chrome扩展程序,并且在登录和注册按钮时遇到问题,当我按下它时什么也没有发生,并在控制台中向我写入下一条消息:Chrome扩展程序违反了Google安全政策

popup.html:26拒绝执行内联事件处理程序,因为它违反了 以下内容安全政策指令:“剧本-SRC ‘自我’https://ajax.googleapis.com”。 “内联不安全” 关键字,散列('sha256 -...')或临时值('nonce -...')需要 以启用内联执行。

我试图解决这个问题几个星期,仍然没有找到解决方案,你能帮我解决这个问题吗?

popup.js:

//Function that appears if login button pressed 
function validate1() { 
    var attempt = 3; 
    console.log("s"); 

    var username = document.getElementById("username").value;//Get username from user 
    var password = document.getElementById("password").value;//Get password from user 

    if (username == "SteveO" && password == "youshallpass"){ 
     alert ("Login successfully"); 
     window.location = "/success_login.html"; //If login was successful transfer to another page 
    } 
    else{ 
     attempt --;//Decrementing by one 
     alert("You have left "+attempt+" attempt;"); 

     //If 3 attempts were unsuccessful disable login option 
     if(attempt == 0){ 
      document.getElementById("username").disabled = true; 
      document.getElementById("password").disabled = true; 
      document.getElementById("submit").disabled = true; 
     } 
    } 

} 
function register1(){ 
    document.getElementById("Sing_up").onclick = function() { 
     location.href = "/SignUp.html"; 
    }; 
} 

的manifest.json:

{ 
    "name": "DoCrypt", 
    "version": "1.0", 
    "description": "A browser app that encrypts files", 
    "content_security_policy": "script-src 'self' google.com; object-src 'self'", 
    "permissions": [ 
    "cookies", 
    "history", 
    "notifications", 
    "tabs" 


    ], 
    "browser_action": { 
    "default_title": "DoCrypt", 
    "default_icon": "icon.png", 
    "default_popup": "popup.html", 
    "popup_function": "popup.js" 


    }, 
    "manifest_version": 2, 
    "content_security_policy": "script-src 'self' ajax.googleapis.com; object-src 'self'" 
} 

的package.json:

{ 
    "name": "docrypt", 
    "version": "1.0.0", 
    "description": "chrome extension app ", 
    "main": "popup.js", 
    "scripts": { 
    "test": "echo \"Error: no test specified\" && exit 1" 
    }, 
    "author": "Steven Goldes", 
    "license": "ISC" 
} 

success_login.html:

<!DOCTYPE html> 
<html> 
<head> 
    <title>Welcome to Docrypt</title> 
    <meta name="robots" content="noindex, nofollow"> 

    <!-- style of page--> 
    <link rel="stylesheet" href="/style.css"/> 


</head> 
<body> 
<center>You are Successfully Login.<a class="back" href="popup.html">Back</a></center> 
</body> 
</html> 

SignUp.html:

<!DOCTYPE html> 
<html lang="en"> 
<head> 
    <meta charset="UTF-8"> 
    <title></title> 
</head> 
<body> 

</body> 
</html> 

popup.html:

<html> 
<head> 
    <title>Javascript Login Form Validation</title> 

    <!-- include css file here--> 
    <link rel="stylesheet" href="/style.css"/> 
    <!-- include javascript file here--> 
    <script type="text/javascript" src="popup.js"></script> 

    <script src=ajax.googleapis.com/ajax/libs/jquery/3.1.0/jquery.min.js"></script> 
</head> 
<body> 
<div class="container"> 
    <div class="main"> 
     <h2>To use Docrypt please login</h2><hr/> 

     <form id="form_id" method="post" name="myform"> 
      <label>User Name :</label></br> 
      <input type="text" name="username" id="username"/></br> 

      <label>Password :</label></br> 
      <input type="password" name="password" id="password"/></br> 

      <input type="button" value="Login" id="Login" onclick="window.validate1()"/> 

      <input type="button" value="Sign up" id="Sing_up" onclick="window.register1()"/> 
     </form> 
     <span><b class="note"></b><b class="valid">User Name : SteveO<br/>Password : Youshallpass</b></span> 
    </div> 
</div> 


</body> 


</html> 

的style.css:

/* Style of the project */ 
@import url(fonts.googleapis.com/css?family=Raleway); 

h2{ 
    background-color: #FEFFED; 
    padding: 30px 35px; 
    margin: -10px -50px; 
    text-align:center; 
    border-radius: 10px 10px 0 0; 
} 

hr{ 
    margin: 10px -50px; 
    border: 0; 
    border-top: 1px solid #ccc; 
    margin-bottom: 40px; 
} 

div.container{ 
    width: 900px; 
    height: 610px; 
    margin:35px auto; 
    font-family: 'Raleway', sans-serif; 
} 

div.main{ 
    width: 300px; 
    padding: 10px 50px 25px; 
    border: 2px solid gray; 
    border-radius: 10px; 
    font-family: raleway; 
    float:left; 
    margin-top:50px; 
} 

input[type=text],input[type=password]{ 
    width: 100%; 
    height: 40px; 
    padding: 5px; 
    margin-bottom: 25px; 
    margin-top: 5px; 
    border: 2px solid #ccc; 
    color: #4f4f4f; 
    font-size: 16px; 
    border-radius: 5px; 
} 

label{ 
    color: #464646; 
    text-shadow: 0 1px 0 #fff; 
    font-size: 14px; 
    font-weight: bold; 
} 

center{ 
    font-size:32px; 
} 

.note{ 
    color:red; 
} 

.valid{ 
    color:green; 
} 

.back{ 
    text-decoration: none; 
    border: 1px solid rgb(0, 143, 255); 
    background-color: rgb(0, 214, 255); 
    padding: 3px 20px; 
    border-radius: 2px; 
    color: black; 
} 

input[type=button]{ 
    font-size: 16px; 
    background: linear-gradient(#ffbc00 5%, #ffdd7f 100%); 
    border: 1px solid #e5a900; 
    color: #4E4D4B; 
    font-weight: bold; 
    cursor: pointer; 
    width: 100%; 
    border-radius: 5px; 
    padding: 10px 0; 
    outline:none; 
} 

input[type=button]:hover{ 
    background: linear-gradient(#ffdd7f 5%, #ffbc00 100%); 
} 

.fugo{ 
    float:right; 
} 
+0

我知道这是关于CSP,加上'的https:// ajax.googleapis.com'在您的权限,这可能帮助 – nivas

+0

@nivas没有帮助队友.. –

回答

1

只需添加到您的popup.js结束:

document.addEventListener('DOMContentLoaded', function() { 
    document.getElementById('Login').addEventListener('click', validate1); 
}); 


document.addEventListener('DOMContentLoaded', function() { 
    document.getElementById('Sign_up').addEventListener('click', validate1); 
}); 
+0

非常感谢你! –