Question

我正在尝试将当前标签页面发送到资源服务{in param}。但是全局tablUrl没有任何价值 var url =“http：// [localhost] / getProfile？domain =”+ tabUrl

但是记录在：

console.log(tabUrl);

这是我的代码：

var tabUrl;
angular.module('jsonService', ['ngResource'])
.factory('JsonService', function($resource) {
        chrome.tabs.getSelected(null, function(tab) {
        tabUrl = tab.url;
        console.log(tabUrl);
    });
    var url = "http://[localhost]/getProfile?domain="+tabUrl
  return $resource(url,{}, {
    list : {
      method : 'GET',
     cache : true
    }
 });
});

模板绑定：

  <body ng-controller="extensionCtrl">

这是控制器：

app.controller('extensionCtrl', function($scope , JsonService) {
 JsonService.get(function(data){
   $scope.data = data;
  });
 });

Answer 1

第一：请不要使用已弃用的 chrome.tabs.getSelected 。请改用 chrome.tabs.query 。

第二： chrome.tabs.getSelected / chrome.tabs.query 异步。这意味着在后台执行某些工作时继续执行，并在完成后调用指定的回调所以，在这种情况下：

line 1: chrome.tabs.getSelected(null, funkyCallback);
line 2: var url = ...
line 3: return $resource(...);

......可能的（非常可能的）执行顺序是：

1. chrome.tabs.getSelected (starts retrieving the active tab in the background)
2. line 2 gets executed (at this time 'tabURL' is not set yet)
3. line 3 gets executed (returning something)
4. Once the the active tab is retrieved, 'funkyCallback' is called
   (setting 'tabURL' after it is too late).

使用异步API（例如大多数 chrome。* API）时，必须更改脚本的整个逻辑以符合API调用的异步性质。 / p> 例如，你可以得到相同的结果：

<强> HTML：

<html ng-app="jsonService">
    ...
    <body ng-controller="extensionCtrl">
        <p>{{jsonData}}</p>
        ...

<强> JS：

var app = angular.module("jsonService", ["ngResource"]);

app.factory("JsonFactory", function($resource) {
    var url = "http://localhost/getProfile?domain=:tabUrl";
    var retObj = $resource(url, {}, {
        list: {
            method: "GET",
            cache: true
        }
    });
    return retObj;
});

app.controller("extensionCtrl", function($q, $rootScope, JsonFactory) {
    chrome.tabs.query({ active: true }, function(tabs) {
        JsonFactory.list({ tabUrl: tabs[0].url }, function(data) {
            // On success...
            $rootScope.jsonData = data;
        }, function(data) {
            // On error...
            $rootScope.jsonData = "Error using JsonFactory.list(...) !";
        });
    });
});

另请参阅此 short demo 执行类似异步

的操作

在角度资源获取中将当前选项卡URL传递给服务器

1 个答案: