Question

我正在尝试从chrome扩展程序发送邮件。我可以使用php成功执行任务。但是我想使用ajax使进程异步。我做了必要的改变。我可以在同一页面上显示“邮件发送成功”，而不会在正常的html窗口中重定向到另一个页面但是，当我尝试在扩展内部执行相同操作时，整个php页面都会被加载而不是echo消息。

**manifest.json**

{
"name":"extmail",
"description":"Quicky send emails to your contacts",
"version":"2.0",
"permissions":["activeTab"],

"background":{
"script":["js/script.js"],
"script":["js/submit.js"]
},

"content_security_policy": "script-src 'self' https://ajax.googleapis.com; object-src 'self'",

"browser_action":{
    "default_title":"TinyMessage",
    "default_icon":"images/icon.png",
    "default_popup":"popup.html"
},
"manifest_version": 2
}

**submit.js**

 $(document).ready(function(){
  $(".image").click(function(){                     //on click image
     var name = $(this).attr("name");                   //declare name as email                 
     var url=$("#temp").val();                          //set email to hidden input as value
        var message=$("#message").val();
    //to work asynchronously
     var Url="php/mail.php";
     var httpRequest;
     httpRequest=new XMLHttpRequest();
     httpRequest.onreadystatechange=sendUrl;
     httpRequest.open("POST",Url,true);
     httpRequest.setRequestHeader('Content-Type', 'application/x-www-form-urlencoded'); 
     httpRequest.send("url="+url+"&toemail="+name+"&message="+message);
     function sendUrl()
     {
            if(httpRequest.readyState==httpRequest.DONE)
                if(httpRequest.status==200)
            {
                    var response=httpRequest.responseText;
                    document.getElementById("response").innerHTML=response;
            }
    }       
  });
});


**mail.php**

<?php
session_start();
$url = $_POST['url'];                                   // getting url 
$toemail = $_POST['toemail'];
$message = $_POST['message'];                           // getting message
$to = $toemail;                                             // to email address
$subject = "sent from extension";                          // assign subject
$txt = "$url\n$message";                                
$headers = "From: donotreply@fmt.com";                      
// Sending mail
if(mail($to,$subject,$txt,$headers)){                     // mail function send mail using a smtp server
    echo "mail sent successfully ";
}
else{
    echo "mail not sent";
    }
?>

**popup.html**

<html>
<head>
    <title>Easy Mail</title>
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>
    <script type="text/javascript" src="js/script.js"></script>
    <script type="text/javascript" src="js/submit.js"></script>
    <script type="text/javascript" src="js/load.js"></script>
    <link rel="stylesheet" type="text/css" href="css/style.css">
</head>
<body>
    <h1>Tiny MESSAGE!</h1>
    <form action="http://localhost/extmail/php/mail.php" id="form1" method="POST">
        <input id="toemail" type="hidden" name="toemail" >
        <input id="temp" name="url">
        <label for="message">Enter message:</label><br/>
        <input id="message" type="text" name="message">
        <!-- <input type="submit" value="send Mail"> -->
        <br>
        <br>    
        <img  class="image" id="image1" name="temp@example.com" src="images/contact1.jpg" title="temp@example.com" alt="Smiley face" height="40" width="40"><span id="badge1"></span>
        <figcaption>contactone</figcaption>
    </form>
    <div id="response"></div>
</body>

让AJAX在chrome扩展中工作？

0 个答案: