我正在制作一个扩展,当用户提交按钮时,它会获取页面 URL 并将其存储在数据库中。
我被困在这个问题上,我认为我在扩展部分中遗漏了一些我无法识别的东西。 这只是一个学习项目,所以我没有包含任何验证。
以下是一些详细信息;
manifest.json
{
"manifest_version": 2,
"name": "Hello Extention",
"description": "POST details of the current page.",
"version": "0.1",
"content_scripts": [{
"js": ["contentscript.js"],
}],
"web_accessible_resources": ["script.js"],
"background": {
"scripts": ["background.js"],
"persistent": true
},
"browser_action": {
"default_icon": "icon.png",
"default_popup": "popup.html"
},
"permissions": [
"contextMenus",
"bookmarks",
"tabs",
"http://*/",
"https://*/"
]
}
这是我的 popup.html
<input type="text" name="url" id="url" value=""><br>
<input type="text" name="title" id="title"></br>
<input type="button" name="submit" value="Go" id="submit"><br>
背景.js
chrome.tabs.getSelected(null, function (tab) {
var tabId = tab.id;
var tabUrl = tab.url;
var tabTitle = tab.title;
document.getElementById("url").value = tabUrl;
document.getElementById("title").value = tabTitle;
chrome.browserAction.setBadgeText({
text: "10+"
});
});
现在,当用户单击 go 按钮时,我调用了 ajax 请求
$("#submit").click(function () {
document.getElementById("load").innerHTML = "<img style='height:30px;' src='/img/loading- sprocket-gray-light-transparent.gif' />";
var title = document.getElementById("title").value;
var url = document.getElementById("url").value;
var xhr = new XMLHttpRequest();
if (!xhr) {
xhr = new ActiveXObject("Microsoft.XMLHTTP");
}
xhr.open("post", "updatedata.php", true);
xhr.setRequestHeader("Content-Type", "application/x-www-form-urlencoded");
xhr.send("url=" + url + "&title=" + title);
xhr.onreadystatechange = function () {
if (xhr.status == 200 && xhr.readyState == 4) {
reply = xhr.responseText;
alert(reply);
}
}
});
updatedata.php
<?php
echo "welcome";
include('connection.php');
$url = $_GET['url'];
$title = $_GET['title'];
mysql_query("insert into `data` VALUES('','$url','$title');" );
?>
现在,alert(reply)
返回整个 Updatedata.php 文件,而不是发送欢迎消息。我还尝试单独执行代码(即不是从扩展中执行),它会提醒我欢迎,并将值插入数据库中。所以我认为Ajax请求或PHP文件没有任何问题。但我认为我缺少一些关于如何发送请求或其他内容的扩展
最佳答案
您不能在 Chrome 扩展程序中使用 PHP。将其放在PHP服务器上并向服务器发送请求。并修复 PHP 脚本中明显的 SQL 注入(inject)漏洞。
您的 PHP 脚本似乎仅用于在数据库中存储数据。除非您需要通过不同的 View 访问这些数据,否则我建议使用客户端存储 API 来保存数据,例如与 chrome.storage
.
如果您需要一个成熟的数据库,请查看IndexedDB
。鉴于您的知识水平,我建议使用 chrome.storage
API,因为它更容易使用,特别是对于新手程序员(无意冒犯)
关于javascript - 无法通过 chrome 扩展的 Ajax 请求将值存储在数据库中,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/23560960/