Chrome 확장자가 PHP 파일로 양식 정보 전달

현재 HTML 양식에서 정보를 가져 와서 데이터베이스에 PHP 파일 adn에 전달하는 간단한 확장 프로그램을 만들려고합니다. 내 manifest.json을은 다음과 같습니다Chrome 확장자가 PHP 파일로 양식 정보 전달

<form action="http://localhost/FYP/index.php" method="POST"> 
 
    <div> 
 
     <label> <b>Email Address</b> </label> 
 
    </div> 
 
    <div> 
 
     <input placeholder="Email" type="text" name="email" > 
 
    </div> 
 
    <div> 
 
     <label> <b>Password</b> </label> 
 
    </div> 
 
    <div> 
 
     <input placeholder="Password" type="text" name="password" > 
 
    </div> 
 
    <div> 
 
     <input type="submit" id="submit" value="Sign In"> 
 
    </div> 
 
</form>

내가 더 있다는 것을 알고 :

{ 
    "manifest_version": 2, 

    "name": "Sample Extension", 
    "description": "Sample Extension", 
    "version": "1.0", 

    "browser_action": { 
    "default_icon": "icon.png", 
    "default_popup": "popup.html" 
    }, 
    "background": { 
    "scripts": ["background.js"] 
    }, 
    "content_scripts": [ 
    { 
     "matches": ["http://*/*", "https://*/*"], 
     "js": ["jquery.js", "myScript.js"] 
    } 
    ], 
    "permissions": [ 
    "http://localhost/*", 
    "activeTab", 
    "tabs" 
    ] 
}

내 HTML 파일이 내가 제출하려고이 특정 "형식"요소가 로그인 시스템을 제공하는 최적의 방법이지만이 시점에서 나는 연결을 설정하려고 노력하고 있으며 앞으로도 비슷한 방식으로 데이터베이스에 정보를 보내야합니다. 현재로서는 HTML을 PHP 파일에 연결하려고하는데 작동하지 않는 것 같습니다. 정상적인 웹 페이지에서 똑같은 코드를 테스트했는데 작동했지만 연장을 위해 그렇게하지 않는 것 같습니다. 내 PHP 파일은 단순히 전화를 반환

<?php 
    var_dump($_POST); 
?>

그러나, 현재 아무것도 호출이 이루어질 때 반환 내가이 오류 얻을되고있다 : 누군가가 지적 할 수 있다면 정말 감사하겠습니다 Call error

을 내 확장 기능을 만드는 초보자로서의 실수!

출처

2017-03-10 G.Totev

다음과 같이 코드를 수정 :

popup.html AJAX를 사용하여 요청이 별도의 js에서 호출 후

<!DOCTYPE html> 
 
    <html> 
 
     <head> 
 
      <script src="popup.js"></script> 
 
     </head> 
 
     <body> 
 
      <form id="callphp"> 
 
       <div> 
 
      <label> <b>Email Address</b> </label> 
 
     </div> 
 
     <div> 
 
      <input placeholder="Email" type="text" name="email" > 
 
     </div> 
 
     <div> 
 
      <label> <b>Password</b> </label> 
 
     </div> 
 
     <div> 
 
      <input placeholder="Password" type="text" name="password" > 
 
     </div> 
 
     <div> 
 
      <input type="submit" id="submit" value="Sign In"> 
 
     </div> 
 
      </form> 
 
     </body> 
 
    </html>

이 파일

// POST the data to the server using XMLHttpRequest 
 
function callPHP() { 
 
    // Cancel the form submit 
 
    event.preventDefault(); 
 

 
    // The URL to POST our data to 
 
    var postUrl = 'http://localhost/FYP/index.php'; 
 

 
    // Set up an asynchronous AJAX POST request 
 
    var xhr = new XMLHttpRequest(); 
 
    xhr.open('POST', postUrl, true); 
 

 
    // Prepare the data to be POSTed by URLEncoding each field's contents 
 
    var email = encodeURIComponent(document.getElementById('email').value); 
 
    var password = encodeURIComponent(document.getElementById('password').value); 
 
    
 
    var params = 'email=' + email + 
 
       '&password=' + password; 
 

 
    // Handle request state change events 
 
    xhr.onreadystatechange = function() { 
 
     
 
    }; 
 

 
    // Send the request and set status 
 
    xhr.send(params); 
 
}

출처

2017-03-10 06:48:09 Sudarshan

답변 주셔서 감사합니다. 이제 요청이 성공하여 200을 반환합니다. 그러나 요청 페이로드는 "[email protected]&password=somepassword"이지만 응답에 전송 된 정보가 없습니다. 단지 : 배열 (0) { } –

양식을 사용하려면 AJAX 호출을 사용하십시오.

출처

2017-03-10 00:50:28 Spectarion

Chrome 확장자가 PHP 파일로 양식 정보 전달

답변

관련 문제