[英]How to change a contentscript variable on click on the icon of a Chrome extension?
[英]How do I change the flashvars using the ContentScript of a Chrome Extension?
我想創建一個Chrome擴展程序來幫助調試我的swf,並且我希望該擴展程序能夠更改某些flashvar,同時保持其他狀態不變。
我無法想象這是一個新的或獨特的問題,因此在我重新發明輪子之前,我想問這里是否有人有完成它的示例,或如何做到這一點。
我嘗試搜索,但我的googlefu似乎已關閉。
我的用例如下。 我有一個Google Chrome擴展程序,其中包含一些帶有可能的Flash變量值的下拉菜單。 我想要更改下拉列表中的值,然后使用這些新的Flashvar重新加載swf,但不更改下拉菜單中未包含的Flashvar。
我可以使用下拉菜單中的值輕松地在頁面上注入新的swf,但是我希望能夠重新加載而不是重新創建swf。
我試過使用Jquery像這樣拉出所有Flash變量:
var flashVars = $("param[name=flashvars]", gameSwfContainer).val();
但是,我很難更改或替換幾個值,然后將它們重新注入到對象中。 (除非有更好的方法,否則Regex在這里可能會有所幫助?)
謝謝你的幫助。
目前,我正在嘗試執行以下操作,但是我不確定這是否是正確的方向。 ContentScript.js
//Setup
var swfVersionStr = "10.1.0";
var xiSwfUrlStr = "playerProductInstall.swf";
var params = {};
params.quality = "high";
params.bgcolor = "#000000";
params.allowscriptaccess = "always";
params.allowfullscreen = "true";
var attributes = {};
attributes.id = "game_swf_con";
attributes.name = "game_swf_con";
attributes.class = "game_swf_con";
attributes.align = "middle";
var InjectedFlashvars = {
"run_locally": "true",
//.. some other flash vars that I won't be changing with my extension
"swf_object_name":"game_swf"
};
// Injection code called when correct page and div detected;
var injectScriptText = function(text)
{
loopThroughLocalStorage();
swfobject.embedSWF(
swfName, "game_swf_con",
"760", "625",
swfVersionStr, xiSwfUrlStr,
InjectedFlashvars, params, attributes);
swfobject.createCSS("#game_swf_con", "display:block;text-align:left;");
};
function loopThroughLocalStorage()
{
for(key in localStorage){
try{
var optionArray = JSON.parse(localStorage[key]);
var option = returnSelectedFlashVar(optionArray);
var value = option.value ? option.value : "";
InjectedFlashvars[key] = value;
} catch(err){}
}
}
function returnSelectedFlashVar(optionArray){
for(var i= 0; i < optionArray.length;i++)
{
if(optionArray[i].selected == true)
{
return optionArray[i];
}
}
}
總的來說,我目前有contentscript.js,background.js,options.js,options.html,popup.html和popup.js到目前為止,以上代碼僅存在於contentscript.js中
在確定您真正想要的東西時遇到了一些麻煩。
但是,如果它操縱flashvar中的值,則可能會有所幫助...
queryToObject = function(queryString) {
var jsonObj = {};
var e, a = /\+/g,
r = /([^&=]+)=?([^&]*)/g,
d = function(s) {
return decodeURIComponent(s.replace(a, " "));
};
while(e = r.exec(queryString)) {
jsonObj[d(e[1])] = d(e[2]);
}
return jsonObj;
}
objectToQuery = function(object) {
var keys = Object.keys(object),
key;
var value, query = '';
for(var i = 0; i < keys.length; i++) {
key = keys[i];
value = object[key];
query += (query.length > 0 ? '&' : '') + key + '=' + encodeURIComponent(value);
}
return query;
}
// this is what a flashvar value looks like according to this page...http://www.mediacollege.com/adobe/flash/actionscript/flashvars.html
var testQuery = 'myvar1=value1&myvar2=value2&myvar3=a+space';
var testObject = queryToObject(testQuery);
console.debug(testObject);
testQuery = objectToQuery(testObject);
console.debug(testQuery);
testObject.myvar0 = 'bleh';
delete testObject.myvar2;
console.debug(objectToQuery(testObject));
而且,如果您在內容腳本中使用localStorage,那么請注意該存儲將保存在頁面的上下文中。
嘗試改用chrome.storage 。
編輯:評論的答案
This looks correct, but how do I "reload" the object so that those new flashvars are the ones that are used by the swf?
Ive從未使用過swfObject(在5年內完成了任何Flash任務),但看上去很像,您可以使用新的flashVars重新運行swfobject.embedSWF
, swfobject.embedSWF
用新的flashVars替換舊的對象。 如果替換后添加了自己的東西,可以提供所有詳細信息,如果替換別人放置的東西,則可以克隆對象,更改某些內容並用克隆替換原來的東西,這很好。 克隆不會克隆任何附加到該元素的事件,但是我認為這對您來說不是一個問題。 這是一個示例(我無法測試,因為我找不到能打印出Flashvar的任何簡單示例swf)。
var target = document.querySelector('#game_swf_con');
// Cloning the element will not clone any event listners attached to this element, but I dont think that's a prob for you
var clone = target.cloneNode(true);
var flashvarsAttribute = clone.querySelector('param[name=FlashVars]');
if (flashvarsAttribute) {
var flashvars = flashvarsAttribute.value;
flashvars = queryToObject(flashvars);
// add a new value
flashvars.newValue = "something";
// update the clone with the new FlashVars
flashvarsAttribute.value = objectToQuery(flashvars);
// replace the original object with the clone
target.parentNode.replaceChild(clone, target);
}
資料來源:
a) 內容腳本
b) 背景頁
c) 消息傳遞
d) 標簽
e) 瀏覽器動作
f) API()的
假設一個HTML頁面包含以下代碼
<embed src="uploadify.swf" quality="high" bgcolor="#ffffff" width="550"
height="400" name="myFlashMovie" FlashVars="myVariable=Hello%20World&mySecondVariable=Goodbye"
align="middle" allowScriptAccess="sameDomain" allowFullScreen="false" type="application/x-shockwave-flash"
pluginspage="http://www.adobe.com/go/getflash" />
我試圖獲得以下獲得嵌入對象的高度並更改它。
樣品示范
manifest.json
{
"name":"Flash Vars",
"description":"This demonstrates Flash Vars",
"manifest_version":2,
"version":"1",
"permissions":["<all_urls>"],
"content_scripts": [
{
"matches": ["<all_urls>"],
"js": ["myscript.js"]
}
]
}
myscript.js
// Fetches Current Width
width = document.querySelector("embed[flashvars]:not([flashvars=''])").width;
console.log("Width is " + width);
// Passing width to background.js
chrome.extension.sendMessage(width);
//Performing some trivial calcualtions
width = width + 10;
//Modifying parameters
document.querySelector("embed[flashvars]:not([flashvars=''])").width = width;
background.js
//Event Handler for catching messages from content script(s)
chrome.extension.onMessage.addListener(
function (message, sender, sendResponse) {
console.log("Width recieved is " + message);
});
如果您需要更多信息,請與我們聯系。
聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.