一站式网上办事大厅

小明：最近我们在做“一网通办服务平台”的前端开发，但领导特别强调要重视安全问题。

小李：对，前端安全确实不能忽视。比如我们得防止XSS攻击，还有CSRF之类的。

小明：那具体怎么实现呢？有没有什么代码示例？

小李：当然有。比如在渲染用户输入内容时，我们可以使用Vue的v-text或者React的dangerouslySetInnerHTML来避免注入攻击。

小明：那是不是应该用HTML转义库？

小李：没错，比如使用DOMPurify来清理用户输入的内容，防止恶意脚本执行。

小明：那CSRF防护怎么做？

小李：可以在前端设置一个全局的token，每次请求带上它，并在后端验证。例如，在axios中添加拦截器自动附加token。

小明：那我写个简单的代码看看。

小李：好的，下面是一个例子：

// 使用axios拦截器添加token
axios.interceptors.request.use(config => {
  const token = localStorage.getItem('token');
  config.headers['X-CSRF-TOKEN'] = token;
  return config;
});
    

小明：明白了，这样就能有效防止CSRF攻击了。

小李：是的，同时我们还要注意前端存储敏感信息的安全，比如不要把密码明文存入localStorage。

小明：那我们应该用加密的方式存储，或者使用HttpOnly的Cookie。

小李：没错，这些都是前端安全的重要点。总之，“一网通办”平台的前端不仅要好用，更要安全。