私人JavaScript小部件

Posted 2021-04-13

我正在考虑开始一个新项目。该项目的前提是在我的网站上生成一个小部件，然后将一段javascript复制到您的网站中，然后中提取您的小部件。

这是polldady.com，twiig.com和addthis.com等现有服务的新动力。

许多此类服务旨在公开访问。这意味着小部件供应商并不关心您是否将数据发回给他们。事实上，他们鼓励尽可能广泛地传播小部件。

但是我的服务有一个独特的变化。在我的情况下，虽然小部件将向公众开放，但我需要确保发起的帖子请求仅来自预期的站点。

由于这些javascript小部件的xss问题，我需要动态创建一个iframe来呈现我的小部件。

是否有处理此类交互的身份验证模型？

答案

首先，使用iframe违反了Same Origin Policy。使用普通的旧JavaScript，你可以创建一个<form>并调用.submit()在任何地方发出这个帖子请求。实际上，这就是基于POST的CSRF漏洞利用的工作原理。您可以检查此POST请求的referer，但是如果它来自https页面，则此值将为空。 （然后你可以拒绝服务......）。将document.location作为POST变量发送是不可取的，因为修改此小部件以报告修改后的值是微不足道的。但是，传入的http请求中包含的引用是off limits to the website's operator。

另一答案

(function(){

  var makeCar = function(){
    // private variable

    var fuel = 0;
    console.log("call new car");
    // private method

    function burnFuel(){
      fuel-=10;
      console.log('Burned fuel [10]');
    }

    return {
	
	  check: function(){
	  
	 console.log("checkfuel:"+fuel);
	  },	   
      accelerate : function(){
        if(fuel > 0){
          burnFuel();
        }else{
          console.log('Out of gas. Fill now.');
        }
      },

      fillGas : function(gas){
        if(fuel <= 100){
          fuel += gas;
        }else{
          console.log('Reached capacity. Stop spilling.');
        }
      }
    }

  };

  var carA= makeCar();
  carA.check();
  carA.fillGas(200);
  carA.check();   
  carA.accelerate();
  carA.check();
  carA.accelerate();
  carA.check();
  carA.fillGas(400);
  carA.check();
}());

以上是关于私人JavaScript小部件的主要内容，如果未能解决你的问题，请参考以下文章

此应用小部件片段中所有意图 (PendingIntents) 的逻辑流

单击主屏幕小部件时如何打开特定片段

AppCompat v22.1.0 没有为片段正确主题化所有 xml 小部件

如何更新导航抽屉中的有状态小部件，同时在 Android 中保持与片段相同的类？

ListView 不可点击，行中的所有小部件都是 TextView

有趣的网页小部件笔记