浏览器如何获知请求文件的哈希值？如何获取integrity属性的哈希值？

先修正你给出的示例代码（补全闭合标签并补充常用的crossorigin属性）：

<script src="https://code.jquery.com/jquery-3.3.1.slim.min.js" integrity="sha384-q8i/X+965DzO0rT7abK41JStQIAqVgRVzpbzo5smXKp4YfRvH+8abtTE1Pi6jizo" crossorigin="anonymous"></script>

一、浏览器如何获知请求文件的哈希值？ #

浏览器直接读取你写在integrity属性里的哈希值。当它下载完外部脚本后，会用属性里指定的哈希算法（比如示例中的sha384）对文件内容重新计算哈希，再和integrity中的值做比对：

• 匹配的话，说明文件未被篡改或损坏，正常执行脚本；
• 不匹配的话，浏览器会直接拒绝加载该脚本，避免恶意或错误代码运行。

二、从何处获取可用的integrity属性值？ #

有两种常用途径：

• 官方CDN直接提供：jQuery、React这类流行前端库的官方CDN，会在给出脚本链接的同时，附带带integrity属性的完整代码片段，直接复制使用即可。
• 自行生成哈希值：如果是自己托管的脚本，用本地工具计算：
  • Linux/macOS终端：执行shasum -a 384 你的脚本文件名得到哈希字符串，转成base64编码后，加上前缀sha384-就是integrity的值；
  • Windows PowerShell：执行Get-FileHash -Path 你的脚本文件名 -Algorithm SHA384获取哈希，将哈希字符串转成base64编码后，加上对应算法前缀；
  • Node.js脚本：用内置crypto模块计算，示例代码：

    const crypto = require('crypto');
    const fs = require('fs');
    
    const content = fs.readFileSync('./your-script.js');
    const hash = crypto.createHash('sha384').update(content).digest('base64');
    console.log(`sha384-${hash}`);
    

  注意：integrity值的格式必须是[算法名]-[base64编码的哈希值]，常用算法有sha256、sha384、sha512。

内容的提问来源于stack exchange，提问作者Riya Abraham