Hi,
I need your help! I am newbie in chrome extension and I am get stuck with below case so Could you please help me?
We need to load HTML pages with user details by conditionally in default popup box from popup.js file. I have added below code in popup.js. When user is logged-in extension then we are storing it in chrome.storage by using chrome.storage.sync.set() APIs and get that user details by following code in popup.js file.
---------------------------------------
chrome.storage.sync.get(["user"], function(items) {
if (!items.user){
window.location.href = "login.html";
} else {
$("#usernameId").text('Welcome '+items.user.username);
$("#totCreditId").text(items.user.tot_credit);
$("#leftCreditId").text(items.user.left_credit);
window.location.href = "main.html";
}
});
---------------------------------
It working fine but user details are not reflected (username, total credit, left credit etc..) in main.html page, Can you please correct me what I am doing wrong in it?
Thanks in advance!
What I have tried:
NOTE:- Below are files in my extension :-
------------
manifest.json
{
"background": {
"persistent": true,
"scripts": [ "js/libs/jquery-2.2.3.min.js", "js/libs/aes.js", "js/libs/aes-json-format.js", "js/global.js", "js/background.js" ]
},
"browser_action": {
"default_icon": "images/logo.png",
"default_popup": "popup.html",
"default_title": "LeadCapture"
},
"content_scripts":[{
"css": [ "css/content.css" ],
"js": [ "js/libs/jquery-2.2.3.min.js"],
"matches": [ "http://*/*", "https://*/*" ],
"run_at": "document_end"
}],
"content_security_policy": "script-src 'self' 'unsafe-eval' https://code.jquery.com; object-src 'self'",
"description": "LeadCapture",
"homepage_url": "http://app.demo.25.com/",
"icons": {
"128": "images/logo128.png",
"48": "images/logo48.png"
},
"web_accessible_resources": [ "/*" ],
"manifest_version": 2,
"name": "LeadCapture",
"permissions": ["tabs", "activeTab", "cookies", "clipboardWrite", "storage", "http://app.demo.25.com/*" ],
"version": "0.1"
}
popup.html page
<!DOCTYPE html>
<html>
<head>
<title></title>
<script type="text/javascript" src="js/libs/jquery-2.2.3.min.js"></script>
<script type="text/javascript" src="js/global.js"></script>
<script type="text/javascript" src="js/popup.js"></script>
</head>
<body style="width:350px;"></body>
</html>
popup.js file
$(function(){
chrome.cookies.get({'url': objSettings.COOKIE_PATH, 'name': 'uuid'}, function(cookie){
if(cookie){
objSettings.UUID = cookie.value;
chrome.extension.getBackgroundPage().objSettings.UUID = cookie.value;
}
chrome.tabs.query({active:true,currentWindow:true}, function(tab){
var jsScript = '';
$.ajax({
url: "http://app.demo.25.com/extension/content.js",
type: 'GET',
cache: false,
async: false,
success: function(data){
jsScript = data;
}
});
chrome.tabs.executeScript(tab[0].id, {code: jsScript},function() {
if (chrome.runtime.lastError) {
}
});
message = {from:'popup', task:'bootStrapExtension', uuid:objSettings.UUID, loadFile:'', showTab:'lg_extension_tab_3', tabUrl:tab[0].url};
if(objSettings.UUID == '')
message.loadFile = 'login.html';
else{
message.loadFile = 'main.html';
}
chrome.tabs.sendMessage(tab[0].id, message);
chrome.storage.sync.get(["user"], function(items) {
if (!chrome.runtime.error) {
if (!items.user) {
alert('IF');
chrome.browserAction.setPopup({popup:message.loadFile});
}
else
{
if(items.user.username.length > 0)
$("#customUsernameId").text('Welcome '+items.user.username);
if(items.user.tot_credit.length > 0)
$("#customTotCreditId").text(items.user.tot_credit);
if(items.user.left_credit.length > 0)
$("#customLeftCreditId").text(items.user.left_credit);
var userExt = {
username: items.user.username,
tot_credit: items.user.tot_credit,
left_credit: items.user.left_credit
};
chrome.storage.sync.set({ user: userExt }, function(result) {
window.location.href = message.loadFile;
});
}
}
});
});
});
});
main.html
login.html
background.js
<content.js
.. etc
Submit an article or tip